How can I make the right margin in QToolButton for the indicator?

Question

I have QToolButton with left icon and right indicator (MenuButtonPopup mode). How do I change this distance by qss? Attention to the picture

tool button:

Answer 1

Let's suppose you setup your QToolButton like this:

QToolButton* button {new QToolButton()};
button->setText("Button");
button->setToolButtonStyle(Qt::ToolButtonTextOnly);
button->setPopupMode(QToolButton::MenuButtonPopup);
QMenu* menu = new QMenu("Test menu", button);
menu->addAction("Test action");
button->setMenu(menu);

When in MenuButtonPopup mode, the "arrow" used to open the menu for this QToolButton is a subcontrol (think of it as a button inside a button). You can control its position within the control like this:

button->setStyleSheet(
    "QToolButton { "
    "    padding-left: 5px;"
    "    padding-right: 60px;"
    "    border: 1px solid grey;"
    "}"
    ""
    "QToolButton::menu-button {"
    "    border: 2px solid red;"
    "    width: 36px;"
    "    right: 20px;"
    "    subcontrol-position: right center;"
    "    image: url(:/icons/down.png);"
    "}"
);

This assumes you have setup the "/icons/down.png" image file inside a resource file.

I have made the border of the subcontrol red to make it easier to see where the subcontrol is being drawn.

Of course, you could load the style sheet from a file instead of inlining it as in the example.

Note that because you are replacing the widget's default style, you will need to specify the rest of the style as per your needs. Be aware that, for some reason, if you completely remove the borders for either the QToolButton widget itself or its subcontrol, the styling will go wrong.