Qt樣式表使用說明

1、嗯 Qt樣式使用說明一、聲明：1文檔說明：學(xué)習(xí)Qt樣式表前提： 如果你了解CSS，那么我相信這對你來說會很容易理解并應(yīng)用于實(shí)際界面美化，它與CSS有些相似之處，當(dāng)然如果同時也了解Qt，那么你會很快學(xué)會如何運(yùn)用Qt樣式為程序設(shè)計(jì)出漂亮的界面。閱讀本說明文檔： 首先一、閱讀聲明，二、名詞解釋，三、語法簡介，六、附屬例題解釋，每次實(shí)驗(yàn)并對照著五、樣式表參照表，體會并學(xué)習(xí)如何運(yùn)用樣式表里關(guān)鍵詞。樣式表參照表之間的關(guān)系很復(fù)雜： 很多需要重復(fù)描述的選擇器、屬性、值，但由于本文檔不能跳轉(zhuǎn)，所以要自己去查找，按照它語法關(guān)系層層迭代定位表格，并按照字母表順序定位要查找內(nèi)容的大概范圍。這里的表格以Qt help文

2、檔為準(zhǔn)。暫不介紹： 為了盡快完成本文檔的初步可使用的目的，很多在本程序中暫時用不到的窗口部件暫未解釋介紹，窗口部件介紹表格中會提到“暫不介紹”，但是輔助控制器，屬性，值都是完全展示在表格中。附加的例題格式說明：例子是經(jīng)過實(shí)驗(yàn)得出的結(jié)論，用C語言的注釋方式添加到相應(yīng)的樣式代碼后面，當(dāng)然你的文件( .CSS) 同樣滿足這個注釋方式。 /* 注釋內(nèi)容 */ /*imagesForExample: example_for_XXX000.png */實(shí)例圖片如何做實(shí)驗(yàn)： Qt源碼bin目錄下的designer.exe,運(yùn)行/拖入控件/右鍵/改變樣式表/應(yīng)用； Qt Creator也可以。遇到問題請盡快聯(lián)

3、系作者2背景介紹： Qt為圖形界面應(yīng)用程序提供一個完整的C+應(yīng)用程序開發(fā)框架。 Qt的樣式表主要是受到CSS的啟發(fā)，通過調(diào)用QWidget:setStyleSheet()或 QApplication:setStyleSheet()，你可以為一個獨(dú)立的子部件、整個窗口，甚至是整個應(yīng)用程序指定一個樣式表。樣式表由影響窗口部件繪制的樣式規(guī)則組成。這些規(guī)則都是普通文本。由于在運(yùn)行時會解析樣式表，所以可以通過定制樣式表的方式來嘗試設(shè)計(jì)不同的Qt應(yīng)用程序。 二、名詞解釋：1. 選擇器（selector） 意思是：選擇特定的類，一般為一個可以定制樣式表的Qt類，所有可以作為選擇器的Qt類都在五、樣式參照表：

4、2. 可以應(yīng)用樣式表的窗口部件表=選擇器中列出，選擇器的格式參照五、樣式參照表： 1樣式選擇器類型表。 所謂的選擇器可以理解為CSS中的選擇器，他指定了一類部件進(jìn)行設(shè)計(jì)。輔助控制器（sub-control） 輔助控制器 一詞是相對于選擇器存在的，可以理解為我們選擇了一個部件，例如一個QCheckBox，這個部件它分為兩個部分，文本部分和可以點(diǎn)擊的小窗口的部分。而這個可點(diǎn)擊的小窗口部分我們要單獨(dú)的設(shè)置，就要再次分離出來，就需要:indicator(QCheckBox有這個輔助控制器)來設(shè)置，如下例題：QCheckBox:indicatorwidth:20px;height:20px;/*說明是在

5、QCheckBox中的指示符（indicator）寬為20px，height為20px。*/輔助控制器是用 : 雙冒號進(jìn)行指定。如果沒有:indicator那么我們這個小例子將是對整個QCheckBox設(shè)置的，使用了輔助控制器的時候就自動分離出這個小窗口，對小窗口進(jìn)行設(shè)置。不同的選擇器有不同的輔助控制器，具體可查看五、樣式表參照表：3. 輔助控制器列表 中詳細(xì)介紹相應(yīng)的輔助控制器在不同的類中應(yīng)用，詳細(xì)說明在類中的什么位置。狀態(tài)（pseudo-states） 除了輔助控制器對一個部件的分離，樣式表還可以根據(jù)窗口部件的各個狀態(tài)來設(shè)置窗口。例如hover表示鼠標(biāo)劃過時的狀態(tài)，例子如下：QCheckB

