QTabWidget, setting colour of tab itself ?

J.Hilk

@SPlatten you can try it via custom dynamic properties and stylesheets

I'm not sure how much of that is already supported in Qt4, you'll have to find out :D

SPlatten

@J-Hilk , how would this work? I've tried various styles in Qt Creator but I can't managed to get the tab background colour changed, keep in mind that there could be several tabs with a different background colour.

J.Hilk

@SPlatten

admittedly one has no direct access to the "Tab" but we can cheat/abuse already existing functions:

for example:

 QTabBar::tab [whatsThis="aTabWithErrors"]{
     background: qlineargradient(x1: 0, y1: 0, x2: 0, y2: 1,
                                      stop: 0 #E1E1E1, stop: 0.4 #DDDDDD,
                                      stop: 0.5 #D8D8D8, stop: 1.0 #D3D3D3);
          border: 2px solid #C4C4C3;
          border-bottom-color: #C2C7CB; /* same as the pane color */
          border-top-left-radius: 4px;
          border-top-right-radius: 4px;
          min-width: 8ex;
          padding: 2px;
 }

than:

ui->myTabwidget->tabBar()->setTabWhatsThis(0, "aTabWithErrors");

SPlatten

@J-Hilk , I don't understand the syntax of what you have posted, what is setTabWhatsThis ?

J.Hilk

@SPlatten its a function of QTabBar
https://doc.qt.io/qt-6/qtabbar.html#setTabWhatsThis

I checked its also part of the qt4 QTabBar class.

SPlatten

@J-Hilk , just tried this and getting:

error: `QTabBar* QTabWidget::tabBar() const' is protected

The line where this error occurs:

ui_->tab_widget->tabBar()->setTabWhatsThis((int)tabIndex, style);

SPlatten

@JoeCFD , @J-Hilk , looking at: https://www.w3schools.com/cssref/css_selectors.asp

Is there a syntax that would allow me to use something like:

QTabBar::tab[id*="c2_tab"] {
    background-color: #ff0000;
}

Where id is the objectName.

J.Hilk

@SPlatten well, I can't reproduce that, this compiles just fine:

 QApplication a(argc, argv);

    QTabWidget tabWidget;
    tabWidget.setStyleSheet("QTabBar::tab[whatsThis=\"aTabWithErrors\"]{"
                            "background-color: darkred;}");

    tabWidget.addTab(new QWidget(), "SomeTab");
    tabWidget.addTab(new QWidget(), "SomeOtherTab");
    tabWidget.show();

    auto tabbar = tabWidget.tabBar();
    tabbar->setTabWhatsThis(1,"aTabWithErrors");

    qDebug() << tabWidget.tabBar()->tabWhatsThis(0);
    qDebug() << tabWidget.tabBar()->tabWhatsThis(1);

    return a.exec();

but I do not get it to work. It works fine with a QPushButton, but not with the tab.

QPushButton btn;
    btn.setStyleSheet("QPushButton[whatsThis=\"aTabWithErrors\"]{background-color:darkred;}");
    btn.setWhatsThis("aTabWithErrors");
    btn.show();

J.Hilk

@SPlatten said in QTabWidget, setting colour of tab itself ?:

Where id is the objectName.

that works too, if you can get access to the tab, to set the objectname ? I'm not sure it has one by default.

JonB

@J-Hilk said in QTabWidget, setting colour of tab itself ?:

@SPlatten well, I can't reproduce that, this compiles just fine:

auto tabbar = tabWidget.tabBar();

At Qt 5 this is fine. But at Qt4 (which is what the OP is using) the only doc reference I can find now Googling is https://het.as.utexas.edu/HET/Software/html/qtabwidget.html#tabBar, and that has

QTabBar * QTabWidget::tabBar () const [protected]

So at Qt4 it was protected..., per the OP's error message! So @SPlatten if you want/need to use the code you have been shown as-is, looks like you will need to subclass QTabWidget so as to gain access to QTabWidget::tabBar(). (Or maybe tabWidget->findChild<QTabBar *>() would work for you to avoid subclassing.)

SPlatten

This post is deleted!

JoeCFD

@SPlatten Ideally it may be better to flash a tiny icon on the tab. For this you may need to customize your tab and it can take long for you make it. You can simply check the source code of qtabwidget and qtabbar and borrow some. But sure you can reset the tab color with style sheet like
warning: yellow; fatal: red.

SPlatten

@JoeCFD , thank you, any samples ?

JoeCFD

@SPlatten I can explain the concept to you, but can not give you code. You create a tabbar class to inherit qtabbar and add it to qtabwidget. Define or add your tabs(a class tab with text and icons) to tabbar and override paintEvent in tabbar to paint all tabs. Then you can add a timer to tab class to hide or display or toggle icons when needed.
QTabBar source code is here:
https://code.woboq.org/qt5/qtbase/src/widgets/widgets/qtabbar.cpp.html

SPlatten

@JoeCFD , thank you

SPlatten

@JoeCFD , hello, I'm trying to do this today, but not sure quite where to start. I have code already existing which I didn't write, the existing code uses a QTabWidget in the UI. Each tab is defined in the UI as QWidget.

Do I replace the QWidget with my own implementation? Is there a tutorial that could help me or guide me through this process ?

I'm getting confused by the online documentation for QTabWidget and QTabBar:

https://doc.qt.io/qt-6/qtabwidget.html
QTabWidget Class
The QTabWidget class provides a stack of tabbed widgets.

https://doc.qt.io/qt-6/qtabbar.html
QTabBar Class
The QTabBar class provides a tab bar, e.g. for use in tabbed dialogs.

I want to implement a tab where I can set the background colour according to my own logic.

I found this:
https://stackoverflow.com/questions/46137500/qt-tabwidget-each-tab-title-background-color

I am trying to tailor it to my problem....the issue I'm having now is that the tabs are already defined in the UI. How can I apply this logic to the tabs that are already defined in the UI ?

SPlatten

@J-Hilk , @JonB , @JoeCFD , This is the current issue or at least one issue:

The UI contained an instance of QTabWidget. This was set-up to contain the following tabs:

&Overall
C&2
&CGU
&LMS
&PDLT
&NLA
P&GU
&HCU
&UPSD
&Sensors

In the XML file these tabs were defined with the class as QWidget I have edited the XML file and changed instances of QTabWidget to TabWidget and the tabs from QWidget to TabBar which matches the names of the new implementation I am trying to use.

However I'm not sure why or what I need to do in order to transfer the tabs from the UI into the class I am using so I can use the colours that the replacement class is going to allow?

SPlatten

@J-Hilk , @JonB , @JoeCFD , a snippet from the UI file:

<widget class="TabWidget" name="tab_widget">
  <property name="font">
    <font>
      <pointsize>12</pointsize>
      <weight>75</weight>
      <bold>true</bold>
    </font>
  </property>
  <property name="styleSheet">
    <string notr="true"/>
  </property>
  <property name="currentIndx">
    <number>0</number>
  </property>
  <widget class="TabBar" nam="overall_tab">
    <property name="focusPolicy">
      <enum>Qt::TabFocus</enum>
    </property>
    <attribute name="title">
      <string>&amp;Overall</string>
    </attribute>
    ....

I can see in my log output that the constructor for the TabBar is called for each instance of the TabBar in the UI file. Can I determine from the constructor call what the title attribute is ?

JonB

@SPlatten
Constructor of what?

As far as I can see code must call either QTabWidget::setTabText(int index, const QString &label), QTabWidget::addTab(QWidget *page, const QString &label) or QTabBar::setTabText(int index, const QString &text). These are all individual calls, there is no "constructor" which takes the tab text/title as a parameter. Nor are any of the methods virtual. I imagine an explicit call is made to one of these after whatever construction. So does that answer your question as "No"?

Meanwhile you can also look in the uic-generated ui_....h file for the actual code used to execute what it reads from the .ui file, if that helps clarify.

SPlatten

@JonB , the default constructor of the TabBar is being called I assume when the UI file is parsed?

class TabBar : public QTabBar {
private:
    QHash<QString, QColor> colors_;

protected:
    void paintEvent(QPaintEvent* evt) {
... 
    }

public:
    TabBar(QWidget* parent = 0) : QTabBar(parent) {
        ...
    }
...
}