如何设置 QCheckBox 选中区域样式表？答案

【问题标题】：How to set QCheckBox checked area stylesheet?如何设置 QCheckBox 选中区域样式表？
【发布时间】：2021-11-22 22:00:44
【问题描述】：

我想在黑色背景上显示QCheckBox。我不想将图像添加到.qrc 来配置我自己的风格。我只想用.qss 配置样式。当我尝试更改背景时，所有（检查矩形的预期区域）都显示正常所以，用我的style.qss 内容：

QWidget {
    background: #080808;
}

QCheckBox {
    color: white;
}

结果是：

如您所见，v 复选标记周围没有矩形框。所以，我尝试添加到我的.qss：

QCheckBox::indicator:checked {
    background: transparent;
    background-color: transparent;
    color: white;
    border: 1px solid #5A5A5A;
}

但这会删除v，所以选中状态显示有框区域，但没有v-标记，就好像状态未选中：

我的印象是该框的填充覆盖了v 复选标记。如何在v勾选标记周围画框？

更新。我通过修改我的 QCheckBox 的调色板来解决这个问题：

void MyWidget::fixPalette(){
    QPalette p = ui->autoScrollCheckBox->palette();
    p.setColor(QPalette::Window, Qt::gray);
    ui->autoScrollCheckBox->setPalette(p);
}

检查状态结果：

但是如何仅使用样式表来做到这一点？

【问题讨论】：

标签： qt qtstylesheets qcheckbox qt5.13

【解决方案1】：

我在 QWidget 上使用了样式表，以在使用触摸屏的控制 GUI 上全局应用大得可笑的“金属”外观。之后必须做很多工作才能使组合框和滚动框看起来合理...... QRadioButton 和 QCheckBox 也被淘汰了。

对我来说，我必须为以下内容设置新值（X 是 QRadioButton 或 QCheckBox，并且 :'s 的数量很重要，尽管它在我看来大多是拼写错误。样式表不是我最喜欢的语言)

X::indicator（宽度、高度、背景颜色、边框半径、边框样式、边框宽度和边框颜色，用于固定常规单选框/复选框区域）
X::indicator:checked（我必须为我的方案设置带有 qradialgradient 的背景色，但通常纯色应该可以）
X:checked, X::indicator:checked （对我来说，我改变了边框颜色，因为我正在模拟一个 LED ......这是专门针对 X:checked 的 X::indicator:checked小部件）
X：已选中（我将 LED 的背景颜色更改为亮绿色的 qradialgradient）

为了它的价值，我把我的实际收音机/复选框设置放在这篇文章的底部。

我采用 LED 方法的部分原因是它符合我的整体主题，部分原因是我认为我从未弄清楚如何修复实际的收音机/检查图像。我知道在 QComboBox 中，一旦我对主控件的样式进行了任何操作，我就必须为子控件提供自己的 PNG。不知道为什么。我还记得很难找到子控件的正确名称。但是如果你能找到它们，那么类似下面的内容可能会有所帮助（“plus30x30.png”只是我项目中的一个文件......我正在从 Python 加载的 .ui 文件中执行此操作，所以可能有其他语言绑定中的不同路径要求）。

QComboBox::down-arrow {
    image-position: center center;
    image: url(plus30x30.png)
}

我希望里面的东西至少能帮上一点忙。

-----承诺的荒谬风格设置-----

QCheckBox::indicator {
    width: 30px;
    height: 30px;
    background-color: gray;
    border-radius: 15px;
    border-style: solid;
    border-width: 1px;
    border-color: white white black black;
}
QCheckBox::indicator:checked {
    background-color: qradialgradient(spread:pad, 
                            cx:0.5,
                            cy:0.5,
                            radius:0.9,
                            fx:0.5,
                            fy:0.5,
                            stop:0 rgba(0, 255, 0, 255), 
                            stop:1 rgba(0, 64, 0, 255));
}
QCheckBox:checked, QCheckBox::indicator:checked {
    border-color: black black white white;
}
QCheckBox:checked {
    background-color: qradialgradient(spread:pad, 
                            cx:0.739, 
                            cy:0.278364, 
                            radius:0.378, 
                            fx:0.997289, 
                            fy:0.00289117, 
                            stop:0 rgba(255, 255, 255, 255), 
                            stop:1 rgba(160, 160, 160, 255));
}

【讨论】：