6、ox:hovercolor: red;/*例子說明只有當(dāng)鼠標(biāo)滑過復(fù)選框文本時變?yōu)閞ed*/狀態(tài)是用 : 冒號進(jìn)行區(qū)分每一個狀態(tài)。更詳細(xì)的狀態(tài)列表在五、樣式表參照表：3 狀態(tài)列表中查找狀態(tài)可以多個一起使用，也可以和輔助控制器一起使用，這樣設(shè)置窗口部件的時候分的會更加詳細(xì)。如下小例子:QCheckBox:hover,QCheckBox:checkedcolor:red;QPushButton:hovercolor:red;屬性 它是一個窗口部件所固有的特征、性質(zhì)，每一個窗口部件都會有屬于他們自己的屬性。如前面做的小例子中我們一直未曾提過color,width,height等。組合多個屬性同時使用設(shè)

7、計(jì)出多種效果。五、樣式表參照表：4 屬性列表查找有更多的詳細(xì)介紹。值 是屬性 : 后面跟隨的一組數(shù)字，顏色或者是一個bool類型等這些我們稱它為值，這些值決定了窗口部件的最終的展示效果。查看值的表達(dá)方式五、樣式表參照表：4 值列表6.邏輯否（?。?有時候我們在設(shè)置某種狀態(tài)的屬性時，希望同時在某些非（?。┑臓顟B(tài)下設(shè)置，這個時候我們就要用（?。﹣磉x擇某種狀態(tài)，比如!checked 、!has-children（沒有子目錄）等等。盒模型（The Box Model） 這個模式指定了4個影響布局的矩形，從而繪制一個自定義的窗口部件。Content rectangle是最里面的矩形，它繪制窗口部件內(nèi)容（

8、如文字，圖片）的地方。padding rectangle包圍content rectangle。它負(fù)責(zé)由padding屬性指定填充操作。主要是窗口部件內(nèi)容與邊緣線(border)之間的空隙，它可以用top，right，bottom和left設(shè)置它的大小。border rectangle 包圍padding rectangle。它為邊界預(yù)留空間。可以認(rèn)為是窗口的外框線。下面講的分割圖形的方法中把border當(dāng)做是一個區(qū)域來理解的。參考四、高級應(yīng)用：九宮格分割法margin rectangle 最外面的矩形，他包圍border rectangle，負(fù)責(zé)指定的邊緣空白區(qū)域，主要是負(fù)責(zé)與其他的窗口部件

9、的距離。如果沒有指定他們四個，則默認(rèn)是四個重合在一起的。如圖：角弧度 窗口部件四個角弧度。radius設(shè)置角的弧度，如border-radius:4px;角的弧度是4px。背景色和前景色 部件的前景色用于繪制窗口部件上面的文本，可以通過color屬性指定。 背景色用于繪制窗口部件的填充矩形，可以通過background-color屬性指定。 背景圖片使用background-image屬性定義，它用于繪制由background-origin指定在盒模式中四個區(qū)域的圖片開始顯示的起點(diǎn)位置。背景圖片在盒模式域內(nèi)的對齊和平鋪方式可以通過background-position和background-r

10、epeat屬性指定。 如果指定的背景圖片具有alpha通道（透明效果），通過background-color指定的顏色將會透過透明區(qū)域。在background-color屬性中有介紹。10.（#）指定某一個按鈕，#號后面是指定類的對象名。要知道代碼才能運(yùn)用。語法介紹與問題解決：1.語法選擇器 屬性 : 值 ;QPushButtoncolor：red； 選擇器 : 狀態(tài)屬性 : 值 ; QPushButton ：hovercolor ：red； 選擇器 : 輔助控制器 屬性 : 值; QCheckBox：indicatorcolor：red； 選擇器 : 輔助控制器 , 選擇器 : 輔助控制器

11、屬性 : 值; QTabBar:tab:selected, QTabBar:tab:hover background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #fafafa, stop: 0.4 #f4f4f4, stop: 0.5 #e7e7e7, stop: 1.0 #fafafa); 選擇器 : 狀態(tài) , 選擇器 : 狀態(tài) 屬性 : 值;QPushButton:hover, QPushButton:pressedcolor : red; 選擇器 , 選擇器 , 選擇器 屬性 : 值; QLineEdit，QPushButt

12、on，QCheckBox color ：red； 你可以任意的組合，當(dāng)然這只是簡單的組合，還有更加復(fù)雜的組合。1.可以先查看一下選擇器的表達(dá)方式，考慮一下是只對一個類進(jìn)行操作還是，對整個界面操作，仔細(xì)閱讀整個表格1.樣式選擇器類型表確定應(yīng)用哪種樣式表。2.選擇器的格式確定后，就要確定你要所要針對的具體的類型，那么就參照2.可以應(yīng)用樣式表的窗口部件。3.之后就查看你所要應(yīng)對的選擇器里的部分進(jìn)行設(shè)置，就要再去查看輔助控制器。4.再分的細(xì)一點(diǎn)，搞清楚一個窗口部件分為幾個狀態(tài)，鼠標(biāo)劃入，點(diǎn)擊，關(guān)閉.他們決定了你所要設(shè)置狀態(tài)的屬性設(shè)置。定位了前面的，就要改變他的特性了，也就是進(jìn)行屬性設(shè)置，查找屬性表，對

