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. Setting a QSS style on all QToolButtons in an application except the ones inside a QToolBar
Forum Updated to NodeBB v4.3 + New Features

Setting a QSS style on all QToolButtons in an application except the ones inside a QToolBar

Scheduled Pinned Locked Moved Solved General and Desktop
14 Posts 5 Posters 1.6k 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.
  • S Offline
    S Offline
    SajasKK
    wrote on last edited by
    #1

    The application I am working on uses QToolButtons as simple elements in a layout and as QActions added to QToolBars. I would like to apply a style on all the QToolButtons in my application except the ones within a QToolBar. I saw that I can set a style on all QToolButtons with the entry:

    QToolButton{ background-color: rgb(255, 0, 0); }
    

    And I can apply a style for all the QToolButtons inside a QToolBar using:

    QToolBar > QToolButton { background-color: rgb(0, 255, 0); }
    

    But how can I perform the required styling without adding a style entry for the buttons in QToolBar, so that they would still have the default styling?

    JonBJ 1 Reply Last reply
    1
    • S SajasKK

      The application I am working on uses QToolButtons as simple elements in a layout and as QActions added to QToolBars. I would like to apply a style on all the QToolButtons in my application except the ones within a QToolBar. I saw that I can set a style on all QToolButtons with the entry:

      QToolButton{ background-color: rgb(255, 0, 0); }
      

      And I can apply a style for all the QToolButtons inside a QToolBar using:

      QToolBar > QToolButton { background-color: rgb(0, 255, 0); }
      

      But how can I perform the required styling without adding a style entry for the buttons in QToolBar, so that they would still have the default styling?

      JonBJ Offline
      JonBJ Offline
      JonB
      wrote on last edited by JonB
      #2

      @SajasKK
      This is a good question! I answered a similar-ish question yesterday, there we were able to solve it effectively without have to put a general rule on QToolButton items, but that won't work for your case.

      Unless one of

      QToolBar > QToolButton { background-color: default; }
      QToolBar > QToolButton { background-color: auto; }
      

      works to "cancel" the general QToolButton rule --- and I don't see that they will/are accepted by Qt CSS --- I can see the problem and have thought about it before. Consequently I shall be interested to see what reply you get...! :)

      P.S.
      It looks like I asked something similar when I first joined in 2017: https://forum.qt.io/topic/85184/undoing-an-added-setstylesheet-property. And I don't think I got an answer there which did the right thing! Somebody there suggested one of

      background-color: initial;
      background-color: unset;
      

      You could also try those, I think I found they did not work....

      I also see MDN CSS says you can use background-color: revert;, you could try that one too in Qt, but don't hold your breath... ;-)

      S 1 Reply Last reply
      0
      • JonBJ JonB

        @SajasKK
        This is a good question! I answered a similar-ish question yesterday, there we were able to solve it effectively without have to put a general rule on QToolButton items, but that won't work for your case.

        Unless one of

        QToolBar > QToolButton { background-color: default; }
        QToolBar > QToolButton { background-color: auto; }
        

        works to "cancel" the general QToolButton rule --- and I don't see that they will/are accepted by Qt CSS --- I can see the problem and have thought about it before. Consequently I shall be interested to see what reply you get...! :)

        P.S.
        It looks like I asked something similar when I first joined in 2017: https://forum.qt.io/topic/85184/undoing-an-added-setstylesheet-property. And I don't think I got an answer there which did the right thing! Somebody there suggested one of

        background-color: initial;
        background-color: unset;
        

        You could also try those, I think I found they did not work....

        I also see MDN CSS says you can use background-color: revert;, you could try that one too in Qt, but don't hold your breath... ;-)

        S Offline
        S Offline
        SajasKK
        wrote on last edited by
        #3

        @JonB Thank you. Setting the style to auto seems to set the right default style for the button in QToolBar.
        I was setting certain border and background-color for my QToolButtons. But setting the style to "auto" for the QToolButtons in QToolBar keeps the style there unchanged.

        QToolButton:enabled:focus{ border: 2px solid palette( highlight ); }
        QToolButton:enabled:checked{ background-color: palette( dark ); }
        QToolBar > QToolButton { border: auto; background-color: auto }
        
        JonBJ 1 Reply Last reply
        1
        • S SajasKK

          @JonB Thank you. Setting the style to auto seems to set the right default style for the button in QToolBar.
          I was setting certain border and background-color for my QToolButtons. But setting the style to "auto" for the QToolButtons in QToolBar keeps the style there unchanged.

          QToolButton:enabled:focus{ border: 2px solid palette( highlight ); }
          QToolButton:enabled:checked{ background-color: palette( dark ); }
          QToolBar > QToolButton { border: auto; background-color: auto }
          
          JonBJ Offline
          JonBJ Offline
          JonB
          wrote on last edited by
          #4

          @SajasKK
          Interesting. You are saying auto will "revert" a rule back to the default?

          The code now is different because you introduce :enabled stuff. I should be obliged to know if you go back to your original that you are saying just:

          QToolButton{ background-color: rgb(255, 0, 0); }
          
          QToolBar > QToolButton { background-color: auto; }
          

          does what we hope?

          S 1 Reply Last reply
          0
          • JonBJ JonB

            @SajasKK
            Interesting. You are saying auto will "revert" a rule back to the default?

            The code now is different because you introduce :enabled stuff. I should be obliged to know if you go back to your original that you are saying just:

            QToolButton{ background-color: rgb(255, 0, 0); }
            
            QToolBar > QToolButton { background-color: auto; }
            

            does what we hope?

            S Offline
            S Offline
            SajasKK
            wrote on last edited by
            #5

            @JonB Yes. "auto" also resets the background color to the default one for the buttons inside QToolBar for the code above. Just test it.
            I had used the simple background-color case as an example for my case. But what I really wanted to fix was the border color around the QToolButton(when in focus) and the background-color when the button is checked. By setting "auto" value for these properties, it seems to keep the buttons inside QToolBar unchanged.

            JonBJ 1 Reply Last reply
            1
            • S SajasKK has marked this topic as solved on
            • S SajasKK

              @JonB Yes. "auto" also resets the background color to the default one for the buttons inside QToolBar for the code above. Just test it.
              I had used the simple background-color case as an example for my case. But what I really wanted to fix was the border color around the QToolButton(when in focus) and the background-color when the button is checked. By setting "auto" value for these properties, it seems to keep the buttons inside QToolBar unchanged.

              JonBJ Offline
              JonBJ Offline
              JonB
              wrote on last edited by
              #6

              @SajasKK
              Thank you for confirming. Now that your question is solved, forgive me if I hijack this thread :)

              @Axel-Spoerl , or any other expert:
              The gist of this thread is that if, for whatever reason, a widget has an inherited CSS/QSS rule and wishes to cancel it on certain elements which would match, it appears that auto can be used to achieve that --- revert to whatever the default was originally before the rule was added.

              This is a very useful feature! I have wanted it in the past. I searched the Qt documentation (and the web) but it does not seem to be mentioned anywhere? https://doc.qt.io/qt-6/stylesheet-syntax.html would be where I would expect, possibly in the Inheritance sub-section. Can you find the mention of auto anywhere? Do you think this should be raised for addition into the documentation?

              Axel SpoerlA 1 Reply Last reply
              3
              • JonBJ JonB

                @SajasKK
                Thank you for confirming. Now that your question is solved, forgive me if I hijack this thread :)

                @Axel-Spoerl , or any other expert:
                The gist of this thread is that if, for whatever reason, a widget has an inherited CSS/QSS rule and wishes to cancel it on certain elements which would match, it appears that auto can be used to achieve that --- revert to whatever the default was originally before the rule was added.

                This is a very useful feature! I have wanted it in the past. I searched the Qt documentation (and the web) but it does not seem to be mentioned anywhere? https://doc.qt.io/qt-6/stylesheet-syntax.html would be where I would expect, possibly in the Inheritance sub-section. Can you find the mention of auto anywhere? Do you think this should be raised for addition into the documentation?

                Axel SpoerlA Offline
                Axel SpoerlA Offline
                Axel Spoerl
                Moderators
                wrote on last edited by
                #7

                @JonB
                Absolutely right. Thanks, I shall raise that issue.

                Software Engineer
                The Qt Company, Oslo

                Axel SpoerlA 1 Reply Last reply
                3
                • Axel SpoerlA Axel Spoerl

                  @JonB
                  Absolutely right. Thanks, I shall raise that issue.

                  Axel SpoerlA Offline
                  Axel SpoerlA Offline
                  Axel Spoerl
                  Moderators
                  wrote on last edited by
                  #8

                  @JonB
                  I have not forgotten this issue.
                  However, using autoin a style sheet to fall back to the default palette of a widget, seems to be a fortunate side effect. For the records, I don't find any reference to unset, default, revert, initial.
                  The autokeyword translates into the enum value Value_Auto, which is used to automatically determine html page breaks. I haven't started debugging it to the bottom. But from what I get by reading parseColorValue(), the usage of autowill make the method return an invalid instance of ColorData. That means nothing but "we failed to parse a meaningful color". That, as a consequence, triggers a graceful fallback to the widget's original palette.
                  While I keep my fingers crossed, I trust you understand that I'd rather not document that side effect.

                  A generic way to override a brush inherited by a style sheet, is to keep a copy of the widget's original palette handy, before setting style sheets. You can either remove the stylesheet from the widget and set the desired palette, e.g.

                  widget->setStyleSheet(QString());
                  widget->setPalette(originalPalette);
                  

                  Or you can use a specific brush/color of that palette to create a CSS string and assign the desired color.

                  Software Engineer
                  The Qt Company, Oslo

                  JonBJ 1 Reply Last reply
                  1
                  • Axel SpoerlA Axel Spoerl

                    @JonB
                    I have not forgotten this issue.
                    However, using autoin a style sheet to fall back to the default palette of a widget, seems to be a fortunate side effect. For the records, I don't find any reference to unset, default, revert, initial.
                    The autokeyword translates into the enum value Value_Auto, which is used to automatically determine html page breaks. I haven't started debugging it to the bottom. But from what I get by reading parseColorValue(), the usage of autowill make the method return an invalid instance of ColorData. That means nothing but "we failed to parse a meaningful color". That, as a consequence, triggers a graceful fallback to the widget's original palette.
                    While I keep my fingers crossed, I trust you understand that I'd rather not document that side effect.

                    A generic way to override a brush inherited by a style sheet, is to keep a copy of the widget's original palette handy, before setting style sheets. You can either remove the stylesheet from the widget and set the desired palette, e.g.

                    widget->setStyleSheet(QString());
                    widget->setPalette(originalPalette);
                    

                    Or you can use a specific brush/color of that palette to create a CSS string and assign the desired color.

                    JonBJ Offline
                    JonBJ Offline
                    JonB
                    wrote on last edited by
                    #9

                    @Axel-Spoerl
                    I will keep this brief :) I don't want to/don't have the "original palette" handy, and I don't want to write any code anyway, just CSS. And I cannot generically/safely use widget->setStyleSheet(QString()); as I have no idea whether the widget may have its own explicit stylesheet for other things which this would cancel. And Qt/setStyleSheet() does not offer any easy way to access/cancel/merge just, say background-color in a stylesheet without messing up any existing stuff.

                    I just want to be able to do something like the following in a stylesheet on the window/application:

                    Parent { background-color: ...; }
                    
                    Child /* or Parent > Child */ { background-color: auto; }
                    

                    Anyway, this was just a question about documentation. I leave it to you/others.

                    Axel SpoerlA S 2 Replies Last reply
                    0
                    • JonBJ JonB

                      @Axel-Spoerl
                      I will keep this brief :) I don't want to/don't have the "original palette" handy, and I don't want to write any code anyway, just CSS. And I cannot generically/safely use widget->setStyleSheet(QString()); as I have no idea whether the widget may have its own explicit stylesheet for other things which this would cancel. And Qt/setStyleSheet() does not offer any easy way to access/cancel/merge just, say background-color in a stylesheet without messing up any existing stuff.

                      I just want to be able to do something like the following in a stylesheet on the window/application:

                      Parent { background-color: ...; }
                      
                      Child /* or Parent > Child */ { background-color: auto; }
                      

                      Anyway, this was just a question about documentation. I leave it to you/others.

                      Axel SpoerlA Offline
                      Axel SpoerlA Offline
                      Axel Spoerl
                      Moderators
                      wrote on last edited by
                      #10

                      @JonB
                      Fully understand the requirement, which autofulfills by coincidence.
                      I think that an "unset" functionality should be implemented (and documented) at some point, which really unsets one specific CSS element and make it fall back to the default.

                      Software Engineer
                      The Qt Company, Oslo

                      1 Reply Last reply
                      0
                      • JonBJ JonB

                        @Axel-Spoerl
                        I will keep this brief :) I don't want to/don't have the "original palette" handy, and I don't want to write any code anyway, just CSS. And I cannot generically/safely use widget->setStyleSheet(QString()); as I have no idea whether the widget may have its own explicit stylesheet for other things which this would cancel. And Qt/setStyleSheet() does not offer any easy way to access/cancel/merge just, say background-color in a stylesheet without messing up any existing stuff.

                        I just want to be able to do something like the following in a stylesheet on the window/application:

                        Parent { background-color: ...; }
                        
                        Child /* or Parent > Child */ { background-color: auto; }
                        

                        Anyway, this was just a question about documentation. I leave it to you/others.

                        S Offline
                        S Offline
                        SimonSchroeder
                        wrote on last edited by
                        #11

                        @JonB said in Setting a QSS style on all QToolButtons in an application except the ones inside a QToolBar:

                        And Qt/setStyleSheet() does not offer any easy way to access/cancel/merge just, say background-color in a stylesheet without messing up any existing stuff.

                        Slightly off topic: I hate it when setting the background-color messes with the size of a button. Without a stylesheet "OK" and "Cancel" for a dialog have the same width, but with the stylesheet (IIRC setting the color is sufficient), suddenly the "OK" button shrinks...

                        Christian EhrlicherC Axel SpoerlA 2 Replies Last reply
                        0
                        • S SimonSchroeder

                          @JonB said in Setting a QSS style on all QToolButtons in an application except the ones inside a QToolBar:

                          And Qt/setStyleSheet() does not offer any easy way to access/cancel/merge just, say background-color in a stylesheet without messing up any existing stuff.

                          Slightly off topic: I hate it when setting the background-color messes with the size of a button. Without a stylesheet "OK" and "Cancel" for a dialog have the same width, but with the stylesheet (IIRC setting the color is sufficient), suddenly the "OK" button shrinks...

                          Christian EhrlicherC Offline
                          Christian EhrlicherC Offline
                          Christian Ehrlicher
                          Lifetime Qt Champion
                          wrote on last edited by
                          #12

                          @SimonSchroeder that's strange since the size constraint should come from the base style. Maybe create a bug report and notify me so I can take a look after holidays

                          Qt Online Installer direct download: https://download.qt.io/official_releases/online_installers/
                          Visit the Qt Academy at https://academy.qt.io/catalog

                          1 Reply Last reply
                          0
                          • S SimonSchroeder

                            @JonB said in Setting a QSS style on all QToolButtons in an application except the ones inside a QToolBar:

                            And Qt/setStyleSheet() does not offer any easy way to access/cancel/merge just, say background-color in a stylesheet without messing up any existing stuff.

                            Slightly off topic: I hate it when setting the background-color messes with the size of a button. Without a stylesheet "OK" and "Cancel" for a dialog have the same width, but with the stylesheet (IIRC setting the color is sufficient), suddenly the "OK" button shrinks...

                            Axel SpoerlA Offline
                            Axel SpoerlA Offline
                            Axel Spoerl
                            Moderators
                            wrote on last edited by Axel Spoerl
                            #13

                            @SimonSchroeder
                            (I have to be diplomatic now, otherwise a can feel a bug report coming my way)
                            QStyleSheetStyledoesn't always get the love it deserves. The poor thing has to swallow, whatever setStyleSheet() shovels on its plate. It has no public getters, to convey its feelings to the outside world. That's why it's sometimes moody and stubborn.
                            If your OK button gets too small, maybe try another, more positive color.
                            If there's nothing else to cheer you up, you may file a bug report. And if you really have no other idea whom to assign it to, I'll make an exception just for you ;-)

                            Software Engineer
                            The Qt Company, Oslo

                            S 1 Reply Last reply
                            0
                            • Axel SpoerlA Axel Spoerl

                              @SimonSchroeder
                              (I have to be diplomatic now, otherwise a can feel a bug report coming my way)
                              QStyleSheetStyledoesn't always get the love it deserves. The poor thing has to swallow, whatever setStyleSheet() shovels on its plate. It has no public getters, to convey its feelings to the outside world. That's why it's sometimes moody and stubborn.
                              If your OK button gets too small, maybe try another, more positive color.
                              If there's nothing else to cheer you up, you may file a bug report. And if you really have no other idea whom to assign it to, I'll make an exception just for you ;-)

                              S Offline
                              S Offline
                              SimonSchroeder
                              wrote on last edited by
                              #14

                              @Axel-Spoerl said in Setting a QSS style on all QToolButtons in an application except the ones inside a QToolBar:

                              maybe try another, more positive color.

                              Well, you might be right. The trouble started when we tried to introduce a dark theme... ;-)

                              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