看完這篇文章你會得到的成果圖
前言
這一篇我們會拿現有的 day 17 成品來改，
我們這篇主要要學習的是滑鼠的監聽事件完全掌握。
之前內容的重點複習 (前情提要)
我們接下來的討論，會基於讀者已經先讀過我 day5 文章 的架構下去進行程式設計
如果還不清楚我程式設計的邏輯 (UI.py、controller.py、start.py 分別在幹麻)
建議先閱讀 day5 文章後再來閱讀此文。
【PyQt5】Day 5 – 開始來設計我們的 controller.py，改以「程式角度」來說明如何建立 PyQt 的系統
此篇文章的範例程式碼 github
https://github.com/howarder3/ironman2021_PyQt5_photoshop/tree/main/day21_mouse_control
UI 部分
這篇文章的 UI 我們直接沿用 Day 17 的內容，
所以這部分沒什麼好多說的，也不是我們這篇文的重點。
PyQt 滑鼠的完全控制總整理
我們先來看看官方文件
關於滑鼠可以用的函數們
- 官方文件連結：QLabel Class
我們是監聽 Qlabel (圖片)裡面的事件，所以我們查詢的文件位於 QLabel 底下。
我們可以看到，一共可以監聽的滑鼠事件有：
- mousePressEvent：按下滑鼠時的反應
- mouseReleaseEvent：鬆開滑鼠時的反應
- mouseMoveEvent：移動滑鼠時的反應
而這些動作都會觸發一個 “QMouseEvent”，我們再來去看看 QMouseEvent 有什麼
QMouseEvent 能使用的函數
- 官方文件連結：QMouseEvent Class
看起來 PyQt 有完整的能夠幫我們紀錄滑鼠各種事件細節的功能，這篇我們就來使用看看
測試上述功能
我們修改 day17 的 img_controller.py，修改&新增以下內容：
- 為了方便比較，我們先暫持移除 set_clicked_position 的功能。
self.ui.label_img.mousePressEvent = self.show_mouse_press # set_clicked_position
self.ui.label_img.mouseReleaseEvent = self.show_mouse_release
self.ui.label_img.mouseMoveEvent = self.show_mouse_move
並新增下面對應的功能 function
def show_mouse_press(self, event):
print("[show_mouse_press]", event)
def show_mouse_release(self, event):
print("[show_mouse_release]",event)
def show_mouse_move(self, event):
print("[show_mouse_move]",event)
結果
我們可以發現，不論是按下去、(按下狀態時)移動、放開滑鼠，
我們的事件都有以 QMouseEvent 的形式被記錄下來。
使用 QMouseEvent 的提供的方法
再來我們觀察 QMouseEvent 內部提供的方法，
這邊因為功能很多，我就只先試未來我很有可能會用到的。
特別著重在：我要知道「按下去位置」、「移動位置」、「鬆開位置」，
並知道「左鍵還是右鍵」。
找出滑鼠移動的各種位置
我們依照文件修改一下剛剛的 function
def show_mouse_press(self, event):
print(f"[show_mouse_press] {event.x()=}, {event.y()=}, {event.button()=}")
def show_mouse_release(self, event):
print(f"[show_mouse_release] {event.x()=}, {event.y()=}, {event.button()=}")
def show_mouse_move(self, event):
print(f"[show_mouse_move] {event.x()=}, {event.y()=}, {event.button()=}")
結果
這是一段我測試時的操作
我們可以整理出一個結果，
滑鼠的 x, y
關於滑鼠移動的 x, y，我們可以透過上述的方式直接取得，
中間 x, y，代表著滑鼠移動的軌跡。
滑鼠的按鍵 button()
event.button() = 0：沒有按鍵輸入
event.button() = 1：滑鼠左鍵
event.button() = 2：滑鼠右鍵
到此，我們掌握了大部分我在滑鼠會使用的功能，
之後我們會透過這些函數加以運用。
Reference
- 官方文件連結：QLabel Class
- 官方文件連結：QMouseEvent Class
