Have the main UI remain fixed when expanding

Pl45m4

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.

Rangerguy128

@JonB What layout should I use? Also, my bad but here's the missing top half of the object inspector:

Rangerguy128

@Pl45m4 For the radio buttons, I just want to place them over certain parts of the map to indicate where the samples are taken. Clicking on one of them would change the top label from PO1 (default) to PO5.

Oh, and set the policy like what you said but they still haven't expanded yet:

Pl45m4

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

Also, my bad but here's the missing top half of the object inspector:

From this perspective it doesn't look quite right what you've done.
It looks that you haven't applied the layouts TO your widgets, but added new layouts on top of them. You still have the red-sign that stands for "I have no layout" :)

horizontalLayout_2 should be the "build-in" layout of centralWidget.
Same for verticalLayout and widget_2.

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

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"

See what I wrote here.
E.g. to set a layout TO centralWidget and to make the layout work property with your window, right-click the row in Object Inspector that says MainWindow (the very first one). There you can select a layout easily, but you have to have content within your widget's bounds... you can't set a layout to an empty widget... Don't ask why... QtDesigner is not the perfect tool :)
Therefore I've said you need to create your inner layouts and content, before you can apply a layout to your centralWidget or your new widget.

Edit:

Since you replied to @JonB , is this screenshot from Object Inspector the current setup or is everything working now? Does it look like my setup? No red signs?!

Rangerguy128

@Pl45m4 I have two windows just in case: one that was my own (the former), and the other following @JonB's instructions (the latter).

The latter expands when maximized but for some reason, even after messing with the sieze policy, the map image doesnt expand with the black label.

SimonSchroeder

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

the map image doesnt expand with the black label.

If the image is restricted by its height, it will not expand to the side. You might be able to fix this by putting the image inside a scroll area.

For the buttons on the left you might want to add a vertical spacer item at the bottom of the layout (which would add a lot of space at the bottom but prevent the buttons from being spread out).

JonB

@Rangerguy128
Just to say, this (the second one) is much better! You always want to get rid of any "red no-entry" signs for missing layout shown in Object Inspector. Nothing will behave right till you do.

Pl45m4

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

@Pl45m4 I have two windows just in case: one that was my own (the former), and the other following @JonB's instructions (the latter).

Yes the 2nd is the obviously the better one.
That's what I also described here:

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

The final result should look like this:

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

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.

I was asking this, because depending on what you want to do, you better use QGraphicsView or at least put your map in some scrollable widget as @SimonSchroeder suggested...

So if I understand correctly, you want to anchor those radio buttons to fixed postions on your map (on your image label) and then be able to toggle them and do something after that? Is that all?

Rangerguy128

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

So if I understand correctly, you want to anchor those radio buttons to fixed postions on your map (on your image label) and then be able to toggle them and do something after that? Is that all?

Yes, exactly what I'm trying to do! Can you demostrate it if possible? I'm trying to mess around with the app but I'm still a newbie on how it works.

mpergand

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

you want to anchor those radio buttons to fixed postions on your map

The easy way is to anchor to the top-left corner because this position is fixed independently of the image size.

Rangerguy128

@mpergand Any way to do that? By top left corner, you mean of the image or the layout where the image is in?

mpergand

@Rangerguy128

You can create a widget outside of any layout.
It will be positioned at 0,0 of the parent widget you give:

auto frame=new QFrame(some parent widget):
frame->setFrameShape(QFrame::Box);
// you can move it then after
frame->move(10,10);