Qt TabWidget 每个选项卡标题背景颜色

Posted 2023-02-21

【中文标题】Qt TabWidget 每个选项卡标题背景颜色

【英文标题】：Qt TabWidget Each tab Title Background Color

【发布时间】：2018-02-18 14:54:18

【问题描述】：

这是没有设置标题背景颜色的原始Tabwidget

我的客户要求我做这样的事情； 为标题设置不同的背景颜色

All - Yellow
purchase - light blue
POS Sales - light green
Cash Sales - Pink
invoice - light purple

我尝试过 SetStyleSheet 之类的：

     QTabBar 
          background-color : Yellow;
     

但是所有标签颜色都变了 有人知道如何设置每个 QTabBar 背景颜色吗？

【问题讨论】：

尝试在选项卡上使用不同颜色的图标。

ui->tableWidget->item(rowIndex,coloumIndex)->setBackgroundColor(QColor(color)); 还有ui->tableWidget->item(rowIndex,coloumIndex)->setTextColor(QColor(color));

【参考方案1】：

这些属性不能通过 QSS 设置。要更改每个选项卡的样式，我们必须创建一个自定义 QTabBar 并覆盖其 paintEvent 方法，以便能够更改每个选项卡的样式，我们使用 QStyleOptionTab 类，但要更改 QTabWidget 选项卡栏，我们需要使用setTabBar 方法，但这是私有的，因此您需要创建一个自定义的QTabWidget，如下所示：

tabwidget.h

#ifndef TABWIDGET_H
#define TABWIDGET_H

#include <QStyleOptionTab>
#include <QStylePainter>
#include <QTabWidget>

class TabBar: public QTabBar

public:
    TabBar(const QHash<QString, QColor> &colors, QWidget *parent=0):QTabBar(parent)
        mColors = colors;
    

protected:
    void paintEvent(QPaintEvent */*event*/)

        QStylePainter painter(this);
        QStyleOptionTab opt;

        for(int i = 0;i < count();i++)
        
            initStyleOption(&opt,i);
            if(mColors.contains(opt.text))
                opt.palette.setColor(QPalette::Button, mColors[opt.text]);
            

            painter.drawControl(QStyle::CE_TabBarTabShape, opt);
            painter.drawControl(QStyle::CE_TabBarTabLabel,opt);
        
    


private:
    QHash<QString, QColor> mColors;
;

class TabWidget : public QTabWidget

public:
    TabWidget(QWidget *parent=0):QTabWidget(parent)

        // text - color
        QHash <QString, QColor> dict;

        dict["All"] = QColor("yellow");
        dict["purchase"] = QColor("#87ceeb");
        dict["POS Sales"] = QColor("#90EE90");
        dict["Cash Sales"] = QColor("pink");
        dict["invoice"] = QColor("#800080");

        setTabBar(new TabBar(dict));
    
;

#endif // TABWIDGET_H

为了在 Qt Designer 中的 QTabWidget 中使用它，我们应该提升它，我们右键单击 tabwidget 并选择菜单 Promoted Widgets，在我的例子中，前面的代码是在文件 tabwidget.h 中创建的，所以这将是头文件，在Promoted Class Name的情况下，我们使用TabWidget，然后我们按下按钮Add和Promote，得到如下图所示：

最终结果如下图所示：

_{完整的例子可以看下面link}

---

Python：

from PyQt5 import QtGui, QtWidgets


class TabBar(QtWidgets.QTabBar):
    def __init__(self, colors, parent=None):
        super(TabBar, self).__init__(parent)
        self.mColors = colors

    def paintEvent(self, event):
        painter = QtWidgets.QStylePainter(self)
        opt = QtWidgets.QStyleOptionTab()

        for i in range(self.count()):
            self.initStyleOption(opt, i)
            if opt.text in self.mColors:
                opt.palette.setColor(
                    QtGui.QPalette.Button, self.mColors[opt.text]
                )
            painter.drawControl(QtWidgets.QStyle.CE_TabBarTabShape, opt)
            painter.drawControl(QtWidgets.QStyle.CE_TabBarTabLabel, opt)


class TabWidget(QtWidgets.QTabWidget):
    def __init__(self, parent=None):
        super(TabWidget, self).__init__(parent)
        d = 
            "All": QtGui.QColor("yellow"),
            "purchase": QtGui.QColor("#87ceeb"),
            "POS Sales": QtGui.QColor("#90EE90"),
            "Cash Sales": QtGui.QColor("pink"),
            "invoice": QtGui.QColor("#800080"),
        
        self.setTabBar(TabBar(d))

        self.addTab(QtWidgets.QLabel(), "All")
        self.addTab(QtWidgets.QLabel(), "purchase")
        self.addTab(QtWidgets.QLabel(), "POS Sales")
        self.addTab(QtWidgets.QLabel(), "Cash Sales")
        self.addTab(QtWidgets.QLabel(), "invoice")


if __name__ == "__main__":
    import sys

    app = QtWidgets.QApplication(sys.argv)
    app.setStyle("fusion")
    w = TabWidget()
    w.show()
    sys.exit(app.exec_())

【讨论】：

看到了，它在windows系统中没有影响...我忘了安装一些东西到Qt吗？我使用版本 5.9.1

是的，我已经下载了您的示例文件，以便尝试推广到我的项目 tabwidget。循序渐进但没有效果。

这是从你的link下载的项目

这是我为测试而创建的另一个项目，仍然没有效果linkimage

我发送我的 Teamviewer ID 并通过这里？