13、應(yīng)屬性表超找對應(yīng)的值表，也有可能還要通過值表的迭代（值的值還需要一個方式表達(dá)。）最終知道這個值是數(shù)字，還是一個顏色，或者是一個bool類型，抑或是其他的關(guān)鍵詞(如padding、content.)。仔細(xì)閱讀他們之間的關(guān)系。2.遇到問題 也許你已經(jīng)組合了很多的樣式表，但是有時候你會發(fā)現(xiàn)，有時候有些屬性值不起作用，或者說圖像變形，并不是你所要看到的效果，不要著急。查看一下你的語法是否正確，如果你保證確保無誤的話，那么就想一想，是否是在構(gòu)建這個窗口控件之前進(jìn)行設(shè)置的，這個會影響到你的屬性是否被讀入。參考六、附屬例題解釋：32. 定制QTool查看是否被其他的屬性覆蓋。當(dāng)一個屬性被具有同一選擇器的幾個

14、規(guī)則設(shè)置時，那么只有最后一個規(guī)則起作用（這是一個難點(diǎn)）。查看是否有相應(yīng)的關(guān)聯(lián)的屬性已被設(shè)為bool=1。圖片無法顯示：查看路徑是否正確在Qt中是”/”代替window下的”,使用相對路徑，本應(yīng)用程序的相對路徑（是相應(yīng)程序讀取這個樣式css文件），當(dāng)然你也可以寫絕對路徑的方式讀取圖片，但是路徑這個方法是不提倡的。大小變化的窗口控件是否背景圖片選擇了border-image。詳細(xì)參考四、高級應(yīng)用與六、附屬例題解釋：34.QPushButton與image高級應(yīng)用：1.九宮格分割法： 之所以叫做九宮格分割法是源于，把邊界圖分為3X3的小格，當(dāng)填充窗口部件時如圖A，4個角保持不變，如圖B,ABCDEF

15、GHT A：原始圖 ABCDE FCHT B：結(jié)果圖其他的5個格子被拉伸或者平鋪填充可用的空間。使用border-image屬性可以指定各個邊界圖，他要求指定一個圖像文件名和定義9個格子的4條“切線”。切線用到上、右、下和左邊緣的距離定義。Border.png作為邊界圖，距離上、右、下和左的切線為4、8、12和16應(yīng)該如下定義：border-image：url（boder.png） 4 8 12 16;但使用邊界圖時，必須顯示地設(shè)置border-image屬性。一般情況下，border-width應(yīng)該與切線的位置一致；否則，為了與border-width相符合，角上的格子將被拉伸或者縮短。對b

16、order.png應(yīng)該這樣設(shè)置指定他的四個邊框的寬度：border-width: 4px 8px 12px 16px; 這樣才能把剛才切割的四個角的圖片完全的放置到border中當(dāng)做border區(qū)域的背景。漸變器Qt支持三種漸變器查看例題5.漸變器線性漸變（qlineargradient）：連接這兩點(diǎn)的線上有一系列的顏色斷點(diǎn)。兩個控制點(diǎn)之間的不同位置指定不同的顏色。位置用0和1之間的浮點(diǎn)數(shù)來確定，0對應(yīng)著第一個控制點(diǎn)，1對應(yīng)著第二個控制點(diǎn)。兩個指定斷點(diǎn)之間的顏色由線性插值得出。輻射漸變（qradialgradient）：有一個中心點(diǎn)（xn，yn），半徑r，一個焦點(diǎn)（xf，yf）以及顏色斷點(diǎn)定義

17、。中心點(diǎn)和半徑定義一個圓。顏色從焦點(diǎn)向外擴(kuò)散，焦點(diǎn)可以是中心點(diǎn)或者圓內(nèi)的其它點(diǎn)。梯形漸變（qconicalgradient）：由一個中心點(diǎn)（xn，yn）和一個角度a定義。顏色在中心點(diǎn)周圍像鐘表的秒針掃過一樣擴(kuò)散。五、樣式表參照表： 1.樣式選擇器類型表選擇器實(shí)例可以匹配的窗口部件全局對象*對全局的任意窗口部件類型QDial給定類的實(shí)例，包括這個類的子類類.QDial給定類的實(shí)例，不包括子類標(biāo)識QDial#ageDial給定對象名稱的窗口(ageDial表示對象的名字，在代碼中可知)Qt屬性QDialy=”0”為某些屬性賦值的窗口，表示當(dāng)Y（屬性）為0（false）或者為1 （true）的時候子

18、對象QFrame QDial給定窗口部件的直接子類子孫對象QFrame QDial給定窗口部件的子孫窗口部件2.可以應(yīng)用樣式表的窗口部件表 = 選擇器部件可應(yīng)用的樣式QAbstractScrollArea上圖為一個QTextEdit文字不能完全顯示而自動添加的滾動條1.支持盒模型。2.所有QAbstractScrollArea（QAbstractltemView、QGraphicsView、QMdiArea、QPlainTextEdit、QScrollArea、QTextEdit）的派生類，包括QTextEdit 和QAbstractItemView(帶item的類)，用background-

