iT邦幫忙

2021 iThome 鐵人賽

DAY 21
0
Software Development

【今年還是不夠錢買psQQ,不如我們用PyQt自己寫一個】系列 第 21

【沒錢買ps,PyQt自己寫】Day 21 - 透過 PyQt 實現滑鼠監聽總整理,完全掌握滑鼠控制 (listen mouse)

  • 分享至 

  • xImage
  •  

看完這篇文章你會得到的成果圖

前言

這一篇我們會拿現有的 day 17 成品來改,
我們這篇主要要學習的是滑鼠的監聽事件完全掌握。

之前內容的重點複習 (前情提要)

我們接下來的討論,會基於讀者已經先讀過我 day5 文章 的架構下去進行程式設計
如果還不清楚我程式設計的邏輯 (UI.py、controller.py、start.py 分別在幹麻)
建議先閱讀 day5 文章後再來閱讀此文。

https://www.wongwonggoods.com/python/pyqt5-5/

此篇文章的範例程式碼 github

https://github.com/howarder3/ironman2021_PyQt5_photoshop/tree/main/day21_mouse_control

UI 部分

這篇文章的 UI 我們直接沿用 Day 17 的內容,
所以這部分沒什麼好多說的,也不是我們這篇文的重點。

PyQt 滑鼠的完全控制總整理

我們先來看看官方文件

關於滑鼠可以用的函數們

我們是監聽 Qlabel (圖片)裡面的事件,所以我們查詢的文件位於 QLabel 底下。

我們可以看到,一共可以監聽的滑鼠事件有:

  • mousePressEvent:按下滑鼠時的反應
  • mouseReleaseEvent:鬆開滑鼠時的反應
  • mouseMoveEvent:移動滑鼠時的反應

而這些動作都會觸發一個 "QMouseEvent",我們再來去看看 QMouseEvent 有什麼

QMouseEvent 能使用的函數

看起來 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


★ 本文也同步發於我的個人網站(會有內容目錄與顯示各個小節,閱讀起來更流暢):【PyQt5】Day 21 - 透過 PyQt 實現滑鼠監聽總整理,完全掌握滑鼠控制 (listen mouse)


上一篇
【沒錢買ps,PyQt自己寫】Day 20 - PyQt 最重要的 QThread 概念 / 為什麼 windows, mac, ubuntu (linux) 程式會「沒有回應」?
下一篇
【沒錢買ps,PyQt自己寫】Day 22 - PyQt 視窗的個性化/屬性控制 setWindowFlags,禁止放大縮小、永遠顯示於最上層/最下層
系列文
【今年還是不夠錢買psQQ,不如我們用PyQt自己寫一個】30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言