博客

PyQt5 – 右侧的单选按钮指示灯

  • Post category:Python

下面是详细的Python PyQt5右侧的单选按钮指示灯使用攻略。

问题描述

在 PyQt5 中，我们经常会碰到要实现单选按钮的需求。有时我们需要在单选按钮旁边显示一个指示灯，以便用户通过颜色快速了解单选按钮的状态。本文就来详细讲解如何实现这样的效果。

解决方案

实现“PyQt5 – 右侧的单选按钮指示灯”的方法和思路很简单，就是通过Qt的QBoxLayout和QButtonGroup两个类来实现。具体过程可以分为如下3个步骤：

  1. 创建单选按钮和指示灯

在Qt中，可以通过QCheckBox类来实现带有单选效果的按钮，通过QPushButton类来实现指示灯。在创建单选按钮时，还需要为其设置ID，以方便后续使用QButtonGroup类来管理它们。创建完毕后，将单选按钮和指示灯添加到QBoxLayout布局中即可。

  1. 实现单选按钮状态改变后的指示灯变化效果

为了实现单选按钮状态改变后指示灯的变化效果，我们需要在单选按钮绑定一个状态改变的槽函数，同时在槽函数中对指示灯进行状态改变。这里有两种实现方法，一种是通过QPushButton的setStyleSheet()方法改变指示灯的颜色，另一种是通过QPushButton的setIcon()方法设置指示灯的图标。具体使用哪种方法根据需求来决定。

  1. 设置单选按钮的样式

最后，为了让单选按钮和指示灯组合显示效果更好，我们还需要设置一下单选按钮的样式。这里采用了一些CSS样式来实现，具体样式可以根据自己的实际需求来设置。

示例说明

示例1

下面是一个简单的例子，演示了如何通过指示灯的颜色来显示单选按钮的状态。

from PyQt5.QtWidgets import QApplication, QHBoxLayout, QButtonGroup, QCheckBox, QPushButton, QWidget
from PyQt5.QtGui import QColor
from PyQt5.QtCore import Qt

class Example(QWidget):
    def __init__(self):
        super().__init__()

        self.initUI()


    def initUI(self):
        hbox = QHBoxLayout()
        group = QButtonGroup()

        btn1 = QCheckBox('Radio Button 1', self)
        btn1.setStyleSheet('QCheckBox::indicator:checked { background-color: red }')
        group.addButton(btn1, 1)
        btn1.toggled.connect(lambda:self.btnState(btn1, group))
        hbox.addWidget(btn1)

        led1 = QPushButton()
        led1.setFixedSize(20, 20)
        led1.setCheckable(True)
        led1.setStyleSheet('QPushButton:checked { background-color: red }')
        hbox.addWidget(led1)

        btn2 = QCheckBox('Radio Button 2', self)
        btn2.setStyleSheet('QCheckBox::indicator:checked { background-color: green }')
        group.addButton(btn2, 2)
        btn2.toggled.connect(lambda:self.btnState(btn2, group))
        hbox.addWidget(btn2)

        led2 = QPushButton()
        led2.setFixedSize(20, 20)
        led2.setCheckable(True)
        led2.setStyleSheet('QPushButton:checked { background-color: green }')
        hbox.addWidget(led2)

        self.setLayout(hbox)
        self.setGeometry(300, 300, 350, 250)
        self.setWindowTitle('Example')
        self.show()


    def btnState(self, btn, group):
        if btn.isChecked():
            for i in group.buttons():
                if i != btn:
                    i.setChecked(False)


if __name__ == '__main__':
    app = QApplication([])
    ex = Example()
    app.exec_()

在这个例子中我们创建了两个单选按钮，分别对应着红色和绿色两种状态，然后为每个单选按钮都绑定了状态改变的槽函数。在槽函数中，我们通过QButtonGroup来管理单选按钮，只允许其中一个单选按钮checked，而其他单选按钮则设置为unchecked。此外，我们也为每个单选按钮旁设置了一个指示灯，通过设置其背景颜色来显示单选按钮的状态。

示例2

下面是另一个例子，演示了如何通过指示灯的图标来显示单选按钮的状态。

from PyQt5.QtWidgets import QApplication, QHBoxLayout, QButtonGroup, QCheckBox, QPushButton, QWidget
from PyQt5.QtGui import QIcon

class Example(QWidget):
    def __init__(self):
        super().__init__()

        self.initUI()


    def initUI(self):
        hbox = QHBoxLayout()
        group = QButtonGroup()

        btn1 = QCheckBox('Radio Button 1', self)
        group.addButton(btn1, 1)
        btn1.toggled.connect(lambda:self.btnState(btn1, button1, group))
        hbox.addWidget(btn1)

        led1 = QPushButton()
        led1.setFixedSize(20, 20)
        led1.setCheckable(True)
        led1.setIcon(QIcon('red_led.png'))
        hbox.addWidget(led1)

        btn2 = QCheckBox('Radio Button 2', self)
        group.addButton(btn2, 2)
        btn2.toggled.connect(lambda:self.btnState(btn2, button2, group))
        hbox.addWidget(btn2)

        led2 = QPushButton()
        led2.setFixedSize(20, 20)
        led2.setCheckable(True)
        led2.setIcon(QIcon('green_led.png'))
        hbox.addWidget(led2)

        self.setLayout(hbox)
        self.setGeometry(300, 300, 350, 250)
        self.setWindowTitle('Example')
        self.show()


    def btnState(self, btn, led, group):
        if btn.isChecked():
            for i in group.buttons():
                if i != btn:
                    i.setChecked(False)
            led.setChecked(True)
        else:
            led.setChecked(False)


if __name__ == '__main__':
    app = QApplication([])
    ex = Example()
    app.exec_()

在这个例子中，我们为指示灯设置了两张图片：红灯和绿灯。当单选按钮选中时，对应的指示灯将显示相应的图标，而其他指示灯则不显示。另外，我们给指示灯设置了一个大小固定的区域，并为其设置了一个图标。这样图标在指示灯中居中显示，配合单选按钮就实现了右侧的单选按钮指示灯效果。

总结

在这份攻略中，我们介绍了如何使用PyQt5实现右侧的单选按钮指示灯效果，其中，我们通过QButtonGroup和QBoxLayout两个类实现了单选按钮和指示灯的管理和布局，实现了单选按钮checked状态的切换和相应指示灯的变化，最后通过设置指示灯的样式使其与单选按钮组合显示效果更好。

Tags: