可以使用QSS樣式表的部件

QSS樣式表支持各種部件，屬性，偽狀態和子控件，從而可以實現定制部件的外觀，下面我們將詳細列出可以使用QSS樣式表的部件：

• QAbstractScrollArea：所有派生自QAbstractScrollArea類的子類，包括QTextEdit, QAbstractItemView(所有項目視圖類)，都可以通過設置background-attachment屬性來實現可滾動背景。通過給background-attachment設置fixed和scroll，背景會固定不動或者跟隨滾動。
• QChecBox： QCheckBox的勾選符號可以使用::indicator子控件來定制。默認情況下，勾選標記位于部件矩形的左上角。QCheckBox的spacing屬性可以用于指定勾選標記和文本內容之間的間距。
• QColumnView：可以使用image屬性來設置握柄(grip)的樣式，可以使用::left-arrow子控件和::right-arrow子控件來設置箭頭的樣式
• QComboBox：組合下拉框的框架可以使用盒模型(Box Model)設置樣式。可以使用:: drop-down子控件設置下拉按鈕的樣式。默認情況下，下拉按鈕位于部件的填充矩形的右上角。可以使用:: down-arrow子控件設置下拉按鈕內的箭頭標記的樣式。默認情況下，箭頭位于下拉子控件的內容矩形的中心。
• QSpinBox(QDoubleSpinBox, QDateEdit,QTimeEdit,QDateTimeEdit)：旋轉框的框架可以使用盒模型(Box Model)設置樣式。

可以使用:: up-button和:: up-arrow子控件設置向上按鈕和箭頭的樣式。默認情況下，向上按鈕位于小部件的“填充”矩形的右上角。如果沒有明確的尺寸，則它占據其參考矩形高度的一半。向上箭頭放置在向上按鈕的“內容”矩形的中心。

可以使用::down-button和::down-arrow子控件設置向下按鈕和箭頭的樣式。默認情況下，向下按鈕位于小部件的“填充”矩形的右下角。如果沒有明確的尺寸，則它占據其參考矩形高度的一半。底部箭頭位于底部按鈕的“內容”矩形的中心。

• QDialog：僅支持background，background-clip和background-origin屬性。
• QDialogButton: 可以使用button-layout屬性更改按鈕的布局。
• QDockWidget：支持停靠時標題欄和標題欄按鈕的樣式。

可以使用border屬性設置停靠窗口小部件邊框的樣式。::title子控件可以用于自定義標題欄。

關閉按鈕和浮動按鈕分別使用相對于::title子控件的::close-button和::float-button來進行定位。標題欄為垂直時，

當標題欄垂直時，需要設置:vertical偽狀態。另外，根據QDockWidget.DockWidgetFeature設置:closable，:floatable和:movable pseudo狀態。

注意：使用QMainWindow :: separator設置調整大小句柄(handle)的樣式。

警告：取消QDockWidget時，樣式表無效，因為Qt退出時，Qt使用本機頂級窗口。

• QFrame：自Qt4.3開始，在QLabel上設置樣式表會自動將QFrame的 ::frameStyle屬性設置為QFrame :: StyledPanel。
• QGroupBox：QGroupBox的標題用::title子控件進行定制，標題的位置依QGroupBox::textAlignment的具體值而言。對于可選的QGroupBox而言，標題中還會包含一個勾選標記，勾選標記用::indicator來定制，spacing仍然用于設置勾選標記與文本的間距。
• QHeaderView：QHeaderView是Model/View框架中的一部分。標題視圖的各小節(section)使用:: section子控件設置樣式。::section支持 :middle, :first, :last, :only-one, :previous-selected, :selected, :checked等偽狀態。::up-arrow和::down-arrow用于定制表頭的排序標記。
• QLabel：QLabel不支持:hover偽狀態，自Qt4.3開始，給QLabel設置樣式表也就隱式指定了QFrame::frameStyle屬性。
• QLineEdit：selection-color, selection-background-color屬性分別指定了選中文本的文本顏色和背景色，使用lineedit-password-character屬性設置密碼字符的樣式。使用lineedit-password-mask-delay更改密碼掩碼延遲時間。
• QListView(QListWidget)：當view支持斑馬色條時，alternate-background-color屬性指定備選色實現斑馬色帶。