19、attachment屬性支持背景可滾動的，設(shè)置background-attachment屬性為fixed則提供一個background-image背景圖片不跟隨滾動條滾動，反則設(shè)置background-attachment屬性為scroll則是背景圖片可以跟隨滾動條滾動。3.具體看例：6定制QAbstractScrollArea。QCheckBox支持盒模型，可以用 :indicator 輔助控制器設(shè)置check指示符(一個可以選擇的小方塊)，默認(rèn)時，check指示符放置在部件矩形內(nèi)容的左上角處。spacing屬性指定check 指示符和文本(右側(cè)的描述文字)的距離。具體看例：7定制QChec

20、kBox。QColumnView1.可以被image 屬性控制樣式，arrow(箭頭)指示符可以被 :left-arrow和 :right-arrow輔助控制器樣式控制。QComboBox支持盒模型。下拉按鈕(drop-down button)樣式可以被 :drop-down輔助控制器設(shè)置，默認(rèn)情況下，下拉按鈕填充矩形部件的右上側(cè)，下拉按鈕的箭頭標(biāo)記(arrow mark)通過樣式 :down-arrow輔助控制器控制。默認(rèn)的情況下，箭頭是位于下拉按鈕的中間位置。具體看例：8 定制QComboBox。QDateEdit具體看例：24 定制QSpinBox。QDateTimeEdit具體看例：2

21、4 定制QSpinBox。QDialog只支持background、background-clip和background-origin屬性。Warning：確保我們定義了宏Q_OBJECT在我們定制的部件里。QDialogButtonBox上圖QDialog對話框中的按鈕可以用button-layout屬性改變按鈕的布局。QDockWidget當(dāng)浮動窗口?？康臅r候，支持標(biāo)題欄和標(biāo)題欄按鈕。border屬性可以控制浮動窗口的邊框。:title輔助控制器可以定制標(biāo)題欄樣式。:title輔助控制器上的 :close-button控制浮動窗口關(guān)閉按鈕屬性，float-button浮動控制按鈕。當(dāng)標(biāo)題欄

22、可視的時候，:vertical狀態(tài)被設(shè)置，當(dāng)然這個狀態(tài)取決于浮動窗口的3種狀態(tài)設(shè)置。即 :floatable、:closable和 :movable狀態(tài)。Note：用QMinWindow:separator 去設(shè)計(jì)大小處理。Warning：設(shè)置的樣式不能應(yīng)用于未?？康拇翱谏?。具體看例：9定制QDockWidget。QDoubleSpinBox具體看例：24 定制QSpinBox。QFrame支持盒模式。自Qt版本4.3開始，在QLabel上設(shè)置一個樣式表將自動設(shè)置QFrame:frameStyle屬性到QFrame:StyledPanel。具體看例：10定制QFrame。QGroupBox支持

23、盒模式。:title輔助控制器設(shè)置標(biāo)題樣式（圖片中“GroupBox”字樣）。默認(rèn)的情況下，標(biāo)題位置取決于QGroupBox:textAlignment.在可點(diǎn)擊選擇的情況下，標(biāo)題包含check指示符用 :indicator輔助控制器設(shè)置。Spacing屬性是控制check指示符與文本描述的空間。具體看例：11定制QGroupBox。QHeaderView支持盒模式。:section輔助控制器設(shè)置標(biāo)題視圖，section輔助控制器支持 :middle、:first、:last、:only-one、next-selected、:previous-selected、:selected 和 :che

24、cked狀態(tài)。:up-arrow和 :down-arrow設(shè)置排序的樣式。具體看例：15定制HeaderView。QLabel支持盒模式。不支持鼠標(biāo)懸停狀態(tài)(鼠標(biāo)經(jīng)過的時候)。自Qt版本4.3開始，在QLabel上設(shè)置一個樣式表將自動設(shè)置QFrame:frameStyle屬性到QFrame:StyledPanel。4.具體看例：10 定制QFrame（QLabel類繼承自QFrame）。QLineEdit支持盒模式。selection-color和 selection-background-color分別設(shè)置選擇時的背景顏色和和前景色。lineedit-password-character的屬

25、性設(shè)置密碼類型。4.具體看例： 13定制QLineEdit。QListView支持盒模式。當(dāng)表格交替顏色是可以選擇的，表格交替顏色設(shè)置用alternate-background-color屬性設(shè)置。選擇的顏色selection-color和selection-background-color控制選擇顏色和選擇的背景顏色。show-decoration-selected屬性控制選擇行為。:item更加細(xì)致的控制QListView的items。具體看例： 6定制QAbstractScrollArea。 具體看例： 14定制QListView。QListWidget具體看例： 14定制QListVi

26、ew。QMainWindow（主窗口）支持樣式分割器。在QMainWindow用分割器時，QDockWidget用:separator輔助控制器來設(shè)置樣式。2.具體看例： 15定制QMainWindow。QMenu（菜單）支持盒模式。:item輔助控制器設(shè)置每一個items，除此之外還支持狀態(tài)如 :selected、:default、 :exclusive和non-exclusive狀態(tài)。3.:indicator輔助控制器設(shè)置菜單的可點(diǎn)擊的屬性。4.菜單分隔風(fēng)格樣式由:separator輔助控制器設(shè)置。5.right-arrow和 left-arrow設(shè)置子目錄箭頭是向右還是向左。6.:scr

