博客

PyQt5 – 当鼠标悬停在推送按钮上时改变其背景颜色

  • Post category:Python

下面详细讲解一下Python的PyQt5中如何实现当鼠标悬停在推送按钮上时改变其背景颜色的方法。

前置知识

在学习这个方法之前，需要了解以下知识：

  • PyQt5
  • 信号和槽
  • 样式表

实现步骤

1.创建GUI界面

首先需要创建一个带有按钮的GUI界面，这里我们使用PyQt5创建一个简单的界面。

import sys
from PyQt5.QtWidgets import QApplication, QWidget, QPushButton

class App(QWidget):
    def __init__(self):
        super().__init__()
        self.title = 'PyQt5 mouse hover color'
        self.left = 100
        self.top = 100
        self.width = 300
        self.height = 100
        self.initUI()

    def initUI(self):
        self.setWindowTitle(self.title)
        self.setGeometry(self.left, self.top, self.width, self.height)

        QBtn = QPushButton('Button', self)
        QBtn.setToolTip('This is a button')
        QBtn.clicked.connect(self.on_click)
        QBtn.move(100, 50)
        self.show()

    def on_click(self):
        print('PyQt5 button click')

2.设置悬停时的样式

使用样式表（QSS）可以改变鼠标悬停在按钮上的颜色。在initUI方法中，可以添加以下代码。

QBtn.setStyleSheet("background-color: red;")   # 定义按钮的样式
QBtn.setStyleSheet("QPushButton:hover{background-color: yellow;}")

使用第一行代码设置了按钮的初始样式为红色，使用第二行代码定义了鼠标悬停时按钮的样式为黄色。

完整的代码如下：

def initUI(self):
    self.setWindowTitle(self.title)
    self.setGeometry(self.left, self.top, self.width, self.height)

    QBtn = QPushButton('Button', self)
    QBtn.setToolTip('This is a button')
    QBtn.clicked.connect(self.on_click)
    QBtn.move(100, 50)

    QBtn.setStyleSheet("background-color: red;")
    QBtn.setStyleSheet("QPushButton:hover{background-color: yellow;}")

    self.show()

在鼠标悬停时，按钮的背景颜色将会由红色变为黄色。

3.使用QEvent事件设置悬停样式

另一种设置鼠标悬停时背景颜色的方法是使用QEvent事件。在该方法中，我们需要判断鼠标是否悬停在按钮上，并根据条件来设置按钮的样式。

在initUI方法中，可以添加以下代码。

QBtn.installEventFilter(self)

def eventFilter(self, object, event):
    if event.type() == QEvent.HoverEnter:   # 判断鼠标是否进入
        QBtn.setStyleSheet("background-color: yellow;")
    elif event.type() == QEvent.HoverLeave:   # 判断鼠标是否离开
        QBtn.setStyleSheet("background-color: red;")
    return super().eventFilter(object, event)

该代码中，我们使用installEventFilter方法在按钮上安装一个事件过滤器。并使用eventFilter方法对鼠标事件进行过滤。

在鼠标悬停时，按钮的背景颜色将会由红色变为黄色。

完整的代码如下：

from PyQt5.QtWidgets import QApplication, QWidget, QPushButton
from PyQt5.QtCore import QEvent

class App(QWidget):
    def __init__(self):
        super().__init__()
        self.title = 'PyQt5 mouse hover color'
        self.left = 100
        self.top = 100
        self.width = 300
        self.height = 100
        self.initUI()

    def initUI(self):
        self.setWindowTitle(self.title)
        self.setGeometry(self.left, self.top, self.width, self.height)

        QBtn = QPushButton('Button', self)
        QBtn.setToolTip('This is a button')
        QBtn.clicked.connect(self.on_click)
        QBtn.move(100, 50)

        QBtn.setStyleSheet("background-color: red;")

        QBtn.installEventFilter(self)

        self.show()

    def on_click(self):
        print('PyQt5 button click')

    def eventFilter(self, object, event):
        if event.type() == QEvent.HoverEnter:
            QBtn.setStyleSheet("background-color: yellow;")
        elif event.type() == QEvent.HoverLeave:
            QBtn.setStyleSheet("background-color: red;")
        return super().eventFilter(object, event)

if __name__ == '__main__':
    app = QApplication(sys.argv)
    ex = App()
    sys.exit(app.exec_())

以上就是实现PyQt5中当鼠标悬停在按钮上时改变其背景颜色的两种方法了。

Tags: