Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. General and Desktop
  4. Changing QtabWidget tabbar color in paint event
Forum Updated to NodeBB v4.3 + New Features

Changing QtabWidget tabbar color in paint event

Scheduled Pinned Locked Moved Unsolved General and Desktop
qtabbarcolorspalettepainteventqtabwidget
11 Posts 5 Posters 1.9k Views 2 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • NarutoblazeN Narutoblaze

    I am trying to change the color of QTabBar via paintEvent according to documention and other solution on stackoverflow this works but in my case it is not working any help is greatly appreciated.

    my code :

    void myTab::paintEvent(QPaintEvent *event)
    {
        QStylePainter painter(this);
        QStyleOptionTab opt;
    
        for (int i = 0; i < count(); i++) {
            initStyleOption(&opt, i);
    
            opt.palette.setColor(QPalette::Window, Qt::red);
            opt.palette.setColor(QPalette::Button, Qt::red);
            painter.drawControl(QStyle::CE_TabBarTabShape, opt);
            painter.drawControl(QStyle::CE_TabBarTabLabel, opt);
        }
    }
    
    JonBJ Offline
    JonBJ Offline
    JonB
    wrote on last edited by
    #2

    @Narutoblaze
    What does "not working" mean? E.g. what do you see/not see?
    What stackoverflow post? How does your situation differ from it?
    You don't have some stylesheet which already sets the color of the QTabBar do you?

    NarutoblazeN 1 Reply Last reply
    1
    • C Offline
      C Offline
      CPPUIX
      wrote on last edited by
      #3

      Hi,

      Put a qDebug in your paintEvent, to see if it even gets called.

      If it doesn't and the changes you applied are not visible (no red background), it's possible you did not set your custom Tab bar to your tab widget using QTabWidget::setTabBar.

      For reference: dynamically style an individual tab in QTabWidget.

      NarutoblazeN 1 Reply Last reply
      0
      • NarutoblazeN Offline
        NarutoblazeN Offline
        Narutoblaze
        wrote on last edited by Narutoblaze
        #4

        @JonB The reference @Abderrahmene_Rayene given is actually the same thing i am trying to do and my code almost 99% same as that and yes i have set the tabbar but the tabbar is same as default it is not red My qt version 6.5.0

        1 Reply Last reply
        0
        • C CPPUIX

          Hi,

          Put a qDebug in your paintEvent, to see if it even gets called.

          If it doesn't and the changes you applied are not visible (no red background), it's possible you did not set your custom Tab bar to your tab widget using QTabWidget::setTabBar.

          For reference: dynamically style an individual tab in QTabWidget.

          NarutoblazeN Offline
          NarutoblazeN Offline
          Narutoblaze
          wrote on last edited by
          #5

          @Abderrahmene_Rayene yes it does get called

          1 Reply Last reply
          0
          • JonBJ JonB

            @Narutoblaze
            What does "not working" mean? E.g. what do you see/not see?
            What stackoverflow post? How does your situation differ from it?
            You don't have some stylesheet which already sets the color of the QTabBar do you?

            NarutoblazeN Offline
            NarutoblazeN Offline
            Narutoblaze
            wrote on last edited by
            #6

            @JonB no i have not set any stylesheet.

            JoeCFDJ 1 Reply Last reply
            0
            • C Offline
              C Offline
              CPPUIX
              wrote on last edited by
              #7

              The only code you're sharing is the painEvent, and it has no problems, it works if used correctly.

              Share the code of both of your QTabBar and QTabWidget, how you're using both of them, and how and when are you setting the custom QTabBar.

              A minimal reproducible example would answer all of these question.

              Here's one:

              #include <QApplication>
              #include <QTabBar>
              #include <QTabWidget>
              #include <QStylePainter>
              #include <QStyleOptionTab>
              
              class myTab : public QTabBar
              {
              public:
                  myTab (QWidget *parent = nullptr)
                  {
                      //I'm using this to check later if this is the tab bar being used
                      setObjectName("myTabBar");
                  }
              
                  void paintEvent(QPaintEvent *event)
                  {
                      QStylePainter painter(this);
                      QStyleOptionTab opt;
              
                      for (int i = 0; i < count(); i++)
                      {
                          initStyleOption(&opt, i);
              
                          opt.palette.setColor(QPalette::Window, Qt::red);
                          opt.palette.setColor(QPalette::Button, Qt::red);
                          painter.drawControl(QStyle::CE_TabBarTabShape, opt);
                          painter.drawControl(QStyle::CE_TabBarTabLabel, opt);
                      }
                      qDebug()<<"window color role color:"<<opt.palette.color(QPalette::Window);
                      qDebug()<<"button color role color:"<<opt.palette.color(QPalette::Button);
                  }
              };
              
              class myTabWidget : public QTabWidget
              {
                  myTab *mt;
              public:
                  myTabWidget (QWidget *parent = nullptr)
                  {
                      mt = new myTab(this);
                      setTabBar(mt);
                  }
              };
              
              int main(int argc,char*argv[])
              {
                  QApplication a(argc, argv);
              
                  myTabWidget *mtw = new myTabWidget();
                  //This is where I check if the right tab bar is being used by verifyinng the object name
                  qDebug()<<mtw->tabBar();
              
                  mtw->tabBar()->addTab("tab1");
                  mtw->tabBar()->addTab("tab2");
                  mtw->tabBar()->addTab("tab3");
              
                  mtw->show();
              
                  return a.exec();
              }
              

              Here's the output:

              QTabBar(0x556a0ace5a20, name="myTabBar")
              window color role color: QColor(ARGB 1, 1, 0, 0)
              button color role color: QColor(ARGB 1, 1, 0, 0)
              window color role color: QColor(ARGB 1, 1, 0, 0)
              

              Here's how it looks:

              redtabbar.png

              If you're not missing any of these details, I would suggest using this example and gradually adding your code to it, until it doesn't work, to identify what's reversing your custom painting.

              Hope this helps!

              NarutoblazeN 1 Reply Last reply
              1
              • NarutoblazeN Narutoblaze

                @JonB no i have not set any stylesheet.

                JoeCFDJ Offline
                JoeCFDJ Offline
                JoeCFD
                wrote on last edited by
                #8

                @Narutoblaze
                is it simpler to set stylesheet?
                https://stackoverflow.com/questions/43349684/how-to-customize-tab-header-for-qtabbar-with-a-custom-witdh-max-qt-style-sheet

                1 Reply Last reply
                0
                • C CPPUIX

                  The only code you're sharing is the painEvent, and it has no problems, it works if used correctly.

                  Share the code of both of your QTabBar and QTabWidget, how you're using both of them, and how and when are you setting the custom QTabBar.

                  A minimal reproducible example would answer all of these question.

                  Here's one:

                  #include <QApplication>
                  #include <QTabBar>
                  #include <QTabWidget>
                  #include <QStylePainter>
                  #include <QStyleOptionTab>
                  
                  class myTab : public QTabBar
                  {
                  public:
                      myTab (QWidget *parent = nullptr)
                      {
                          //I'm using this to check later if this is the tab bar being used
                          setObjectName("myTabBar");
                      }
                  
                      void paintEvent(QPaintEvent *event)
                      {
                          QStylePainter painter(this);
                          QStyleOptionTab opt;
                  
                          for (int i = 0; i < count(); i++)
                          {
                              initStyleOption(&opt, i);
                  
                              opt.palette.setColor(QPalette::Window, Qt::red);
                              opt.palette.setColor(QPalette::Button, Qt::red);
                              painter.drawControl(QStyle::CE_TabBarTabShape, opt);
                              painter.drawControl(QStyle::CE_TabBarTabLabel, opt);
                          }
                          qDebug()<<"window color role color:"<<opt.palette.color(QPalette::Window);
                          qDebug()<<"button color role color:"<<opt.palette.color(QPalette::Button);
                      }
                  };
                  
                  class myTabWidget : public QTabWidget
                  {
                      myTab *mt;
                  public:
                      myTabWidget (QWidget *parent = nullptr)
                      {
                          mt = new myTab(this);
                          setTabBar(mt);
                      }
                  };
                  
                  int main(int argc,char*argv[])
                  {
                      QApplication a(argc, argv);
                  
                      myTabWidget *mtw = new myTabWidget();
                      //This is where I check if the right tab bar is being used by verifyinng the object name
                      qDebug()<<mtw->tabBar();
                  
                      mtw->tabBar()->addTab("tab1");
                      mtw->tabBar()->addTab("tab2");
                      mtw->tabBar()->addTab("tab3");
                  
                      mtw->show();
                  
                      return a.exec();
                  }
                  

                  Here's the output:

                  QTabBar(0x556a0ace5a20, name="myTabBar")
                  window color role color: QColor(ARGB 1, 1, 0, 0)
                  button color role color: QColor(ARGB 1, 1, 0, 0)
                  window color role color: QColor(ARGB 1, 1, 0, 0)
                  

                  Here's how it looks:

                  redtabbar.png

                  If you're not missing any of these details, I would suggest using this example and gradually adding your code to it, until it doesn't work, to identify what's reversing your custom painting.

                  Hope this helps!

                  NarutoblazeN Offline
                  NarutoblazeN Offline
                  Narutoblaze
                  wrote on last edited by
                  #9

                  @Abderrahmene_Rayene I have ran your code as it is but did not work there was no change from default QtabWidget but after adding a.setStyle("fusion") it worked as you have shown but i don't want to change other parts like the background became black and foreground white also why did it required a.setStyle("fusion") ??

                  My spec :
                  Windows 10
                  Qt 6.5.0

                  Running your code it shows color was applied but no changes happened :

                  window color role color: QColor(ARGB 1, 0.117647, 0.117647, 0.117647)
                  button color role color: QColor(ARGB 1, 1, 0, 0)
                  

                  Worked after Adding setStyle :

                  int main(int argc, char *argv[])
                  {
                      QApplication a(argc,argv);
                    
                      // Added this line
                      a.setStyle("fusion");
                  }
                  
                  C 1 Reply Last reply
                  0
                  • NarutoblazeN Narutoblaze

                    @Abderrahmene_Rayene I have ran your code as it is but did not work there was no change from default QtabWidget but after adding a.setStyle("fusion") it worked as you have shown but i don't want to change other parts like the background became black and foreground white also why did it required a.setStyle("fusion") ??

                    My spec :
                    Windows 10
                    Qt 6.5.0

                    Running your code it shows color was applied but no changes happened :

                    window color role color: QColor(ARGB 1, 0.117647, 0.117647, 0.117647)
                    button color role color: QColor(ARGB 1, 1, 0, 0)
                    

                    Worked after Adding setStyle :

                    int main(int argc, char *argv[])
                    {
                        QApplication a(argc,argv);
                      
                        // Added this line
                        a.setStyle("fusion");
                    }
                    
                    C Offline
                    C Offline
                    CPPUIX
                    wrote on last edited by
                    #10

                    @Narutoblaze That's a good discovery!

                    Unfortunately that goes beyond the scope of my knowledge, and I'm using a Linux.

                    I did however set Windows style on my QApplication and got a slightly different result: bright red for the tabs as they became flat instead of raised in Fusion style.

                    Here's how it looks:

                    windowsonapplication.png

                    I'm not sure I can test and get the same result as you do, you'd need the insight of a Windows user for more accuracy.

                    But I could suggest setting Fusion style (or another style if available and works) to your tab bar only in its ctor like this:

                    myTab (QWidget *parent = nullptr)
                        {
                            setStyle(QStyleFactory::create("Fusion"));
                        }
                    

                    Just to compare, I set Windows style on my tab bar only and here's how it looks:

                    windowsontabbar.png

                    SGaistS 1 Reply Last reply
                    0
                    • C CPPUIX

                      @Narutoblaze That's a good discovery!

                      Unfortunately that goes beyond the scope of my knowledge, and I'm using a Linux.

                      I did however set Windows style on my QApplication and got a slightly different result: bright red for the tabs as they became flat instead of raised in Fusion style.

                      Here's how it looks:

                      windowsonapplication.png

                      I'm not sure I can test and get the same result as you do, you'd need the insight of a Windows user for more accuracy.

                      But I could suggest setting Fusion style (or another style if available and works) to your tab bar only in its ctor like this:

                      myTab (QWidget *parent = nullptr)
                          {
                              setStyle(QStyleFactory::create("Fusion"));
                          }
                      

                      Just to compare, I set Windows style on my tab bar only and here's how it looks:

                      windowsontabbar.png

                      SGaistS Offline
                      SGaistS Offline
                      SGaist
                      Lifetime Qt Champion
                      wrote on last edited by
                      #11

                      Hi,

                      System styles such as those from Windows and macOS ignore certain hints and draw controls as expected for these platforms. Qt follows the platform user interface guidelines closely to ensure that applications looks as expected.

                      Interested in AI ? www.idiap.ch
                      Please read the Qt Code of Conduct - https://forum.qt.io/topic/113070/qt-code-of-conduct

                      1 Reply Last reply
                      1

                      • Login

                      • Login or register to search.
                      • First post
                        Last post
                      0
                      • Categories
                      • Recent
                      • Tags
                      • Popular
                      • Users
                      • Groups
                      • Search
                      • Get Qt Extensions
                      • Unsolved