QT框架不僅提供了基本的控件,也支持開發者自定義控件。在QT中使用樣式表(CSS)可以使自定義控件具有更美觀的外觀。下面介紹如何使用CSS來控制QT自定義控件的樣式。
首先,在QT設計師中創建一個自定義控件。為了讓CSS生效,需要在控件的構造函數中設置樣式表。
MyCustomWidget::MyCustomWidget(QWidget* parent) : QWidget(parent)
{
setStyleSheet(
"background-color: #8f8f8f;"
"border-radius: 10px;"
"border: 1px solid #555555;"
);
}
上述代碼設置了自定義控件的背景顏色、圓角半徑和邊框。使用分號隔開不同的樣式,相當于使用CSS樣式表。
當然,更復雜的樣式也可以使用QT的偽狀態(pseudo-states)和偽類(pseudo-classes)進行設置。比如,下面的代碼為控件在鼠標懸停時設置不同的樣式。
MyCustomWidget::MyCustomWidget(QWidget* parent) : QWidget(parent)
{
setStyleSheet(
"background-color: #8f8f8f;"
"border-radius: 10px;"
"border: 1px solid #555555;"
"}"
"MyCustomWidget:hover {"
"background-color: #bfbfbf;"
"border: 1px solid #888888;"
);
}
需要注意的是,CSS中用到的屬性名應該與QT中對應控件的屬性名一致,否則設置會失效。同時,QT支持的偽狀態和偽類也有限制。具體可以查看QT官方文檔。
總之,使用CSS可以為QT自定義控件提供豐富的視覺效果,使控件更符合設計者的要求。
上一篇css通常稱為層疊樣式表
下一篇r shiny css