當前所選條目的的顏色和背景，可以使用selection-color和selection-background-color屬性來設置。

選擇行為由show-decoration-selected屬性控制。

使用::item子控件可以更精細地控制QListView中的條目。

• QMainWindow：支持分隔符的樣式。使用QDockWidget時，QMainWindow中的分隔符使用:: separator子控件設置樣式。
• QMenu：菜單中的獨立項使用::item子控件定制，除了常見的偽狀態，::item還支持:selected, :default, :exclusive以及:non-exclusive等偽狀態。利用這些偽狀態，可以為不同狀態的菜單項定制出不同的外觀。對于可勾選的菜單項，使用::indicator對勾選標記進行定制，::separator則定制菜單項之間的分隔符；對于有子菜單的菜單項，其箭頭號可以用::right-arrow, ::left-arrow進行定制，還有::scroller及::tearoff兩個子組件。
• QMenuBar：菜單欄組件的spacing屬性可指定菜單項之間的間距，單個菜單項還可以通過::item子組件定制風格。但是值得注意的是，由于MAC下菜單欄集成到了系統菜單欄，此時樣式表會失去作用。
• QMessageBox：messagebox-text-interaction-flags屬性可用于更改與消息框中的文本的交互方式。
• QProgressBar：進度條組件使用::chunks子組件來定制進度條樣式，text-align屬性用于設定進度條中文本的對齊方向：left, center, right。對于不確定狀態的進度條，將使用:indeterminate偽狀態集。
• QPushButton：支持:default, :flat, :checked偽狀態，對于具備關聯菜單的按鈕，可以用::menu-indicator來定制下拉菜單標記。而:open和:closed偽狀態則分別用于定制菜單打開和關閉時按鈕的外觀。從Qt5.15開始，可以將icon屬性設置為覆蓋按鈕圖標。
• QRadioButton：::indicator用于定制文本前面的選項框，默認情況下，選項框放置在窗口部件是“內容”矩陣的左上角。spacing指定文本與選項框之間的間距。
• QScrollBar：滾動條的組成其實非常復雜，依據垂直和水平方向的不同，由::handle, ::add-line, ::sub-line, ::add-page, ::sub-page, ::right-arrow, ::left-arrow, ::down-arrow, ::up-arrow等子組件組成。偽狀態:horizontal, :vertical用于確定滾動條的方向，width(min-width), height(min-height)則可確定滾動條的不同長和寬。
• QSizeGrip：支持width，height和image屬性。
• QSlider：對于水平的QSlider，min-width和height屬性必須同時提供；對于垂直的QSlider, 必須同時提供min-height和width屬性。QSlider由::groove和::handle兩部分組成。::groove子組件是一條槽，供::handle在上面滑動。
• QSplitter：窗體分割器，主要的部件是::handle。通過::handle可以動態改變分割器中的不同子窗口大小。
• QStatusBar：僅支持background屬性，單個條目的框架可以使用:: item子控件設置樣式。
• QTabBar：單獨的選項卡使用子控件::tab來定制樣式，使用::close-button屬性來定制關閉按鈕的樣式，選項卡支持 :only-one, :first, :last, :middle, :previous--selected, :next-selected, :selected 偽狀態。其中:top, :left, :right, :bottom偽狀態根據選項卡的方向來設置。
• QTableView(QTableWidget)：當view支持斑馬色條時，alternate-background-color屬性指定備選色實現斑馬色帶，selection-color和selection-background-color屬性指定選定項的文本色和背景色。注意：保證同時設置了背景色和邊框寬度值。
• QTextEdit：使用selection-color, selection-background-color屬性定制，其他的定制方式見QAbstractScrollArea。
• QToolBar：偽狀態:top, :left, :right, :bottom的使用依賴于工具欄的具體位置；:first, :last, :middle, :only-one則用于設置在工具欄中的具體位置。工具欄的分隔線用::separator子組件來設置，子組件::handle則用于設置移動工具欄的handle。
• QToolButton：如果QToolButton關聯了一個菜單，則 ::menu-indicator子控件可用于設置指示器樣式。默認情況下，菜單指示器位于窗口小部件的填充矩形的右下角。 如果被設置成了QToolButton::MenuButtonPopup模式，那么::menu-button子控件用于繪制菜單按鈕。::menu-arrow子控件用于在菜單按鈕內部繪制菜單箭頭。當QToolButton顯示箭頭時，將使用::up-arrow，::down-arrow，::left-arrow和::right-arrow子控件。注意：如果設置了QToolButton的背景色，那么必須還要設置邊框border的寬度才會起作用。這是因為QToolButton默認繪制的邊框會完全遮擋住用戶設置的背景色。
• QToolBox:可以使用::tab子控件設置各個選項卡的樣式。選項卡支持:only-one，:first，:last，:middle，:previous-selected，:next-selected，:selected偽狀態。
• QToolTip：opacity屬性控制QToolTip的不透明度。
• QTreeView(QTreeWidget)：當View支持斑馬色條時，alternate-background-color屬性指定備選色實現斑馬色帶，selection-color和selection-background-color屬性指定選定項的文本色和背景色。show-decoration-selected屬性控制選中時是選中整項還是僅僅只是項的文本。::branch子控件設置樹形視圖的分支的樣式,::branch子控件支持:open，:closed，:has-sibling和:has-children偽狀態。使用::item子控件可以更精細地控制View中的項目。
• QWidget：僅支持background，background-clip和background-origin屬性。