27、oller設(shè)置滾動條。7.:tearoff設(shè)置tear-off（拆卸下來成為獨(dú)立的窗口）8.具體看例： 16定制QMenu。QMenuBar（菜單欄）支持盒模式。spacing屬性設(shè)置兩個item的距離。:item輔助控制器控制每一個items的樣式。4.具體看例： 17定制QMenuBar。QMssageBox（彈出來的報告錯處，提示的對話框）Messagebox-text-interaction-flags屬性用來修改消息框中的文本QProgressBar1.支持盒模式。2.:chunk輔助控制器設(shè)置塊狀結(jié)構(gòu)樣式(進(jìn)度條里面的顏色設(shè)置可能是一段一段的)的進(jìn)度。條塊是顯示在盒模時的conte

28、nt中。3.進(jìn)度條中如果顯示文字，text-align屬性設(shè)置進(jìn)度條中文字位置。4.:indeterminate不確定狀態(tài)設(shè)置。具體看例： 18定制QProgressBar。QPushButton1.支持盒模式。2.:default、:flat(外框是否突起)、:checked狀態(tài)。3.當(dāng)按鈕在菜單欄里時，用:menu-indicator 輔助控制器設(shè)置菜單欄的風(fēng)格。4.用:open 和 :closed定制是否可點(diǎn)擊的按鈕。5.例如：QPushButton background-color：red；border：none； 6.具體看例： 19定制QPushButton。QRadioButto

29、n1.支持盒模式。2.可以用 :indicator 輔助控制器設(shè)置check指示符(一個可以選擇的小圓圈)，默認(rèn)時，check指示符放置在矩形內(nèi)容的左邊。3.spacing屬性指定check 指示符和文本(右側(cè)的描述文字)的距離。4.具體看例： 20定制QRadioButton。QScrollBar1.支持盒模式。2.控件上盒模式橫縱的content的內(nèi)容依賴于槽上的滑動器（hangle）的移動。3.QScrollBar的范圍（長或者寬由scroll的方向確定）由width和height設(shè)置，用:horizontal和:vertical設(shè)置方向。4.:handle(句柄)輔助控制器寬或者高（設(shè)

30、置min-width或者min-height）的最小寬度和最小高度，取決于它的方向。5.:add-line設(shè)置添加內(nèi)容的按鈕樣式。依賴于箭頭的方向。:right-arrow和:down-arrow,箭頭默認(rèn)是在add-line的盒模式contents的中間位置。6.:sub-line設(shè)置減少內(nèi)容的按鈕樣式。:left-arrow和:up-arrow，箭頭在按鈕的中間位置。7.:sub減少頁和add增加頁。.具體看例： 21定制QScrollBar。QSizeGrip(通過它可以改變它所在頂級窗口的大小，在頂級窗口的右下角)1.支持width、height、image屬性。2.具體看例： 22定

31、制QSizeGrip。QSlider1.支持盒模式。2.對于橫向，min-width和height屬性必須提供。3.對于縱向，min-height和width屬性必須提供。4.:groove設(shè)置槽，一般情況下槽是默認(rèn)在盒模式的content中，控件可以滑動的handle(句柄)用:handle輔助控制器設(shè)置。句柄在槽上移動，在盒模式中的content。5.具體看例： 23定制QSlider。QSpinBox支持盒模式。:up-button和up-arrow控制上面的按鈕和按鈕上箭頭。:down-button和down-arrow控制下面的按鈕和按鈕上的箭頭。默認(rèn)箭頭在按鈕的中間位置。具體看例：

32、 24定制QSpinBox。QSplitter(界面分離器)一個界面被分為兩個1.支持盒模式。2.:handle設(shè)置分割器可移動句柄handle。具體看例： 25定制QSplitter。QStatusBar（狀態(tài)欄）1.只有background屬性起作用，每一個items用:items設(shè)置。2.具體看例： 26定制QStatusBar。QTabBar每一個tab頁用:tab設(shè)置樣式，關(guān)閉用 :close-button,tab頁支持only-one、:fist、:last、:middle、:privious-selected、:next-seleced、:selected狀態(tài)。:top、:lef

33、t、:right、:bottom狀態(tài)取決于tabs在部件的方向。選擇重疊tabs狀態(tài)（這個狀態(tài)時表示在很多tab的時候，點(diǎn)擊一個tab頁為當(dāng)前顯示時，就表示這個tab突出覆蓋了左右tab的n個px）是利用負(fù)margins（盒模式中的margin）或者是相對位置來控制。當(dāng)tab很多個的時候，有時候tabbar不能把它完全顯示出來，就會在tabbar上顯示可以左右調(diào)節(jié)tab頁的按鈕，這個按鈕為 QToolButton，定制這個QToolButton的寬度用:scroller輔助控制器定制 。:tear定制tear指示器的樣式。QTabBar的tab方向用alignment（top|bottom|l

