快捷導(dǎo)航

Python?PyQt拖動控件對齊到網(wǎng)格的方法步驟

更新時間：2022年12月30日 11:39:21 作者：@蘇丶

pyqt是一個用于創(chuàng)建GUI應(yīng)用程序的跨平臺工具包,它將python與qt庫融為一體,下面這篇文章主要給大家介紹了關(guān)于Python?PyQt拖動控件對齊到網(wǎng)格的方法步驟,需要的朋友可以參考下

實現(xiàn)如下需求：

在PyQt界面上有一個控件，實現(xiàn)其可任意拖動，且鼠標釋放時自動對齊到網(wǎng)格。

1.控件任意拖動并對齊到網(wǎng)格

如下按鈕(尺寸100×100)，可任意拖動，釋放時對齊到網(wǎng)格(網(wǎng)格尺寸100×100)

首先給出代碼

from PyQt5.QtWidgets import QPushButton, QMainWindow, QApplication


class Button(QPushButton):
    def __init__(self, parent=None):
        super().__init__(parent)
        self.resize(100, 100)

        self.pos1 = 0  # 用于拖動時的鼠標位置初始值

    def mousePressEvent(self, QMouseEvent):
        self.pos1 = QMouseEvent.screenPos()

    def mouseReleaseEvent(self, QMouseEvent) -> None:
        fx, fy = self.frameGeometry().x(), self.frameGeometry().y()  # 相對父控件坐標
        tx_index, ty_index = fx // 100 if fx > 99 else 0, fy // 100 if fy > 99 else 0
        # 移動到網(wǎng)格上
        self.mymove(tx_index, ty_index)

    def mouseMoveEvent(self, QMouseEvent):
        pos2 = QMouseEvent.screenPos()
        tx = int(self.frameGeometry().x() + pos2.x() - self.pos1.x())
        ty = int(self.frameGeometry().y() + pos2.y() - self.pos1.y())
        self.move(tx, ty)
        self.pos1 = pos2

    def mymove(self, tx_index, ty_index):
        self.move(tx_index * 100, ty_index * 100)

class MainWindow(QMainWindow):
    def __init__(self):
        super().__init__()

        self.setWindowTitle('按鈕測試')
        self.resize(500, 500)

        self.btn = Button(self)
        self.btn.setText('ABCD')

if __name__ == "__main__":
    import sys

    app = QApplication(sys.argv)
    mw = MainWindow()
    mw.show()
    sys.exit(app.exec_())

這里自定義Button類繼承QPushButton類，因為我們需要重寫鼠標移動的方法來實現(xiàn)所需功能。

要實現(xiàn)任意拖動，按鈕必須跟隨鼠標，于是我們重寫mousePressEvent方法和mouseMoveEvent方法。

當我們按下鼠標時，觸發(fā)mousePress事件，記錄此刻光標位置；
當光標拖動時觸發(fā)mouseMove事件，獲取當前光標位置，計算與之前位置的x和y的差值，然后加到按鈕的相對坐標上，獲得按鈕需要移動到的位置坐標；
調(diào)用move方法移動按鈕；
更新pos1即按鈕位置；
只要光標移動，就會觸發(fā)mouseMove事件，就會不斷移動按鈕與更新按鈕位置，在視覺上按鈕就是在跟著光標任意拖動。

要實現(xiàn)鼠標釋放時對齊到網(wǎng)格，需要重寫mouseReleaseEvent方法，用來響應(yīng)鼠標釋放動作。

當鼠標釋放時，立即讀取按鈕的當前相對坐標；
將按鈕的坐標除以100用來獲取其在網(wǎng)格上的位置，如果坐標小于0應(yīng)令其等于0，同時0-99的坐標除以100也等于0，于是只要小于99就等于0；
然后調(diào)用自定義的mymove方法，在這個方法中，將網(wǎng)格位置換算到相對坐標，再調(diào)用move方法使其移動到網(wǎng)格。

2.進階：雙擊控件使其移動到其他網(wǎng)格

移動并對齊到網(wǎng)格的功能已經(jīng)在上一部分實現(xiàn)了，這里需要實現(xiàn)鼠標雙擊動作，首先給出代碼

from PyQt5.QtWidgets import QPushButton, QMainWindow, QApplication
from PyQt5.QtCore import Qt


class Button(QPushButton):
    def __init__(self, parent=None):
        super().__init__(parent)
        self.resize(100, 100)

        self.pos1 = 0  # 用于拖動時的鼠標位置初始值
        self.x_index, self.y_index = 0, 0  # 記錄按鈕在網(wǎng)格上的位置

    def mousePressEvent(self, QMouseEvent):
        if QMouseEvent.buttons() == Qt.LeftButton:
            print('左鍵按下')
            self.pos1 = QMouseEvent.screenPos()
        elif QMouseEvent.buttons() == Qt.RightButton:
            print('右鍵按下')
            self.pos1 = QMouseEvent.screenPos()

    def mouseReleaseEvent(self, QMouseEvent) -> None:
        print('鼠標釋放')
        fx, fy = self.frameGeometry().x(), self.frameGeometry().y()  # 相對父控件坐標
        tx_index, ty_index = fx // 100 if fx > 99 else 0, fy // 100 if fy > 99 else 0
        # 移動到網(wǎng)格上
        self.x_index, self.y_index = tx_index, ty_index
        self.mymove(tx_index, ty_index)

    def mouseDoubleClickEvent(self, QMouseEvent):
        if QMouseEvent.buttons() == Qt.LeftButton:
            print('左鍵雙擊')
            self.x_index += 1
            self.y_index += 1
            self.mymove(self.x_index, self.y_index)
        elif QMouseEvent.buttons() == Qt.RightButton:
            print('右鍵雙擊')

    def mouseMoveEvent(self, QMouseEvent):
        if QMouseEvent.buttons() == Qt.LeftButton:
            pos2 = QMouseEvent.screenPos()
            tx = int(self.frameGeometry().x() + pos2.x() - self.pos1.x())
            ty = int(self.frameGeometry().y() + pos2.y() - self.pos1.y())
            self.move(tx, ty)
            self.pos1 = pos2

    def mymove(self, tx_index, ty_index):
        self.move(tx_index * 100, ty_index * 100)
        print(f'按鈕移動到({tx_index}, {ty_index})')

class MainWindow(QMainWindow):
    def __init__(self):
        super().__init__()

        self.setWindowTitle('按鈕測試')
        self.resize(500, 500)

        self.btn = Button(self)
        self.btn.setText('ABCD')

if __name__ == "__main__":
    import sys

    app = QApplication(sys.argv)
    mw = MainWindow()
    mw.show()
    sys.exit(app.exec_())

在這里多了一些實例屬性，如self.x_index, self.y_index用來記錄按鈕在網(wǎng)格上的位置。

要實現(xiàn)雙擊動作，必須重寫mouseDoubleClickEvent方法，在mouseDoubleClickEvent方法中，我們首先將self.x_index, self.y_index進行修改，以更改按鈕要移動到的位置，然后調(diào)用mymove方法進行移動。

此外，代碼還進行了左鍵與右鍵的判斷，當左鍵進行操作時，按鈕可以更改位置，右鍵操作時不可更改。