天天看點

qt qss樣式模闆_實戰PyQt5:112-開源QSS樣式表qdartstyleQDarkStyleSheet簡介安裝QDarkStyleSheet運作QDarkStyleSheet樣例測試樣例本文知識點

使用Python開發應用一個重要的優點是有豐富的第三方庫,在開發過程中我們就不需要重複造輪子,而是應用好這些輪子,就可以事半功倍。下面介紹一個深色配置QSS庫QDarkStyleSheet,使用它,在PyQt中,隻需要簡單的一個語句,就可以給用用實作炫酷的深色風格。

qt qss樣式模闆_實戰PyQt5:112-開源QSS樣式表qdartstyleQDarkStyleSheet簡介安裝QDarkStyleSheet運作QDarkStyleSheet樣例測試樣例本文知識點

QDarkStyleSheet簡介

QDarkStyleSheet是一個适用于Qt應用程式的最完整的深色樣式表(Qt4,Qt5,PySide,PySide2,PyQt4,PyQt5,QtPy,PyQtGraph,Qt.Py)。使用下面的指令就可以安裝最新的穩定版本:

pip install qdarkstyle
           

在PyQt5中,下面的代碼示範了如何使用QDarkStyleSheet

import sysimport qdarkstylefrom PyQt5.QtWidgets import QApplication, QMainWindow if __name__ == '__main__':    app = QApplication(sys.argv)    window = QMainWindow()        #設定樣式表    app.setStyleSheet(qdarkstyle.load_stylesheet())        window.show()    sys.exit(app.exec())
           

安裝QDarkStyleSheet

在終端視窗下輸入指令 pip install qdarkstyle 即可以安裝QDarkStyleSheet, 安裝完成後,顯示的資訊如下圖(不同的版本,顯示資訊可能有差别)

qt qss樣式模闆_實戰PyQt5:112-開源QSS樣式表qdartstyleQDarkStyleSheet簡介安裝QDarkStyleSheet運作QDarkStyleSheet樣例測試樣例本文知識點

安裝qdarkstyle

運作QDarkStyleSheet樣例

QDarkStyleSheet是一個開源包,其源代碼位址是:

https://github.com/ColinDuquesnoy/QDarkStyleSheet
           

下載下傳其最新釋出版本(寫這篇文章時,最新版本為2.8.1),解壓後,其中的example目錄中有一個樣式的示範工程,運作其檔案example.py,效果如下圖:

qt qss樣式模闆_實戰PyQt5:112-開源QSS樣式表qdartstyleQDarkStyleSheet簡介安裝QDarkStyleSheet運作QDarkStyleSheet樣例測試樣例本文知識點

QDarkStyleSheet開發包自帶例子運作效果

測試樣例

在前文的樣例代碼中,使用QDarkStyleSheet開發包來設定應用的樣式表,其完整代碼如下:

import sysimport qdarkstylefrom 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) #标記控制視窗class DarkStyleSheetDemo(QMainWindow):    def __init__(self):        super(DarkStyleSheetDemo, self).__init__()                # 設定視窗标題        self.setWindowTitle('實戰PyQt5: QDarkStyleSheet 示範')                #應用的初始調色闆        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)               #菜單欄設定    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)    if __name__ == '__main__':    app = QApplication(sys.argv)    window = DarkStyleSheetDemo()        #設定樣式表    app.setStyleSheet(qdarkstyle.load_stylesheet())        window.show()    sys.exit(app.exec())   
           

運作效果如下圖:

qt qss樣式模闆_實戰PyQt5:112-開源QSS樣式表qdartstyleQDarkStyleSheet簡介安裝QDarkStyleSheet運作QDarkStyleSheet樣例測試樣例本文知識點

測試QDarkStyleSheet

本文知識點

  • 安裝QDarkStyleSheet開發包
  • 下載下傳QDarkStyleSheet最新版本的源代碼
  • 使用QDarkStyleSheet更改程式外觀

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