34、eft|right|center）設(shè)置。6.改變QTabWidget的QTabBar方向用tab-bar輔助控制器。7.具體看例： 27定制QTabWidget和QTabBar。QTabWidget1.用:pane設(shè)置頁面的外框。2.:left-corner 和 :right-corner設(shè)置左側(cè)角落和右側(cè)角落。3.它的tab位置通常用:tab-bar 設(shè)置，默認(rèn)是QWindowsStyle的風(fēng)格。4.:top, :left, :right, :bottom選擇tab上、左、下和右的方位。5.具體看例： 27定制QTabWidget和QTabBar。QTableView支持盒模式。altern

35、ating row colors可用的時候我們可以使用屬性alternate-background-color控制交替的表格背景顏色。selection-color和 selection-background-color屬性設(shè)置選擇item的前景顏色和背景顏色。在QTableView中控件可以作為一個QAbstractButton和可以用QTableView QTableCornerButton:section設(shè)置樣式。表格顏色gridline-color。6.參看QAbsractScrollArea 設(shè)置背景backgrounds。 具體看例： 28定制QTableView。QTableWi

36、dget具體看例： 28定制QTableView。QTextEdit（一個文本編輯器）支持盒模式。selection-color 和selection-background-color決定它的文本顏色和背景顏色。具體看例： 6定制QAbstractScrollArea。QTimeEdit具體看例： 24定制QSpinBox。QToolBar（工具欄）1.支持盒模式。2.:top, :left, :right, :bottom工具欄的位置，是在主窗口的上，左，右，下狀態(tài)設(shè)置屬性。3.:first, :last, :middle, :only-one選擇了工具欄中第一組按鈕。4.工具欄的分隔符是由

37、:separator控制。5.可以控制工具欄可移動:handle選擇器選擇它并改變樣式。6.具體看例： 29定制QToolBar。QToolButton（工具欄按鈕）1.支持盒模式。2.如果QToolBox有一個菜單，:menu-indicator來選擇它的指示符（就是可以移動工具欄的句柄，可以參考WPS的新建工具欄）。3.當(dāng)QToolBar在QToolButton:MenuButtonPopup模式下，:menu-button控制這個菜單按鈕，:menu-arrow是控制這個按鈕的箭頭，默認(rèn)的情況下會放置在按鈕上content位置。4.當(dāng)QToolBar顯示箭頭時候:up-arrow, :d

38、own-arrow, :left-arrow and :right-arrow 可以被用到。5.具體看例： 30定制QToolButton。QToolBox如同好友QQ模式1.支持盒模式。2.:tab輔助控制器設(shè)置tab，tab支持:only-one、:first、:、last:、middle:、previous-selected:next-selected、:selected狀態(tài)。QToolTip（鼠標(biāo)劃過時的提示語）1.支持盒模式。2.支持opacity（不透明）屬性。具體看例： 10定制QFrame（QToolTip類繼承自QFrame）31定制QToolTip。QTreeView1.支

39、持盒模式。2.當(dāng)alternating row colors（行交替著不同的顏色） 是可用的時候，可以通過alternate-background-color屬性設(shè)置它交替顏色。3.selection-color屬性和selection-background-color屬性設(shè)置選擇item的前景顏色和背景顏色。4.show-decoration-selected設(shè)置選擇行為屬性。5.分支輔助控制器:branch支持:open, :closed, :has-sibling and :has-children狀態(tài)。6.:item輔助控制器更詳細(xì)的控制QTreeView的items。7.看QAbsr

40、actScrollArea關(guān)于可滾動背景的描述。具體看例： 32定制QTreeView。QTreeWidget具體看例： 32定制QTreeView。QWidget只支持background, background-clip 和 background-origin屬性。如果你的類是QWidget的子類，你需要重寫paintEvent函數(shù)如下：void CustomWidget:paintEvent(QPaintEvent *) QStyleOption opt; opt.init(this); QPainter p(this); style()-drawPrimitive(QStyle:PE_

41、Widget, &opt, &p, this); /*如果沒有樣式表設(shè)置，那么它是什么作用都不起的*/Warning：確保我們定義了宏Q_OBJECT在我們定制的部件里。輔助控制器列表輔助控制器說明:add-line在QScrollBar中添加一行的按鈕。:add在QScrollBar中添加頁的按鈕。:branchQTreeView的分支。:chunkQProgressBar的進(jìn)度條里的塊（里面的進(jìn)度條可以變成一塊一塊的增加，而不是整體都是一種顏色）。:colse-buttonQDockWidget和QTabBar標(biāo)題欄上的關(guān)閉按鈕。:corner在QAbstractScrollArea兩個滾

42、動條之間的位置。:drwn-arrowQComboBox、QHeaderView(排序時需要)、QScrollBar、QSpinBox的向下箭頭。:down-buttonQScrollBar、QSpinBox的向下按鈕。:drop-downQComboBox展開時。:float-buttonQDockWidget標(biāo)題欄上的浮動按鈕。:grooveQSlider的槽。:indicatorQAbstractitemView、QCheckBox、QRadioButton、可點(diǎn)擊的QMenu的item、可點(diǎn)擊的QGroupBox的指示符。:handleQScrollBar、QSplitter、QSli

