柚子快報激活碼778899分享：c++ 【Qt】控件樣式案例

http://yzkb.51969.com/

例子：設(shè)置按鈕樣式

（1）設(shè)置一個按鈕

（2）右鍵按鈕，選擇樣式表

（3）編寫全局樣式

font-size 設(shè)置字體大小；

border-radius 設(shè)置圓角矩形；

background-color 設(shè)置背景色；

color 設(shè)置文字顏色；

（3）編寫偽類選擇器

例子：設(shè)置復(fù)選框樣式

要點說明

::indicator

?控件選擇器.

選中 checkbox 中的對鉤部分.

:hover

偽類選擇器.

選中?標移動上去的狀態(tài).

:pressed

偽類選擇器.

選中?標按下的狀態(tài).

:checked

偽類選擇器.

選中 checkbox 被選中的狀態(tài).

:unchecked

偽類選擇器.

選中 checkbox 未被選中的狀態(tài).

width

設(shè)置?控件寬度.

對于普通控件?效 (普通控件使? geometry ?式設(shè)定尺?).

height

設(shè)置?控件?度.

對于普通控件?效 (普通控件使? geometry ?式設(shè)定尺?).

image

設(shè)置?控件的圖?.

像 QSpinBox, QComboBox 等可以使?這個屬性來設(shè)置?控件的圖?.

（1）創(chuàng)建?個 resource.qrc ?件, 并導(dǎo)?以下圖?

使???作為默認形態(tài).

使?綠色作為 hover 形態(tài).

使?紅?作為 pressed 形態(tài).

?

（2）創(chuàng)建一個復(fù)選框

（3）編寫復(fù)選框樣式

QChechBox {

font-size : 50px;

}

QCheckBox::indicator {

width : 50px;

height : 50px;

}

QCheckBox::indicator:unchecked {

image : url(:/201uncheckboxBlack.png);

}

QCheckBox::indicator:unchecked:hover{

image : url(:/201uncheckboxGreen.png);

}

QCheckBox::indicator:unchecked:pressed{

image : url(:/201checkboxRed.png);

}

QCheckBox::indicator:checked {

image : url(:/201checkboxBlack.png);

}

QCheckBox::indicator:checked:hover{

image : url(:/201checkboxGreen.png);

}

QCheckBox::indicator:checked:pressed{

image : url(:/201uncheckboxRed.png);

}

（4）執(zhí)行程序

例子：設(shè)置單行編輯框樣式

屬性說明

border-width

設(shè)置邊框?qū)挾?

border-radius

設(shè)置邊框圓?.

border-color

設(shè)置邊框顏?.

border-style

設(shè)置邊框?格.

padding

設(shè)置內(nèi)邊距.

color

設(shè)置?字顏?.

background

設(shè)置背景顏?.

selection-background-color

設(shè)置選中?字的背景顏?.

selection-color

設(shè)置選中?字的?本顏?.

（1）設(shè)置一個lineEdit

（2）編寫樣式

（3）運行程序

例子：設(shè)置列表框樣式

要點說明

::item

選中 QListView 中的具體條?

:hover

選中?標懸停的條?

:selected

選中某個被選中的條?.

background

設(shè)置背景顏?

border

設(shè)置邊框

qlineargradient

設(shè)置漸變?

（1）設(shè)置listView

（2）編寫純色樣式

（3）編寫漸變色樣式?

純色：選中的區(qū)域中，各個位置的顏色都是一樣的；

漸變色：左側(cè)一個顏色，右側(cè)一個顏色，左側(cè)顏色逐漸向右側(cè)顏色改變

在Qt中使用qlineargradient 設(shè)置漸變色（線性漸變）

此處需要填寫 6 個參數(shù)：（這里的坐標取值是非常有限的，要么是 0 ，要么是 1）

x1 : 起點的橫坐標y1 : 起點的縱坐標x2?: 終點的橫坐標y2 : 終點的縱坐標stop : 0 起始顏色stop : 0 結(jié)束顏色

例子：設(shè)置菜單欄樣式

要點說明

QMenuBar::item

選中菜單欄中的元素.

QMenuBar::item:selected

選中菜單來中的被選中的元素.

QMenuBar::item:pressed

選中菜單欄中的?標點擊的元素

QMenu::item

選中菜單中的元素

QMenu::item:selected

選中菜單中的被選中的元素

QMenu::separator

選中菜單中的分割線

（1）設(shè)置菜單欄、菜單以及菜單項

（2）設(shè)置樣式

例子：設(shè)置背景

（1）設(shè)置多個控件

（2）使用qrc導(dǎo)入圖片

（3）設(shè)置背景?

直觀想法是直接給QWidget頂層窗口設(shè)置背景圖片，但是Qt中存在限制，直接給頂層窗口設(shè)置背景會失效（原因不可靠），但是可以給上述控件外面套上一個和窗口一樣大小的QFrame控件。

在Qt中設(shè)置背景圖，除了background-image之外，還有border-image屬性。

主要是因為

border-image 是可以?動縮放的. 這?點在窗???發(fā)?改變時是?常有意義的

（4）運行程序

柚子快報激活碼778899分享：c++ 【Qt】控件樣式案例

http://yzkb.51969.com/

好文閱讀