文章目錄
- QSS
- id選擇器 & 類型選擇器
- 偽類選擇器
- 盒子模型
QSS
設置樣式的時候，是可以指定某個控件來設置的。
指定控件之后，此時的樣式就會針對這個指定的控件，也會針對子控件生效
ui->pushButton_2->setStyleSheet("QPushButton { color: green; }");
QPushButton 沒有子控件
this->setStyleSheet("QPushButton {color : red ; } ") ; //會針對this的子控件也生效.
既是要考慮到子控件,也是要和選擇器相關的.
- 如果設置了全局樣式，然后在某個控件里又設置了其他的樣式，會出現什么問題？
? 全局樣式，和在某個控件里又設置的其他的樣式,這兩個樣式會"疊加"起來
2 如果設置了全局樣式，在某個控件里設置的樣式和全局樣式沖突了，會出現什么問題？
當全局樣式和局部樣式沖突的時， 局部樣式的優先級是更高的。覆蓋了對應的全局樣式
場景：實際開發中,就可以在全局樣式中設置比較通用的樣式，統一整個程序的界面風格.如果需要針對某個控件進行微調,可以使用局部樣式來做出調整.
把樣式代碼拎出來，放到單獨的文件中。
后續可以直接讓 C++ 代碼來讀取并加載文件內容
- 創建 qrc 文件，通過 qrc 管理樣式文件。
- 創建單獨的 qss 文件，把這樣的文件放到 qrc 中
- 編寫 C++ 代碼，讀取 qss 文件中的內容，并設置樣式。
例如：
QT: QT - Gitee.com
id選擇器 & 類型選擇器
當類型選擇器和 id 選擇器選中同一個控件時，并且設置的樣式是沖突的，此時，id 選擇器的優先級更高
例如：
qss_4 · beihangya/QT - 碼云 - 開源中國
如果不沖突，兩種樣式會疊加
給QCombox的子控件加上圖標
qss_6 · beihangya/QT - 碼云 - 開源中國
偽類選擇器
偽類選擇器,選中的是控件的“狀態""符合一定狀態條件"的控件
qss_7 · beihangya/QT - 碼云 - 開源中國
盒子模型
創建一個 resource.qrc 文件，并導入圖片
qss_10 · beihangya/QT - 碼云 - 開源中國
QCheckBox{font-size : 20px;
}
QCheckBox::indicator{width: 20px ;height : 20px ;
}
QCheckBox::indicator:unchecked{image:url(:/new/prefix1/doge.png);
}
QCheckBox::indicator:unchecked:hover{image:url(:/new/prefix1/rose.jpg);
}
QCheckBox::indicator:unchecked:pressed{image:url(:/image/doge.png);
}
自定義單行輸入框
qss_12 · beihangya/QT - 碼云 - 開源中國
自定義列表框 ，使用漸變色
qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1, stop: 0 #FAFBFE, stop: 1 #DCDEF1)
x1: 起點的橫坐標
y1: 起點的縱坐標
x2: 終點的橫坐標
y2: 終點的縱坐標
stop: 0 起始顏色
stop: 1 結束顏色
例如：
從左到右的漸變
x1: 0 , y1: 0 , x2: 1 , y2: 0
從上到下的漸變
x1: 0 ,y1: 0 , x2: 0 ,y2: 1
對角線方向從左上到右下的漸變
x1: 0 ,y1: 0 ,x2: 1 , y2: 1
需求：自定義菜單欄
qss_14 · beihangya/QT - 碼云 - 開源中國
需求：自定義登錄界面 , 并且給登錄界面設置背景圖
如何設置背景？
解決方案：
1、直接給 QWidget 頂層窗口設置背景圖。
問題 ：但是 Qt 中存在限制，直接給頂層窗口設置背景會失效。
問題原因：（原因暫時不可考）
2、可以給上述控件外頭套上一個和窗口一樣大小的 QFrame 控件。（該方案可以解決設置背景）
QFrame 也是 QWidget 的一個子類。
qss_15 · beihangya/QT - 碼云 - 開源中國
Qt中設置背景圖, 有兩個方式
1、background-image 屬性 ，適用場景 ：圖片固定大小
2、border-image 屬性. 適用場景 ：背景會自動跟隨控件的大小變化
)
項目)
