Important: Please read the Qt Code of Conduct -

How can I style a QToolBar extension button icon via CSS

  • When a toolbar is resized in such a way that it is too small to show all the items it contains, an extension button will appear as the last item in the toolbar. Pressing the extension button will pop up a menu containing the items that does not currently fit in the toolbar.

    The extension button shows a small icon of 2 black arrows (looks like >>). I styled my whole application with a drak black style and light grey font colors. The two black arrows of the extension button icon are very bad visible on top of the dark grey background (see the picture below) and I would like to use light grey arrows instead.

    ! toolbar_extension_button.gif)!

    In the Qt docs I did not found any hint how to style the extension button icon and so I searched the Qt sources. I found the following solution that works partly.

    qproperty-icon: url(:/styleimg/toolbar_extension_icon.png);

    This gives the extension button a new icon. But as soon as I undock the toolbar and redock it again, the extension button has the old icon again with the two black arrows. One possible solution would be, to reapply the stylesheet as soon as the toolbar is docked again. But this is not a nice solution. Is there any other way to style the extension button, or at least the color of the extension button arrows?

  • hi,

    while launching the qt application, you can feed it a style sheet (with all controls styled) and this would be inherited all across the application. This way you need to do it only once and then I don't think you would come across this issue. Have you tried this? In spite of this, if the style is lost, then its a bug in Qt

  • Hi,

    I already use a global stylesheet for my whole application. The problem is, that there is no subcontrol identifier (like QCheckBox::indicator) to style the icon of the toolbar extension button. Therefore i searched the Qt sources and found the name of the extension button: qt_toolbar_ext_button . Then I used the icon property of the extension button to set a new icon via application stylesheet. The problem is, that the stylesheet is applied only once at application startup. As soon as I undock or redock the toolbar, it overwrites my stylesheet icon with its own icon. That means I would need to reload the styelesheet for the toolbar everytime I dock and undock the toolbar. This is not a satisfying solution.

  • yes i wrote a small test prog and was able to replicate your problem. the actual behavior I noticed is as follows:
    when you undock if you ensure that the toolbar remains horizontal always, you still get back the custom icon, if the toolbar becomes vertical and then you try to dock it and resize, the custom icon is lost and the default is back. to check further ...

    seems a bug to me, you should log this bug.

Log in to reply