今天遇到调整QTabWidget样式的问题。最难解决的问题是,标签页上方留出部分空白背景区域。
预实现效果如下
箭头所指区域是背景色。
实现方法
这里我取了个巧,直接设置的 margin-top,暂时没有找到更好的方法。
QTabBar::tab {
margin-top:8px;
}
番外篇
在解决上个问题之前,还遇到另外的问题,就是标签页后面的背景色无法改变,怎么设置都没有效果。最后,查找了许多,发现原因是多方面的。
解决如下:
ui.tabWidgetCentral->setAutoFillBackground(false);
ui.tabWidgetCentral->setAttribute(Qt::WA_StyledBackground);
ui.tabWidgetCentral->setStyleSheet("QTabWidget{ "
"background-color: #F4F8FF;"
"margin-top: 0px;"
"border:none;"
"}"
);
样式参考
ui.tabWidgetCentral->setTabsClosable(true);
ui.tabWidgetCentral->setAutoFillBackground(false);
ui.tabWidgetCentral->setAttribute(Qt::WA_StyledBackground);
ui.tabWidgetCentral->setStyleSheet("QTabWidget{ "
"background-color: #F4F8FF;"
"margin-top: 0px;"
"border:none;"
"}"
"QTabWidget::pane {"
"border-top: 2px solid;"
"border-color: #D7D9DD;"
"background-color: rgb(255, 255, 255);"
"}"
"QTabBar::tab {"
"width:171px;"
"height:24px;"
"font-family:\"方正兰亭黑简体\";"
"font-size:14px;"
"color:#FFFFFF;"
"background:#83AFE2;"
"border-top-left-radius:7px;"
"border-top-right-radius:7px;"
"border:none; "
"text-align:left;"
//"min-height:24px;"
"max-height:40px;"
"margin-top:8px;"
"margin-left:8px;"
"padding-left:8px;"
"}"
"QTabBar::tab:selected{"
"background:#3375C2;"
"border-top-left-radius:0px;"
"border-top-right-radius:7px;"
"}"
"QTabBar::close-button {"
"margin-left:8px;"
"margin-top:8px;"
"image: url(:/GuiCameraSetupWidget/Resources/close2.png);"
"}"
);