代碼演示

演示加載qss文件的方法。這里僅列出py文件代碼，完整資源可從網絡上下載。完整代碼如下：

import?sysfrom?PyQt5.QtCore?import?Qt,?QTimer,?QDateTime,?QDate,?QFilefrom?PyQt5.QtGui?import?QPalette,?QColorfrom?PyQt5.QtWidgets?import?(QApplication,?QWidget,?QMainWindow,?QPushButton,?QTextEdit,??????????????????????????????QGroupBox,?QCheckBox,?QRadioButton,?QComboBox,?QLabel,?????????????????????????????QVBoxLayout,?QHBoxLayout,?QGridLayout,?QStyleFactory,?????????????????????????????QTabWidget,?QSizePolicy,?QProgressBar,?QTableWidget,?????????????????????????????QLineEdit,?QSpinBox,?QDateTimeEdit,?QSlider,?????????????????????????????QScrollBar,?QMenu,?QMenuBar,?QAction,?QCalendarWidget,?QDial)?import?resource_rc?#標記控制窗口class?LoadQssDemo(QMainWindow):????def?__init__(self):????????super(LoadQssDemo,?self).__init__()????????????????#?設置窗口標題????????self.setWindowTitle('實戰PyQt5:?加載QSS樣式表文件')????????????????#應用的初始調色板????????self.origPalette?=?QApplication.palette()????????????????self.initUi()????????????def?initUi(self):????????self.initMenuBar()???????????????????????#生成要顯示的部件????????self.createTopLeftGroupBox()????????self.createTopRightGroupBox()????????self.createBottomLeftTabWidget()????????self.createBottomRightGroupBox()????????self.createProgressBar()????????????????mainLayout?=?QGridLayout()????????mainLayout.addWidget(self.topLeftGroupBox,?1,?0)?#1行0列????????mainLayout.addWidget(self.topRightGroupBox,?1,?1)?#1行1列????????mainLayout.addWidget(self.bottomLeftTabWidget,?2,?0)?#2行0列????????mainLayout.addWidget(self.bottomRightGroupBox,?2,?1)?#2行1列????????mainLayout.addWidget(self.progressBar,?3,?0,?1,?2)?##?3行0列，占1行2列????????mainLayout.setRowStretch(1,?1)????????mainLayout.setRowStretch(2,?1)????????mainLayout.setColumnStretch(0,?1)????????mainLayout.setColumnStretch(1,?1)????????????????mainWidget?=?QWidget()????????mainWidget.setLayout(mainLayout)????????????????self.setCentralWidget(mainWidget)????????????????#這里加載一個QSS文件????????self.loadStyleSheet()????????#菜單欄設置????def?initMenuBar(self):????????mBar?=?self.menuBar()????????????????menuFile?=?mBar.addMenu('文件(&F)')??????????????????aExit?=?QAction('退出(&X)',?self)????????aExit.triggered.connect(self.close)????????menuFile.addAction(aExit)?????????#創建左上角成組部件????def?createTopLeftGroupBox(self):????????self.topLeftGroupBox?=?QGroupBox('組?1')????????????????rad1?=?QRadioButton('單選按鈕1')????????rad2?=?QRadioButton('單選按鈕2')????????rad3?=?QRadioButton('單選按鈕3')????????rad1.setChecked(True)????????????????chk?=?QCheckBox('三態復選按鈕')????????chk.setTristate(True)????????chk.setCheckState(Qt.PartiallyChecked)????????????????layout?=?QVBoxLayout()????????layout.addWidget(rad1)????????layout.addWidget(rad2)????????layout.addWidget(rad3)????????layout.addWidget(chk)????????layout.addStretch(1)????????????????self.topLeftGroupBox.setLayout(layout)????????????#創建右上角成組部件????def?createTopRightGroupBox(self):????????self.topRightGroupBox?=?QGroupBox('組?2')????????????????btnDefault?=?QPushButton('Push?Button：缺省模式')????????btnDefault.setDefault(True)????????????????btnToggle?=?QPushButton('Push?Button:?切換模式')????????btnToggle.setCheckable(True)????????btnToggle.setChecked(True)????????????????btnFlat?=?QPushButton('Push?Button:?扁平外觀')????????btnFlat.setFlat(True)????????????????layout?=?QVBoxLayout()????????layout.addWidget(btnDefault)????????layout.addWidget(btnToggle)????????layout.addWidget(btnFlat)????????layout.addStretch(1)????????????????self.topRightGroupBox.setLayout(layout)????????????????????#創建左下角Tab控件????def?createBottomLeftTabWidget(self):????????self.bottomLeftTabWidget?=?QTabWidget()????????self.bottomLeftTabWidget.setSizePolicy(QSizePolicy.Preferred,?QSizePolicy.Ignored)????????????????tab1?=?QWidget()????????tableWidget?=?QTableWidget(10,?10)??#10行10列????????????????tab1Layout?=?QHBoxLayout()????????tab1Layout.setContentsMargins(5,5,5,5)????????tab1Layout.addWidget(tableWidget)????????tab1.setLayout(tab1Layout)????????????????tab2?=?QWidget()????????textEdit?=?QTextEdit()????????textEdit.setPlainText("一閃一閃小星星,"??????????????????????????????"我想知道你是什么."???????????????????????????????"在整個世界之上,?如此的高,"??????????????????????????????"像在天空中的鉆石."??????????????????????????????"一閃一閃小星星,"???????????????????????????????"我多想知道你是什么!")????????????????tab2Layout?=?QHBoxLayout()????????tab2Layout.setContentsMargins(5,?5,?5,?5)????????tab2Layout.addWidget(textEdit)????????tab2.setLayout(tab2Layout)????????????????tab3?=?QWidget()????????calendar?=?QCalendarWidget()????????#設置最小日期????????calendar.setMinimumDate(QDate(1900,1,1))????????#設置最大日期????????calendar.setMaximumDate(QDate(4046,1,1))????????#設置網格可見????????calendar.setGridVisible(True)????????tab3Layout?=?QHBoxLayout()????????tab3Layout.setContentsMargins(5,?5,?5,?5)????????tab3Layout.addWidget(calendar)????????tab3.setLayout(tab3Layout)????????????????self.bottomLeftTabWidget.addTab(tab1,?'表格(&T)')????????self.bottomLeftTabWidget.addTab(tab2,?'文本編輯(&E)')????????self.bottomLeftTabWidget.addTab(tab3,?'日歷(&C)')????????????????#self.bottomLeftTabWidget.addTab(tab1,?'表格(&T)')????????#self.bottomLeftTabWidget.addTab(tab2,?'文本編輯(&E)')????????????????????#創建右下角成組部件????def?createBottomRightGroupBox(self):????????self.bottomRightGroupBox?=?QGroupBox('組?3')????????self.bottomRightGroupBox.setCheckable(True)????????self.bottomRightGroupBox.setChecked(True)????????????????lineEdit?=?QLineEdit('s3cRe7')????????lineEdit.setEchoMode(QLineEdit.Password)????????????????spinBox?=?QSpinBox(self.bottomRightGroupBox)????????spinBox.setValue(50)????????????????dateTimeEdit?=?QDateTimeEdit(self.bottomRightGroupBox)????????dateTimeEdit.setDateTime(QDateTime.currentDateTime())????????????????slider?=?QSlider(Qt.Horizontal,?self.bottomRightGroupBox)????????slider.setValue(40)????????????????scrollBar?=?QScrollBar(Qt.Horizontal,?self.bottomRightGroupBox)????????scrollBar.setValue(60)????????????????dial?=?QDial(self.bottomRightGroupBox)????????dial.setValue(30)????????dial.setNotchesVisible(True)????????????????layout?=?QGridLayout()????????layout.addWidget(lineEdit,?0,?0,?1,?2)??#0行0列，占1行2列????????layout.addWidget(spinBox,?1,?0,?1,?2)???#1行0列，占1行2列????????layout.addWidget(dateTimeEdit,?2,?0,?1,?2)?#2行0列，占1行2列????????layout.addWidget(slider,?3,?0)??#3行0列，占1行1列????????layout.addWidget(scrollBar,?4,?0)?#4行0列，占1行1列????????layout.addWidget(dial,?3,?1,?2,?1)??#3行1列，占2行1列????????layout.setRowStretch(5,?1)????????????????self.bottomRightGroupBox.setLayout(layout)??????????????#禁止窗口上的組件????def?setWidgetsDisbaled(self,?disable):????????self.topLeftGroupBox.setDisabled(disable)????????self.topRightGroupBox.setDisabled(disable)????????self.bottomLeftTabWidget.setDisabled(disable)????????self.bottomRightGroupBox.setDisabled(disable)????????????#創建進度條????def?createProgressBar(self):????????self.progressBar?=?QProgressBar()????????self.progressBar.setRange(0,?10000)????????self.progressBar.setValue(0)????????????????#?定時器，定時更新進度條的值????????timer?=?QTimer(self)????????timer.timeout.connect(self.advanceProgressBar)????????timer.start(100)????????????#設置進度條的值????????????def?advanceProgressBar(self):????????curVal?=?self.progressBar.value()????????maxVal?=?self.progressBar.maximum()????????self.progressBar.setValue(curVal?+?(maxVal?-?curVal)//100)??????????#關鍵代碼!!!!!!??????def?loadStyleSheet(self):????????file?=?QFile(':/qdarkstyle/qdarkstyle.qss')????????file.open(QFile.ReadOnly)?????????styleSheet?=?file.readAll()????????styleSheet?=?str(styleSheet,?encoding='utf8')????????????????file.close()?????????QApplication.instance().setStyleSheet(styleSheet)????if?__name__?==?'__main__':????app?=?QApplication(sys.argv)????window?=?LoadQssDemo()????window.show()????sys.exit(app.exec())?????

運行結果如下圖：

加載QSS文件

本文知識點

• 可以使用QSS樣式表的部件；
• 在應用中加載一個QSS文件。

---

喜歡的人，請多多關注，評論，收藏，點贊，和轉發。

與50位技術專家面對面20年技術見證，附贈技術全景圖

總結

以上是生活随笔為你收集整理的button 样式_实战PyQt5: 111-可以使用QSS样式表的部件的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。