You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

如何为QTabWidget的每个标签页单独设置自定义样式?

为QTabWidget的每个标签页单独设置样式

你之前的尝试无效,是因为QTabBar的标签按钮属于QTabWidget的直接子部件,而你创建的self.tab1、self.tab2是标签页的内容容器,和QTabBar的标签按钮不存在父子层级关系,给内容容器设置样式表无法影响到标签按钮。

下面提供两种可行的实现方式:

方法一:使用样式表的:nth-child选择器(推荐)

通过QSS的:nth-child(index)选择器,可以针对QTabBar中的每个标签按钮单独设置样式,直接将样式表应用到QTabWidget上即可。

修改后的核心代码:

# Initialize tab screen
self.tabs = QTabWidget()
# 为每个标签页单独设置样式
self.tabs.setStyleSheet('''
    QTabBar::tab:nth-child(1) {
        font-size: 15pt; 
        color: #55004F; 
        height: 40px; 
        width: 140px;
    }
    QTabBar::tab:nth-child(2) {
        font-size: 20pt; 
        color: #AA004F; 
        height: 40px; 
        width: 140px;
    }
    QTabBar::tab:nth-child(3) {
        font-size: 25pt; 
        color: #FF004F; 
        height: 40px; 
        width: 140px;
    }
''')
self.tab1 = QWidget()
self.tab2 = QWidget()
self.tab3 = QWidget()
# Add tabs
self.tabs.addTab(self.tab1,"TAB 1")
self.tabs.addTab(self.tab2,"TAB 2")
self.tabs.addTab(self.tab3,"TAB 3")

完整可运行代码:

import sys
from PyQt5.QtWidgets import QMainWindow, QApplication, QWidget, QTabWidget, QVBoxLayout
from PyQt5.QtCore import pyqtSlot

class App(QMainWindow):
    def __init__(self):
        super().__init__()
        self.title = 'Tabs tailoring'
        self.setWindowTitle(self.title)
        self.table_widget = TailoredWidget(self)
        self.setCentralWidget(self.table_widget)
        self.show()

class TailoredWidget(QWidget):
    def __init__(self, parent):
        super(QWidget, self).__init__(parent)
        self.layout = QVBoxLayout(self)
        # Initialize tab screen
        self.tabs = QTabWidget()
        # 为每个标签页单独设置样式
        self.tabs.setStyleSheet('''
            QTabBar::tab:nth-child(1) {
                font-size: 15pt; 
                color: #55004F; 
                height: 40px; 
                width: 140px;
            }
            QTabBar::tab:nth-child(2) {
                font-size: 20pt; 
                color: #AA004F; 
                height: 40px; 
                width: 140px;
            }
            QTabBar::tab:nth-child(3) {
                font-size: 25pt; 
                color: #FF004F; 
                height: 40px; 
                width: 140px;
            }
            /* 可选:设置选中标签的样式 */
            QTabBar::tab:selected {
                background-color: #eee;
            }
        ''')
        self.tab1 = QWidget()
        self.tab2 = QWidget()
        self.tab3 = QWidget()
        # Add tabs
        self.tabs.addTab(self.tab1,"TAB 1")
        self.tabs.addTab(self.tab2,"TAB 2")
        self.tabs.addTab(self.tab3,"TAB 3")
        # Add tabs to widget
        self.layout.addWidget(self.tabs)
        self.setLayout(self.layout)

    @pyqtSlot()
    def on_click(self):
        print("\n")
        try:
            for currentQTableWidgetItem in self.tableWidget.selectedItems():
                print(currentQTableWidgetItem.row(), currentQTableWidgetItem.column(), currentQTableWidgetItem.text())
        except AttributeError:
            print("tableWidget未初始化")

if __name__ == '__main__':
    app = QApplication(sys.argv)
    ex = App()
    sys.exit(app.exec_()) 

方法二:自定义QTabBar(复杂场景适用)

如果需要更灵活的样式控制(比如动态修改标签样式),可以自定义QTabBar并重写paintEvent方法,针对每个标签单独绘制样式:

from PyQt5.QtWidgets import QTabBar
from PyQt5.QtGui import QPainter, QColor, QFont
from PyQt5.QtCore import Qt

class CustomTabBar(QTabBar):
    def paintEvent(self, event):
        painter = QPainter(self)
        for index in range(self.count()):
            rect = self.tabRect(index)
            # 根据索引设置不同样式
            if index == 0:
                painter.setPen(QColor("#55004F"))
                painter.setFont(QFont("Arial", 15))
            elif index == 1:
                painter.setPen(QColor("#AA004F"))
                painter.setFont(QFont("Arial", 20))
            elif index == 2:
                painter.setPen(QColor("#FF004F"))
                painter.setFont(QFont("Arial", 25))
            
            # 绘制标签文本
            painter.drawText(rect, Qt.AlignCenter, self.tabText(index))
            # 绘制选中状态背景
            if index == self.currentIndex():
                painter.fillRect(rect, QColor("#eee"))

然后在使用时替换默认的QTabBar:

self.tabs = QTabWidget()
self.tabs.setTabBar(CustomTabBar())

内容的提问来源于stack exchange,提问作者afernandezody

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.16 19:41:57