Have the main UI remain fixed when expanding

Rangerguy128

Need some advice on expanding the main app's UI which i created in QT Designer. Here'swhat it looks like:

However, when expanding as I previewed it, this is what it looks like now:

Are there any solutions to this? Do I have to mess around with QT Designer or are a few lines of code in Python good enough? Also, while not related to the topic, I can't figure out as to why I can't resize the vertical widget on the left where the four pushbuttons are placed. It looks like it needs a 5th button but I only want 4 for now.

Pl45m4

@Rangerguy128

What layouts do you use?

Rangerguy128

@Pl45m4 I only used vertical layout where I could store the buttons and the label (Also, I managed to fix the layout size, atleast). As for the map, its radio buttons and the label on top of it, I used a display widget (label) for them. DO I have to place the labels over the layouts for it to work?

Pl45m4

@Rangerguy128 said in Have the main UI remain fixed when expanding:

I used a display widget (label) for them. DO I have to place the labels over the layouts for it to work?

You need to put the label that shows your map in a layout that scales with your main window.
Does your centralWidget in Designer have a layout or do you see this red circle "warning" icon next to centralWidget in Object Inspector?

Ronel_qtmaster

@Pl45m4 it is simple.As you are using a MainWindow, do:
ui->CentralWidget->setLayout(ui->your_layout);

then the layout should contain your label

Pl45m4

@Ronel_qtmaster said in Have the main UI remain fixed when expanding:

@Pl45m4 it is simple. As you are using a MainWindow, do

Me? Not my topic :)

ui->CentralWidget->setLayout(ui->your_layout);
then the layout should contain your label

@Rangerguy128 has probably multiple layouts (at least one more containing the buttons). So just setting one layout as central layout might not be the best solution.
Both/all layouts have to get connected first. Then you can set the top-most as central layout

Ronel_qtmaster

@Pl45m4 THANKS.I said the layout which has the label for image because it is the one he asked for

Rangerguy128

@Pl45m4 I see, so should I use one layout where I can throw in all of my widgets, labels, etc.? Or can I use multiple layouts and place them beside eachother? For example, placing a vertical layout on the left of the window, and a grid layout on the right. For clarirication, as seen on my window, the only layoyt I used there was the vertical to contain both the "Parameter" label and the QPushbuttons. Neither the top black label nor the map image are contained in a layout.

mpergand

@Rangerguy128 said in Have the main UI remain fixed when expanding:

Or can I use multiple layouts and place them beside eachother?

Use a HLayout as root, then add 2 VLayouts to it, one for your buttons and another for your image and label.

Pl45m4

@Rangerguy128 said in Have the main UI remain fixed when expanding:

Or can I use multiple layouts and place them beside eachother?

Yes, cascading layouts.
How you set them up depends on how your elements should behave and how your GUI should look like.
To get what you illustrate above, I would group your buttons in a vertical layout, put the vertical layout in a horizontal layout. And then move the label and the other label, which holds your map to the right of our button layout. So that they are also included in the horizontal layout
At last set the horizontal layout as layout for centralWidget

To do this in Designer you might have to remove the current layout and start to order your widgets from scratch.
Select all your buttons, right click, pick "Lay out vertically". Right click on the empty area, select "Lay out horizonal" (this should apply a QHBoxLayout to centralWidget) and then you drag the label (or layout with your labels) to your position in the layout.

Neither the top black label nor the map image are contained in a layout.

That is the reason why the map does not scale or move with your window.

Rangerguy128

@Ronel_qtmaster Where can I find those options on QT Designer? My apologies if I'm blind but I can't find them. One guy on the internet suggested on right clicking the main window but no luck. Do you mind showing them with a screenshot?

Pl45m4

@Rangerguy128

See here

https://doc.qt.io/qt-6/designer-layouts.html

Rangerguy128

@mpergand How do I add thwo vertical layouts in one horizontal layout? I did what you say but for some reason, neither of thw two are seperated, as if both were on top of another.

Rangerguy128

Did another way by having two vertical layouts with their own contents (on that has the qpushbuttons and the other that had the map and the top black label), and this is what I'm getting:

Also, when, I tried to add radio buttons to the map (already placed in the vertical layout), this happens:

I'm still new with QT designer so I really don't know what I'm supposed to do. Even with youtube videos, I can't seem to find an answer.

Oh, and forgot to mention that for the vertical layout with the pushbuttons, it has a widget intergrated so I could place the buttons and the top blue label in order.

Pl45m4

@Rangerguy128

Can you show the Object Inspector please? So we can see what your current setup is

Rangerguy128

@Pl45m4 Here it is:

Also, had to include widgets to the layouts just so I could add in the radio buttons.

JonB

@Rangerguy128
You should start by setting a layout on the widget there which has a red "no-entry" symbol on it.

Pl45m4

@Rangerguy128

It's not that hard. As I told you, start with the inner layouts, then group them in layouts together until you have your desired design.

Start like this:
I created 4 buttons and organized them in a verticalLayout. Next I created two labels, representing your map (in my case yellow area) and your text above your map.
After that I created an empty QWidget (blue) and placed it somewhere on the mainWindow. As you can see, my QWidget widget and centralWidget also have no layout like yours.

In the next steps you can add more widgets like your QRadioButtons. I grouped them in their own vertical layout.

Finally you put all your stuff together:

Order your widgets like this

and right-click in object inspector (on the left) on your QWidget widget, click "Lay out" and "vertical". Then do the same on your QMainWindow where your select "Lay out horizontal"

The final result should look like this:

Everything moves with your window now and should resize properly.
Later you can add more buttons or whatever you like to the existing layouts, or you break them, add new layouts or re-arrange them.
You can also see that widget as well as centralWidget both don't have the "no layout"-warning-sign anymore.

Rangerguy128

@Pl45m4 I did what you told me to do and so far, it works, although I hvae three questions. Why are the pushbuttons and the blue label all spaced out, why doesnt the map image (Changed it for a different one) expand along with the balck label, and how can I place the radio buttons over the map? Here's a screenshot so that you can take a better look:

Pl45m4

@Rangerguy128 said in Have the main UI remain fixed when expanding:

Why are the pushbuttons and the blue label all spaced out,

Because they all take the space equally and don't grow vertically. QPushButtons have a fixed vertical size by default. Set sizePolicy of your buttons to vertical: Expanding (you can do it in Designer's property editor).

why doesnt the map image (Changed it for a different one) expand along with the balck label

I think it's the same reason as with your buttons. Change the sizePolicy
Do you really want to stretch the image so the width-height-ratio changes?

how can I place the radio buttons over the map?

Then you can't put them in a layout.

What is your goal after all? What do you want to do with this map and these "radio buttons"?
There might be a better way, depending on what you have in mind.