QSS子控件实际上也是一种选择器,其应用在一些复合控件上,典型的如QComboBox,该控件的外观是,有一个矩形的外边框,右边有一个下拉箭头,点击之后会弹出下拉列表,例如:
QComboBox:drop-down {image:url(dropdown.png)}
上面的样式指定所有的QComboBox下拉箭头的图片是自定义的,图片文件为dropdown.png
::drop-down子控件选择器可以与上面提到到的选择器一起联合使用,例如
QComboBox#myQComboBox::drop-down {image:url(dropdown.png)}
表示为指定的id为myQComboBox的QComboBox控件的下拉箭头自定义图片,需要注意的是,子控件选择器实际上是选择复合控件的一部分,也就是对复合控件的一部分应用样式,例如为QComboBox下拉箭头指定图片,而不是QComboBox本身指定图片
QSS伪状态选择器是以冒号开头的一个选择表达式,例如hover,表示当鼠标指针经过时的状态,伪状态选择器限制了当控件处于某种状态才可以使用的QSS规则,伪状态只能描述一个控件或者一个复合控件的自控件的状态,所以它只能放在选择器的最后面,例如
QComboBox:hover{background-color:red;}
表示到鼠标经过QComboBox时.其背景色指定为红色
该伪状态:hover描述的是QComboBox的状态,除可以描述所选择的控件外,伪状态还可以描述子控件选择器所选择的复合控件的子控件的状态
QComboBox::drop-down:hover{background-color:red}
表示当鼠标指针经过QComboBox的下拉箭头时,该下拉箭头的背景色变成红色
此外,伪状态还可以用一个感叹号来表示状态,例如,:hove表示鼠标指针经过的状态,:!hover表示鼠标没有经过的状态,多种伪状态可以同时使用,例如
QCheckBox:hover:checked{color:white}
表示当鼠标指针经过一个选中的QCheckBox时,设置其文字的前景色为白色
QSS提供了很多的伪状态,一些伪状态只能用在特定的控件上,具体有哪些伪状态,在pyqt帮助文档中有详细的列表
实例:QComboBox的样式
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 | import sys from PyQt5.QtWidgets import * class WindowDemo(QWidget): def __init__( self ): super (WindowDemo, self ).__init__() self .initUI() def initUI( self ): #实例化列表控件 combo = QComboBox( self ) #设置列表控件的名称 combo.setObjectName( 'myQComboBox' ) #添加条目到列表控件 combo.addItem( 'Window' ) combo.addItem( 'Ubuntu' ) combo.addItem( 'Red Hat' ) #控件移动到指定位置 combo.move( 50 , 50 ) #设置窗口的标题与初始窗口的属性 self .setGeometry( 250 , 200 , 320 , 150 ) self .setWindowTitle( 'QComboBox样式' ) #设置样式 qssStyle = ''' QComboBox#myQComboBox::drop-down{ image:url(./images/dropdown.png) } QComboBox#myQComboBox::drop-down:hover{ background-color:red } ''' self .setStyleSheet(qssStyle) if __name__ = = '__main__' : app = QApplication(sys.argv) win = WindowDemo() win.show() sys.exit(app.exec_()) |
运行程序,运行效果如下
除自己编写的QSS样式表,网上还有很多质量很高的QSS样式表。比如QDarkStyleSheet,它是一个用于PyQt应用程序的深黑色样式表
安装
pip install qdarkstyle
实例:QDarKStyleSheet的显示界面
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 | import logging import sys from PyQt5 import QtWidgets, QtCore # make the example runnable without the need to install from os.path import abspath, dirname sys.path.insert( 0 , abspath(dirname(abspath(__file__)) + '/..' )) import qdarkstyle import ui.example_pyqt5_ui as example_ui def main(): """ Application entry point """ logging.basicConfig(level = logging.DEBUG) # create the application and the main window app = QtWidgets.QApplication(sys.argv) window = QtWidgets.QMainWindow() # setup ui ui = example_ui.Ui_MainWindow() ui.setupUi(window) ui.bt_delay_popup.addActions([ ui.actionAction, ui.actionAction_C ]) ui.bt_instant_popup.addActions([ ui.actionAction, ui.actionAction_C ]) ui.bt_menu_button_popup.addActions([ ui.actionAction, ui.actionAction_C ]) item = QtWidgets.QTableWidgetItem( "Test" ) item.setCheckState(QtCore.Qt.Checked) ui.tableWidget.setItem( 0 , 0 , item) window.setWindowTitle( "QDarkStyle example" ) # tabify dock widgets to show bug #6 window.tabifyDockWidget(ui.dockWidget1, ui.dockWidget2) # setup stylesheet app.setStyleSheet(qdarkstyle.load_stylesheet_pyqt5()) # auto quit after 2s when testing on travis-ci if "--travis" in sys.argv: QtCore.QTimer.singleShot( 2000 , app.exit) # run window.show() app.exec_() if __name__ = = "__main__" : main() |
运行效果图
联系客服