PyQt富文本按钮QSS样式问题：选中态文本颜色异常

问题描述 #

我实现了一款继承自QPushButton的QPushButtonRT按钮，通过内嵌QLabel实现富文本渲染功能（该功能正常）。目前QSS可以正常切换按钮选中/未选中状态的背景色，但内嵌QLabel的文本颜色无法按预期随选中状态变化：普通QPushButton的文本颜色能正常切换，而QPushButtonRT的文本颜色仅由QSS规则的定义顺序决定，完全不受按钮选中状态影响。

相关代码 #

QPushButtonRT实现代码 #

class QPushButtonRT(QPushButton):
    """
    Subclass QPushButton, using QLabel to render rich text
    """
    def __init__(self, parent=None, text=None, margin=10, **kwargs):
        if parent is not None:
            super().__init__(parent, **kwargs)
        else:
            super().__init__(**kwargs)
        self.__lbl = QLabel(self)
        self.margin = margin
        if text is not None:
            self.__lbl.setText(text)
        self.__lyt = QHBoxLayout()
        self.__lyt.setSpacing(0)
        self.setLayout(self.__lyt)
        # Make QLabel transparent except for painted pixels:
        self.__lbl.setAttribute(Qt.WA_TranslucentBackground)
        # Disable delivery of mouse events to QLabel and its children,
        # passing the events along to QPushButton:
        self.__lbl.setAttribute(Qt.WA_TransparentForMouseEvents)
        self.__lbl.setSizePolicy(QSizePolicy.Expanding, QSizePolicy.Expanding)
        self.__lbl.setTextFormat(Qt.RichText)
        self.__lyt.addWidget(self.__lbl, Qt.AlignHCenter)
        return

    def setText(self, text):
        self.__lbl.setText(text)
        self.updateGeometry()
        return

    def sizeHint(self):
        is_checked = self.isChecked()
        self.setChecked(False)  # always base sizeHint on unchecked state
        s = QPushButton.sizeHint(self)
        w = self.__lbl.sizeHint()
        s.setWidth(w.width() + 2 * self.margin)
        self.setChecked(is_checked)
        return s

原QSS配置 #

QPushButton{background-color: #505050;}         /* background for both QPushButton and QPushButtonRT */
.QPushButton{color: white; font-weight: bold;}  /* text color QPushButton only */

QPushButton QLabel{color:white; font-weight: bold;} /* text color QPushButtonRT only (1) */
QPushButton:checked QLabel{color:black;}            /* text color QPushButtonRT only (2) */

/* Define 'border' to avoid "grey dots" due to transparent border overlay */
QPushButton:checked {background-color:lightblue; border: none;} /* QPushButton and QPushButtonRT */
.QPushButton:checked{color:black; font-weight: bold;} /* QPushButton only */

问题分析 #

Qt样式表中，父控件状态变化时，子控件的样式匹配依赖选择器的优先级和状态关联逻辑。原QSS中QPushButton:checked QLabel与QPushButton QLabel的选择器优先级相同，此时样式规则会以定义顺序覆盖，而非根据父控件的状态动态切换，导致选中状态下的QLabel文本颜色规则不生效。

解决方案 #

方案1：使用子元素选择器提升优先级 #

修改QSS中针对QLabel的选中状态规则，使用>子元素选择器明确关联父控件的checked状态，提升规则优先级：

QPushButton QLabel{color:white; font-weight: bold;}
/* 替换原选中状态规则 */
QPushButton:checked > QLabel {
    color: black;
}

该选择器直接指定QPushButton处于checked状态时，其直接子元素QLabel应用样式，能正确响应父控件的状态变化。

方案2：通过对象名精准匹配样式 #

在QPushButtonRT的__init__方法中给内嵌QLabel设置唯一对象名：

# 在初始化self.__lbl后添加这行代码
self.__lbl.setObjectName("RichTextLabel")

然后在QSS中使用对象名选择器精准匹配：

QPushButton QLabel#RichTextLabel {
    color: white;
    font-weight: bold;
}
QPushButton:checked QLabel#RichTextLabel {
    color: black;
}

这种方式通过对象名避免样式冲突，确保规则仅作用于QPushButtonRT内嵌的QLabel。

内容的提问来源于stack exchange，提问作者Chipmuenk