How to properly manage text and icon with QToolButton?

Question

I have code snippet looks like this:

nextPageBtn = new QToolButton();
nextPageBtn->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Fixed);
nextPageBtn->setToolButtonStyle(Qt::ToolButtonTextBesideIcon);
nextPageBtn->setIcon(QIcon(":/next.png"));
nextPageBtn->setText("Next");

Currently I have two problems with this.

First:
I want the text is on the left of the icon, but with the code I provide, the text is on the right like this:

Second:
When the window is enlarged, I can not figure out a way to keep the text and icon in the center of the button. It looks like this when the button gets bigger:

Edit:
This is how I manage the layout:

nextPageHLayout = new QHBoxLayout; //This is the layout for QToolButton, it has two spacers and a QToolButton
mainVLayout->addLayout(nextPageHLayout); //mainVLayout is the main layout, and I put the mainVLayout to the central widget, and it also contains a QLabel above the nextPageHLayout

QSpacerItem *leftBtnSpacer = new QSpacerItem(1, 1, QSizePolicy::Expanding, QSizePolicy::Fixed);
nextPageHLayout->addSpacerItem(leftBtnSpacer);

nextPageBtn = new QToolButton(mainWidget);
nextPageHLayout->addWidget(nextPageBtn);
nextPageBtn->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Fixed);
nextPageBtn->setToolButtonStyle(Qt::ToolButtonTextBesideIcon);
nextPageBtn->setIcon(QIcon(":/next.png"));
nextPageBtn->setText("Next");

QSpacerItem *rightBtnSpacer = new QSpacerItem(1, 1, QSizePolicy::Expanding, QSizePolicy::Fixed);
nextPageHLayout->addSpacerItem(rightBtnSpacer);

Are you placing the QToolButton directly to QToolBar or where? — eyllanesc, Apr 14 '18 at 05:50
@eyllanesc I put the 'QToolButton' on a 'QHBoxLayout', and also put two spacers on both sides of the 'QToolButton' — Theodore Tang, Apr 14 '18 at 05:53
could put the layout code and the spacers, also where you put the layout. — eyllanesc, Apr 14 '18 at 05:55
@eyllanesc I edit my answer, maybe now you can see where the problem is. And I put all my layout to a central widget. — Theodore Tang, Apr 14 '18 at 06:01
@eyllanesc I tried your solution, and it solved my first problem. Just one more question, what if I still want the toolbutton expand with the window? With your solution, when expanding, the text just goes to the left and the icon goes to the right. Is it doable to let both text and icon align center when it is expanding? — Theodore Tang, Apr 14 '18 at 06:18
I have tried it and it works as observed in the images, maybe it is another one that is generating this problem, if you share your project I could help you, but if it is not impossible for me, have you copied my solution or just changed some things? — eyllanesc, Apr 14 '18 at 06:21
@eyllanesc I have tried your solution, and it works as your images shown. But I just kept the line that to change the size policy of the `QToolButton`, I want it to expand horizontally when the window goes bigger. So when it is expanding, the text is on the left and the icon is on the right of the button. But that is just a minor issue, I could just not set the size policy for the `QToolButton`. I was just wondering if that works to keep text and icon in center when setting size policy for the button. — Theodore Tang, Apr 14 '18 at 06:30
That is, you want it to expand but the text and the icon is centered. I am right? — eyllanesc, Apr 14 '18 at 06:32
Okay, I'm not sure if it works, but I have an idea, I'll try tomorrow, today it's too late where I live. — eyllanesc, Apr 14 '18 at 06:35
@eyllanesc ok, even though the site do not promote to say thanks, thanks anyway no matter if that works or not. — Theodore Tang, Apr 14 '18 at 06:38

score 4 · Accepted Answer · answered Apr 14 '18 at 06:09

You must make the following changes:

You should not change the size policy of the QToolButton, that's why it's expanding.
You must change the layoutDirection to Qt::RightToLeft.

QHBoxLayout * nextPageHLayout = new QHBoxLayout; //This is the layout for QToolButton, it has two spacers and a QToolButton
mainVLayout->addLayout(nextPageHLayout); //mainVLayout is the main layout, and it also contains a QLabel above the nextPageHLayout

QSpacerItem *leftBtnSpacer = new QSpacerItem(1, 1, QSizePolicy::Expanding, QSizePolicy::Minimum);
nextPageHLayout->addSpacerItem(leftBtnSpacer);

nextPageBtn = new QToolButton(mainWidget);
nextPageHLayout->addWidget(nextPageBtn);
nextPageBtn->setToolButtonStyle(Qt::ToolButtonTextBesideIcon);
nextPageBtn->setIcon(QIcon(":/next.png"));
nextPageBtn->setText("Next");
nextPageBtn->setLayoutDirection(Qt::RightToLeft);

QSpacerItem *rightBtnSpacer = new QSpacerItem(1, 1, QSizePolicy::Expanding, QSizePolicy::Minimum);
nextPageHLayout->addSpacerItem(rightBtnSpacer);

How to properly manage text and icon with QToolButton?

1 Answers1