QT 學習筆記 – 軟體安裝與Dragdrop範例

工作上用 QT 已經有一陣子了,雖然部門裡只有我一個人在用,但是其它人在用的 Java 和 C# 看起來實在不熟悉,感覺入門又要更久了。學習QT的過程中,也是一直拼拼湊湊,比起純粹的C,原理的確是不求甚解。想說把自己學習 QT 的知識,紀錄下來,這樣下次就不用再拼湊了~ 畢竟這不是工作中的主要程式語言,不常用記不住。

QT 使用版本

本文 QT 使用的版本是 qt-opensource-windows-x86-mingw492-5.6.2.exe,可以直接在網上搜檔名,以後位置如果變更也可以下載的到。安裝的話,一直下一步即可。之前測試的過程中,發現有些例子在不同版本會不相容,請儘量使用此版本,以確保可產生同樣的結果。

QT安裝畫面

導入 Dragdrop 範例

開啟 「Qt Creator」,選擇「範例」,再搜尋中選擇輸入 「drag」,選擇 「Draggable Icons Example」。

導入範例

畫面會跳出一個說明,直接關掉即可。還有一個 Configure Project 的對話框,直接按下「Configure Project」即可。

接著按下執行,可以看到出現左右兩個區域,裡面的 ICON 在同區域拖拉會移動位置,而跨區則可複製一份。

程式執行畫面

程式碼說明

這個範例的主體是 class DragWidget,是由 QFrame 所洐生出來的,其包含4個成員函式。

  • mousePressEvent: 滑鼠按下,準備開始拖拉
  • dragEnterEvent: 拖拉進入區域
  • dragMoveEvent: 拖拉移動
  • dropEvent: 滑鼠放開 drop

main() 中會產生一個 QHBoxLayout ,然後使用 addWidget 來加入兩個 dragWidget 的 instances。dragWidget 的 constructor 會產生三個 icon,這邊的 icon 是以 QLabel 來實現的,其圖示是以 setPixmap() 來指定圖檔,造成 icon 的效果。

mousePressEvent()

mousePresssEvent() 是在滑鼠按下時觸發的,程式首先透過 childAt(event->pos())取得該位置的QLabel元件,有取到才繼續。透過一些資料的操作,該 Label 的 pixmap 與 pos 被存入了 QDrag 的新物件中,QDrag 的 pixmap 也被設為拖拉的圖示,而原 QLabel 的 pixmap 則被改為網點。

最後呼叫了 drag->exec () 來執行拖拉的行為,當拖拉行為返回時,若動作是 MOVE,則舊的 QLabel 會被 close (刪除)。否則則是恢復其 pixmap,顯示原狀。這也就是一開始講的,同區域就移動跨區域就複製。所以所謂的 MOVE,其實是在新位置複製一份,再刪除舊的。

 

dragEnterEvent() and dragMoveEvent()

這兩個 event 分別是在移到和進入不同區域時呼叫,首先判斷這個 event 的來源是不是 “application/x-dnditemdata”,這是在一開始 drag 時設置的,若有才代表是原先的動作,不是則忽略。

接著判斷來源於是否等於目前的區域,若是同區的,則動作永遠設為 MOVE。不同區則依照系統的,這也是符合同區為移動,跨區為產生新的行為設定。

 

dropEvent()

最後則是當滑鼠放開的 dropEvent,如同前面,也是先判斷這個 event 的來源是不是 “application/x-dnditemdata”。將之前存入 QDrag 的一些參數,從 QDropEvent 中取出。接著產生一個新的 QLabel,設定其 pixmap 與位置。接著一樣是根據其來源,設定其為 MOVE 或接受系統設定。

 

透過上面這幾個 event 的實現,就可以完成 dragdrop 的行為了。

結語

乍看之下有點不太懂,但仔細花點時間琢磨,還是能懂程式在寫什麼 : )

Leave a Reply