一、什么是QSS

Qt样式表(QSS) 是一种针对 Qt 库的另外一种语言，它允许用户为 Qt 程序自定义其样式。QSS 是由 CSS 2.1 规范实现的一种层级样式表语言，Qt 类可以通过 QSS 控制其样式，从而定义它们的外观和行为。QSS 继承了 CSS 2.1 规范的所有特性，并增加了一些面向 Qt 类的子集。因此，如果你熟悉 CSS，你就可以很快地学会 QSS。

二、如何使用QSS

QSS 可以用代码、样式表文件或者 qss 文件来设置。代码设置的方式如下：

from PyQt5.QtCore import *
from PyQt5.QtGui import *
from PyQt5.QtWidgets import *
app = QApplication([])
win = QWidget()
style = """
    QWidget{
        background-color: #333;
    }
"""
win.setStyleSheet(style)
win.show()
app.exec_()

其中，setStyleSheet() 函数就是用来设置样式的。将要设置的样式定义在 style 变量中，再调用 setStyleSheet() 函数设置即可。样式表文件的使用方法：

# 样式文件（style.qss）
QWidget{
    background-color: #333;
}
# 主程序
from PyQt5.QtCore import *
from PyQt5.QtGui import *
from PyQt5.QtWidgets import *
app = QApplication([])
win = QWidget()
win.setStyleSheet(open("style.qss","r").read())
win.show()
app.exec_()

注意: 路径可以根据实际情况进行更改。

三、QSS基本功能

1. 控件类型

QSS 可以针对不同的控件类型设置不同样式。其中有一些常用的控件类型:

QWidget
QLabel
QPushButton
QCheckBox
QRadioButton
QGroupBox
QLineEdit
QTextEdit 下面是一个利用 QSS 设置控件的背景颜色的示例：

# 设定类型为 QPushButton 的背景颜色 
QPushButton{
    background-color: #cfcfcf;
}

2. 其它属性

控件类型的属性可以在 QSS 中进行设置，比如 background-color、color、font-size、padding 等等。下面是一个利用 QSS 设置 QPushButton 的边框样式的示例：

# 设置按钮外边框样式 
QPushButton{
    border: 3px solid #222;
    border-radius: 5px;
}

3. 伪状态(Pseudo-States)

在Qt中有三个常用的伪状态：checked、hover、disabled。下面是一个 QCheckBox 的示例：

# 设置QCheckBox处于未勾选时的样式
QCheckBox{
    background-color: #444;
    color: #fff;
}
# 设置QCheckBox处于勾选时的样式 
QCheckBox:checked{
    background-color: #222;
    color: #fff;
}

四、QSS实战用例

1. 制作勾选框样式

QCheckBox{
    margin: 5px;
    padding: 5px;
    border: 1px solid gray;
}
QCheckBox::indicator{
    width: 20px;
    height: 20px;
}
QCheckBox::indicator::unchecked{
    image: url(:/unchecked.png);
}
QCheckBox::indicator::checked{
    image: url(:/checked.png);
}

2. 制作按钮样式

QPushButton{
    background: white;
    border: 3px solid #222;
    color: #222;
    font-size: 20px;
    padding: 5px;
    border-radius: 5px;
    min-width: 100px;
} 
QPushButton:hover{
    background: #222;
    color: #fff;
}

3. 制作滚动条样式

先定义滚动条的样式：

QScrollBar:vertical {
    background:#fff;
    width:16px;
    margin:0px 0px 0px 0px;
    border: 1px solid #ddd;
    padding-left:1px;
}
QScrollBar::handle:vertical {
    background-color: qlineargradient(x1:0, y1:0, x2:1, y2:0, stop:0 #ccc, stop:0.5 #aaa, stop:1 #ccc);
    min-height: 0px;
    border-radius: 8px;
}
QScrollBar::add-line:vertical {
    height: 0px;
    subcontrol-position: bottom;
    subcontrol-origin: margin;
}
QScrollBar::sub-line:vertical {
    height: 0 px;
    subcontrol-position: top;
    subcontrol-origin: margin;
}
QScrollBar::add-page:vertical, QScrollBar::sub-page:vertical {
    background:#f2f2f2;
}

然后使用样式表将其应用于需要使用的控件中：

# 应用样式
QTreeView::verticalScrollBar{
    background-color: #fff;
    width: 16px;
    margin: 0px 0px 0px 0px;
    border: 1px solid #ddd;
}
QTreeView::handle:vertical {
    background-color: qlineargradient(x1:0, y1:0, x2:1, y2:0, stop:0 #ccc, stop:0.5 #aaa, stop:1 #ccc);
    min-height: 0px;
    border-radius: 8px;
}
QTreeView::add-line:vertical {
    height: 0px;
    subcontrol-position: bottom;
    subcontrol-origin: margin;
}
QTreeView::sub-line:vertical {
    height: 0px;
    subcontrol-position: top;
    subcontrol-origin: margin;
}
QTreeView::add-page:vertical,QTreeView::sub-page:vertical {
    background-color: #f2f2f2;
}

五、总结

本文通过不同方面的示例，详细阐述了 PyQt5 QSS 的基本用法，让读者更好的掌握如何使用 QSS 对 PyQt5 应用进行样式定制。希望读者在实践中，可以对 QSS 的使用更加熟练，并且可以根据自己的需求，制作出更加自己喜欢的应用风格。

PyQt5 QSS详解