【轉】QT樣式表 (QStyleSheet)

做者：劉旭暉 Raymond 轉載請註明出處
Email：colorant@163.com
BLOG：http://blog.csdn.net/colorant/

 

除了子類化Style類，使用QT樣式表（QStyleSheet）是另外一種快速改變QT程序UI風格的方法，它很大程度上借鑑和參考了HTML層疊樣式表的語法和思想。其效果疊加在Style的基礎上

 

按官方文檔的說法，QT樣式表目前只能和內置Style配合工做，和子類化的Style的配合正在開發中

StyleSheet的使用

StyleSheet 文件的默認後綴名爲qss，能夠經過命令行參數 -stylesheet filename.qss 來設置樣式表，也能夠經過QApplication::setStyleSheet 或 QWidget::setStyleSheet來設置應用程序或特定控件要使用的樣式表

 

::setStyleSheet 函數的參數是字符串（不是qss文件的名字，而是樣式表的內容），因此直接使用的話，不方便一次設置大量的規則，可是可使用資源文件將qss樣式表嵌入 到程序中，而後經過QApplication::setStyleSheet來使用，例如：

 

 

QFile file(":/qss/mystylesheet.qss");
file.open(QFile::ReadOnly);
app.setStyleSheet(file.readAll());

 

 

樣式表語法

 

這裏不打算詳細解釋，只是舉例說明，具體的語法規則，請參考 http://qt.nokia.com/doc/4.6/stylesheet-syntax.html

一條樣式表的描述規則可能相似這樣：

 

QComboBox#myComboBox::down-arrow:pressed {
    position: relative;
    top: 1px; left: 1px;
}

 

 

一條樣式表規則由選擇器 (Selector)和屬性定義(declaration)組成。

 

 

QComboBox#myComboBox::down-arrow:pressed

 

 

這部分是選擇器，用於指定樣式表規則的應用對象，細分開來：

• QComboBox#myComboBox 這一部分叫類型選擇器(Type Selector)，QComboBox指定了對象類名，#name指定對象的實例名（非必須）其它的選擇器語法請參考官方文檔。
• down-arrow 子控件描述符(subcontrol)，和前面的字段用::隔開，這裏表示組合框的下拉按鍵
• pressed 僞狀態(Pseudo-States)描述符，和前面的字段用:隔開，這裏表示壓下狀態

以上除了第一個字段，都不是必須，而是進一步限制規則適用範圍

 

 

{
    position: relative;
    top: 1px; left: 1px;
}

 

 

這部分是屬性定義，由成對的屬性名:屬性值組成，用;分隔。

 

樣式表規則的範圍和優先級關係

 

由於樣式表規則的層級關係比較複雜，另外設置的方式也有不少，有時候會發生多條規則都和某一個具體控件相關的狀況，這樣具體哪一條樣式表規則最終被應用到控件的UI表現上，就須要有一個規則來定義，大體上牽涉到這個問題的狀況有以下幾種

 

規則衝突

 

多條規則制定了不一樣的內容，可能的狀況有不少，好比

 

QPushButton:hover { color: white }
QPushButton { color: red }

這種狀況，其實能夠不算衝突，更加具體的類型描述符定義的規則擁有更高優先級，因此一個有鼠標懸停的按鈕的文本顏色就是白色的，不然爲紅色

 

QPushButton:hover { color: white }
QPushButton:enabled { color: red }

這裏就可能發生規則衝突，當一個使能的按鈕有鼠標懸停的時候，顏色的定義是什麼呢？ QStyleSheet的判斷原則是，後面規則的優先級高於前面的規則，因此這種狀況顏色爲紅色

 

 

QPushButton { color: red }
QAbstractButton { color: gray }

 

這 個相對難發現，一個基類及其子類都定義了針對文本顏色的規則，那麼子類應用哪一條規則呢？你可能會認爲天然是子類用本身的規則了，很惋惜不是，樣式表不考 慮類的繼承層級優先關係，因此仍是後一條規則優先級高於前一條規則。若是確實要單獨設定子類的規則，須要交換規則的順序。

 

樣式表層疊 Cascading

 

由於樣式表能夠應用在QApplication上，也能夠單獨應用在控件上，因此最終應用到一個具體控件的樣式表，是經過疊加合併全部的父控件乃至應用程序的樣式表設定來獲得的。這種狀況下，也有可能發生規則衝突, 例如：

 

 

qApp->setStyleSheet("QPushButton { color: white }");
myPushButton->setStyleSheet("* { color: blue }");

 

 

這種狀況下，控件自身的樣式表的優先級高於父控件或應用程序的樣式表

 

樣式表繼承 Inheritance

 

在標準的CSS樣式表中，一個控件的字體和顏色屬性若是沒有明確設定，那麼將自動繼承自父控件，而在QT的樣式表中，不會自動繼承，例如：

 

qApp->setStyleSheet("QGroupBox { color: red; } ");

這種狀況下，對於GroupBox中的添加的子控件，不會自動設置其顏色屬性，若是要設置子控件的屬性，須要明確設定：

qApp->setStyleSheet("QGroupBox, QGroupBox * { color: red; }");

注意，這裏的繼承和上面的層疊不同，層疊指不一樣樣式表設置同一個對象，繼承指的則是樣式表規則中選擇器對控件層級關係的影響

 

Stylesheet是如何附加在Style上的

當 設置StyleSheet的時候，一個QStyleSheetStyle會被生成並被設爲應用程序實際的Style，而當前的Style則被 reparent成QStyleSheetStyle的子對象，當應用程序或控件調用Style繪圖的時候，實際調用的是 QStyleSheetStyle對象，在QStyleSheetStyle類內部，會先調用函數按照StyleSheet定義的規則繪製UI，若是沒有 相關規則，再調用當前的Style對象的繪圖函數繪製UI，因此QStyleSheet做爲一個代理Style先對UI進行處理。

 

Trackback：http://qimo601.iteye.com/blog/1634788