QTabWidget样式设置注意事项

代码示例见​​​​​​定制QWidget标题栏的示例,并含有qss配置QTabWidget样式的示例-QT文档类资源-CSDN下载

先看qss文件：

QTabWidget::pane {/*修饰tab页的主体*/
	background: transparent;
	border-image: url(./pic/tab_purple.jpg);
	border: 2px;
}
	
QTabBar::tab {/*修饰tab页表头*/
	background: transparent;
	background-color: rgb(80, 80,170);
	padding-left: 20px;/*这两句决定了标签两侧到标签文字的距离*/
	padding-right: 20px;
}

QTabWidget {/*与qss中的QTabWidget一起起作用，让qtabwidget表头右侧的空白区域也呈现与QTabWidget::pane一样的风格*/
	background: transparent;
	border-image: url(./pic/tab_purple.jpg);
	border: 2px;
}

显示效果：

 

注意3点：

1）红色字体所在区域，由qss文件中的QTabWidget::pane设置样式

2）QTabBar::tab设置表头的样式，即图中绿色圆圈所在区域

3）表头右侧还有一块狭长的空白区域，由QTabWidget设置。但是仅仅在qss中设置QTabWidget还不足以控制狭长区域的外观，还应在代码中调用如下语句：

QTabWidget::setAttribute(Qt::WA_StyledBackground);/*与qss中的QTabWidget一起起作用，让qtabwidget表头右侧的空白区域也呈现与QTabWidget::pane一样的风格*/