Space Buttons equally in Layout, but with an empty slot
-
I'm trying to create a panel of buttons that will have 4 buttons, a space, and another button, all of equal space, like this:
I have tried to use Spacers, but it seems like those require a specific height and weight, and I would like this layout to be dynamic enough to appear correctly on any resolution, so a fixed size Spacer would not work.
I have tried to following code, but this just squishes the first 4 buttons to the top and the last one to the bottom, and doesn't space them out evenly.
QVBoxLayout *layout = new QVBoxLayout; layout->setMargin(15); layout->setSpacing(15); layout->addWidget(button1, 1); layout->addWidget(button2, 1); layout->addWidget(button3, 1); layout->addWidget(button4, 1); layout->addWidget(button5, 2, Qt::AlignBottom); layout->addStretch(); buttonPnl->setLayout(layout);
I also tried using a QGridLayout and specifying the height of each row, but this looks the same as the previous example.
QGridLayout *gridLayout = new QGridLayout; gridLayout->setMargin(15); gridLayout->setSpacing(15); gridLayout->addWidget(button1, 0, 0); gridLayout->addWidget(button2, 1, 0); gridLayout->addWidget(button3, 2, 0); gridLayout->addWidget(button4, 3, 0); gridLayout->addWidget(button5, 5, 0); gridLayout->setRowStretch(0, 1); gridLayout->setRowStretch(1, 1); gridLayout->setRowStretch(2, 1); gridLayout->setRowStretch(3, 1); gridLayout->setRowStretch(4, 1); gridLayout->setRowStretch(5, 1);
How can I create a dynamic layout that will display my buttons correctly at any reasonable resolution?
-
I'm trying to create a panel of buttons that will have 4 buttons, a space, and another button, all of equal space, like this:
I have tried to use Spacers, but it seems like those require a specific height and weight, and I would like this layout to be dynamic enough to appear correctly on any resolution, so a fixed size Spacer would not work.
I have tried to following code, but this just squishes the first 4 buttons to the top and the last one to the bottom, and doesn't space them out evenly.
QVBoxLayout *layout = new QVBoxLayout; layout->setMargin(15); layout->setSpacing(15); layout->addWidget(button1, 1); layout->addWidget(button2, 1); layout->addWidget(button3, 1); layout->addWidget(button4, 1); layout->addWidget(button5, 2, Qt::AlignBottom); layout->addStretch(); buttonPnl->setLayout(layout);
I also tried using a QGridLayout and specifying the height of each row, but this looks the same as the previous example.
QGridLayout *gridLayout = new QGridLayout; gridLayout->setMargin(15); gridLayout->setSpacing(15); gridLayout->addWidget(button1, 0, 0); gridLayout->addWidget(button2, 1, 0); gridLayout->addWidget(button3, 2, 0); gridLayout->addWidget(button4, 3, 0); gridLayout->addWidget(button5, 5, 0); gridLayout->setRowStretch(0, 1); gridLayout->setRowStretch(1, 1); gridLayout->setRowStretch(2, 1); gridLayout->setRowStretch(3, 1); gridLayout->setRowStretch(4, 1); gridLayout->setRowStretch(5, 1);
How can I create a dynamic layout that will display my buttons correctly at any reasonable resolution?
-
@Smeeth
Someone will doubtless have a better answer than I, but aren't you going to have to measure the height of one of those buttons and use that for a vertical spacer? And BTW, I presume you assume all buttons will be single-line height. -
@JonB Yes that would do it, but how can I know the height of the button before the layout is fully constructed? A call to button1->height() gives me 480 in this code segment, which is certainly not the final height for the button.
@Smeeth I figured there would be a simpler way than doing the math myself and settings the height of each button explicitly. Usually I am able to use layouts and alignments to avoid doing this, so I imagine there must be a way to space this properly with layouts.
-
@Smeeth I figured there would be a simpler way than doing the math myself and settings the height of each button explicitly. Usually I am able to use layouts and alignments to avoid doing this, so I imagine there must be a way to space this properly with layouts.
@Smeeth
I see the problem as: how should Qt layout manager know that what you want there as "missing" is specifically anotherQPushbutton
with its height, as opposed to any old random widget? Which makes me think: you've either got to know the height, or put a push button there and then remove/hide it without Qt adjusting to close up space, or you've got to have some kind of grid layout with rows being the fixed height of the tallest row content, or similar.At which point I'll shut up and leave to someone who actually knows...
-
@Smeeth
I see the problem as: how should Qt layout manager know that what you want there as "missing" is specifically anotherQPushbutton
with its height, as opposed to any old random widget? Which makes me think: you've either got to know the height, or put a push button there and then remove/hide it without Qt adjusting to close up space, or you've got to have some kind of grid layout with rows being the fixed height of the tallest row content, or similar.At which point I'll shut up and leave to someone who actually knows...
@JonB I was looking for a solution like your second scenario, and that is where I thought a QGridLayout would come in handy, but it seems either it does not have that functionality, or (more likely) I am not using it correctly.
Perhaps you are correct that I should add another button and hide it without removing.
-
Hi
Why not add a QWidget as empty space ? its completely invisible. -
@mrjj
I don‘t know why the op says a Qqspacer didn‘t work.
This is exactly why they exist.A Qwidget will do it, as you‘ve shown, but a spacer will too, with much less overhang ☺️
-
Hi
well spacer could do the same but requires more fiddling as its greedy and compresses the
the ends so dont work the same "out of the box" but im sure it can be adjusted to do the same.
-
Hi
well spacer could do the same but requires more fiddling as its greedy and compresses the
the ends so dont work the same "out of the box" but im sure it can be adjusted to do the same.
mmh, not to tricky in my opinion x):
MainWindow::MainWindow(QWidget *parent) : QMainWindow(parent), ui(new Ui::MainWindow) { ui->setupUi(this); QVBoxLayout *vLayout = new QVBoxLayout(ui->centralWidget); for(int i(0); i < 5; i++){ QPushButton *btn(new QPushButton(QString("Button %1").arg(i))); btn->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding); vLayout->addWidget(btn,1); } QSpacerItem *spacer = new QSpacerItem(0,0,QSizePolicy::Expanding,QSizePolicy::Expanding); vLayout->addItem(spacer); vLayout->setStretch(5,1); QPushButton *btn(new QPushButton(QString("Last Button"))); btn->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding); vLayout->addWidget(btn,1); }
sry, don't know of an easy way to make a gif on the fly. X)
-
mmh, not to tricky in my opinion x):
MainWindow::MainWindow(QWidget *parent) : QMainWindow(parent), ui(new Ui::MainWindow) { ui->setupUi(this); QVBoxLayout *vLayout = new QVBoxLayout(ui->centralWidget); for(int i(0); i < 5; i++){ QPushButton *btn(new QPushButton(QString("Button %1").arg(i))); btn->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding); vLayout->addWidget(btn,1); } QSpacerItem *spacer = new QSpacerItem(0,0,QSizePolicy::Expanding,QSizePolicy::Expanding); vLayout->addItem(spacer); vLayout->setStretch(5,1); QPushButton *btn(new QPushButton(QString("Last Button"))); btn->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding); vLayout->addWidget(btn,1); }
sry, don't know of an easy way to make a gif on the fly. X)
@J.Hilk said in Space Buttons equally in Layout, but with an empty slot:
mmh, not to tricky in my opinion x):
Just to clarify, the central point here is that the buttons and the spacer have the same vertical size policy (doesn't have to be "expanding").
-
@J.Hilk said in Space Buttons equally in Layout, but with an empty slot:
mmh, not to tricky in my opinion x):
Just to clarify, the central point here is that the buttons and the spacer have the same vertical size policy (doesn't have to be "expanding").
-
@mrjj Is your first example using a GridLayout? Or a vertical layout? When I place the buttons and a widget in the form and combine into a QVBoxLayout or a QGridLayout, shrinking and expanding the layout only changes the height of the widget, not the buttons.
-
@mrjj Is your first example using a GridLayout? Or a vertical layout? When I place the buttons and a widget in the form and combine into a QVBoxLayout or a QGridLayout, shrinking and expanding the layout only changes the height of the widget, not the buttons.