43、der的滑塊。:iconQAbstractitemView和 QMenu的圖標(biāo)。:itemQAbstractitemView、QMenuBar、QMenu、QStatusBar的單獨(dú)的一項(xiàng)。:left-arrowQScrollBar的向左的箭頭。:left-cornerQTabWidget的左側(cè)。:menu-arrow菜單里QToolButton箭頭。:menu-button工具欄上的按鈕。:menu-indicator菜單里的QPushButton指示符。:right-arrowQMenu或者是QScrollBar的右側(cè)箭頭。:paneQTabWidget去掉標(biāo)題的框架。:right-cor

44、nerQTabWidget的右側(cè)。:scrollerQMenu和QTabBar因?yàn)榻缑娲笮〔季肿笥艺{(diào)試的滾動按鈕。:sectionQHeaderView的表頭橫向和縱向。:separatorQMainWindow和QMenu的分離器（就是一個主窗口被分割成幾個小的區(qū)域的線，QMenu里是item的分離線）。:sub-lineQScrollBar內(nèi)容減少方向的按鈕。:subQScrollBar減少一頁的按鈕，在滑塊與減少一行sub-line之間。:tabQTabBar和QToolBox的一個頁選項(xiàng)。:tab-bar一個QTabWidget的tab按鈕，設(shè)置tabs一般用:tab。:tearTab

45、Bar的指示符:tearoffQMenu的指示符:textQAbstractitemView的內(nèi)容。:titleQGroupBox和 QDockWidget的標(biāo)題。:up-arrowQHeaderView（排序時）、QScrollBar、QSpinBox向上按鈕箭頭。:up-buttonQSpinBox的向上按鈕。狀態(tài)列表狀態(tài)說明:active當(dāng)前活動的窗口。:adjoins-itemQTreeView的一個branch存在毗鄰下一個與自己不是兄弟項(xiàng)目的項(xiàng)。:alternate當(dāng)QAstractitemView的QAstractitemView：alternatingRowColors()的屬

46、性設(shè)置為true時，行之間背景顏色交替顏色變化，:bottom在item的下面，例如QTabBar的tab按鈕在下面。:checked按鈕已選中。:closableitems是可以關(guān)閉的，例如QDockWidget有一個QDockWidget：DockWidgetClosable的功能。:closed（open相對的）窗口位于關(guān)閉或者銷毀的狀態(tài)，例如QTreeView沒有打開時的狀態(tài):default默認(rèn)的狀態(tài)。:disabled禁用窗口部件:editabledQComboBox可以編輯的:edit-focus那種可編輯的控件，比如文本框，當(dāng)它正在編輯的時候，就是QStyle:State_Has

47、EditFocus狀態(tài)。:enabled啟用窗口部件。:exclusive表示按鈕組設(shè)置為單選，只能選擇一個的狀態(tài)。例如菜單欄的選項(xiàng)。:first部件的第一個，例如QTabBar的第一個tab:flat沒有突起的部件。:floatable部件是可浮動，例如QDockWidget。:focus窗口部件有輸入焦點(diǎn)。:has-childrenItem有子目錄的，例如QTreeView。:has-siblings有兄弟目錄的，例如QTreeView。:horizontal部件是橫向的。:hover鼠標(biāo)劃過窗口部件時的狀態(tài)。:indeterminate按鈕部分被選中的狀態(tài)。:last最后一個，例如：QT

48、abBar的最后一個tab。:left位于左面，例如QTabBar的tab位于左面的那個。:maximized最大化狀態(tài)。:middle在列表中中間位置，例如QTabBar的tab不是最后一個也不是第一個的。:minimized最小化的時候。:movable這個部件可以移動，例如 QDockWidget。:no-frame這個部件是沒有frame的，例如QLineEdit和QSpinBox。:non-exclusive不能單選的，菜單來就是單選的。:off前提是這個部件是可以選或者不選的，與on相對，窗口部件是“off”狀態(tài)。:on前提是這個部件是可以選或者不選的，與off相對，窗口部件是“o

49、n”狀態(tài)。:only-on只有一個，例如QTabBar只有一個tab的時候。:open窗口部件位于打開或者是展開的狀態(tài)，如QTreeView，QComboBox和QPushButton在menu時的打開狀態(tài)。:next-selected選擇下一個的時候，在列表中，例如QTabBar。:pressed鼠標(biāo)按鍵點(diǎn)擊窗口部件:previous-selected選擇上一個，例如QTabBar。:read-only部件是只讀的，例如QLineEdit,和QComboBox的編輯窗口為不可編輯時。:right部件位置的右側(cè)，QTabBar的tab可以位于右側(cè)。:selected被選擇的，例如QTabWid

50、get被選擇的tab頁或者是QMenu下拉菜單被選擇的某一個條目。:top位于部件的上面，例如QTabBar的tab可以位于上面，也可以在下面一樣。:unchecked按鈕未被選中的。:vertical垂直的方向。:window這個部件是一個窗口。5.屬性列表屬性 值說明alternate-background-colorBrush表示交替論表格顏色的屬性，它應(yīng)用于QAbatractitemView的子類，如果你不設(shè)置這個顏色值，它會有一個默認(rèn)的值備用。QTreeView alternate-background-color: blue; background: yellow; 你也可以參考b

51、ackground和selection-background-colorbackgroundBackground簡單的設(shè)置背景顏色，等價于backgroun-color,background-image,background-repeat或者backgroun-position.這個屬性支持QAbstractitemView的子類，子類包括（QAbstractSpinBox子類,QCheckBox,QDialog,QFrame,QGroupBox,QLabel,QLineEdit,QMenu,QMenuBar,QPushButton,QRadioButton,QSplitter,QTextEd

52、it,QToolTip,和plain的QWidgets）通常，它需要設(shè)置Qt:BrushStyle樣式一個填充模式，你可以用background-color屬性為三個漸變器來和Qt:SolidPattern設(shè)置樣式。QLabel background-color: yellow QLineEdit background-color: rgb(255, 0, 0) 可以參考：background-origin,selection-background-color,background-clip,background-attachment,alternete-background-color.ba

53、ckground-colorBrush用于部件的背景顏色。例如：QLabel background-color: yellow QLineEditbackground-color: rgb(255, 0, 0) background-imageUrl用于部件的背景圖片，可以用background-color的般透明度給圖片加效果。QFrame background-image: url(:/images/hydro.png) background-repeatRepeat無論是否指定重復(fù)的填充背景圖片(background-image)于盒模式的矩形內(nèi)，只要圖片太小它都會自動的重復(fù)填充。如果這

54、個y或者x屬性沒有被指定，背景圖片是從兩邊(x.y)同時開始重復(fù)。例：QFrame background: white url(e:/wb/styles/start.png); background-repeat: repeat-y; background-position: right; 這樣我們指定了背景圖片它重復(fù)的方向是y（豎著）軸，右側(cè)開始。backgroud-positionAlignment在盒模式中定位背景圖片開始顯示的位置，默認(rèn)是左上角開始顯示。例如：QFrame background: url(:/images/footer.png); background-position

55、: bottom left; 這樣就可以設(shè)置部件顯示圖片是從左下角開始顯示。background-attachmentAttachment描述背景圖片是否在QAbstractScrollArea的區(qū)域跟隨滾動條滾動，scrolled是圖片跟隨滾動條滾動，fixed是圖片不跟隨滾動條滾動。QTextEdit background-image: url(leaves.png); background-attachment: fixed; 可以參考backgroundbackground-clipOrigin1.在部件的盒模式中那些可以當(dāng)做背景顯示的。2.這個屬相指定盒模式的backgroud-co

56、lor和background-image被裁減。3.這個屬性支持以下類QAbstractItemView的子類, QAbstractSpinBox subclasses, QCheckBox, QComboBox, QDialog, QFrame, QGroupBox, QLabel, QPushButton, QRadioButton, QSplitter, QTextEdit, QToolTip, 和一些無復(fù)雜設(shè)置的QWidgets.4.如果沒有使用該屬性，那么默認(rèn)情況下是border。5.例如：QFrame background-image: url(:/images/header.pn

57、g); background-position: top left; background-origin: content; background-clip: padding; 6.可參考background, background-origin 和The Box Model.background-originOrigin可以background-position 和background-image聯(lián)合一起使用設(shè)置空間的背景顯示在盒模式中的起點(diǎn)位置。默認(rèn)是支持類QAbstractItemView 的子類, QAbstractSpinBox subclasses, QCheckBox, QCom

58、boBox, QDialog, QFrame, QGroupBox, QLabel, QPushButton, QRadioButton, QSplitter, QTextEdit, QToolTip, 和一些設(shè)置比較單一的 QWidgets.默認(rèn)情況下是padding。例子： QFrame background-image: url(:/images/header.png); background-position: top left; background-origin: content; 5.可以參考background 和 The Box Model.borderBorder簡便的設(shè)置

59、部件的外框線。等價于border-color, border-style, 或者 border-width.這個屬性支持QAbstractItemView 的子類, QAbstractSpinBox subclasses, QCheckBox, QComboBox, QFrame, QGroupBox, QLabel, QLineEdit, QMenu, QMenuBar, QPushButton, QRadioButton, QSplitter, QTextEdit, QToolTip, 和一些設(shè)置比較單一的 QWidgets.例子： QLineEdit border: 1px solid

60、white border-topBorder簡單的設(shè)置部件上的外框線，等效于border-top-color, border-top-style,或者 border-top-widthborder-rightBorder簡單的設(shè)置部件上的右外框線，等效于border-right-color, border-right-style,或者 border-right-widthborder-bottomBorder簡單的設(shè)置部件上的左外框線，等效于border-bottom-color, border-bottom-style,或者 border-bottom-widthborder-leftBor