QGridLayout: widgets don't align properly
-
Please take a look at the screenshot
The left edge of 'Option 2' checkbox didn't align with that of 'Option 1' checkbox!http://i.imgur.com/CKSzl.png(layout)!
Here is the code in Python
@label1 = QLabel('Question 1')
label2 = QLabel('Question 2')
line_edit = QLineEdit()
check_box1 = QCheckBox('Option 1')
check_box2 = QCheckBox('Option 2')
combo_box = QComboBox()inner_layout = QHBoxLayout()
inner_layout.addWidget(check_box2)
inner_layout.addWidget(combo_box)outer_layout = QGridLayout()
outer_layout.addWidget(label1, 0, 0)
outer_layout.addWidget(label2, 1, 0)
outer_layout.addWidget(line_edit, 0, 1)
outer_layout.addWidget(check_box1, 1, 1)
outer_layout.addLayout(inner_layout, 2, 1)window = QWidget()
window.setLayout(outer_layout)
window.show()@
-
what is the margin of inner_layout?
By default this is not 0 I think.
-
Thanks Eddy
I have tried inner_layout.setContentsMargins(0, 0, 0, 0) but it has no effect
-
Could it be that the inner_layout does not have a stretch, which means the left-over space is distributed evenly? What if you add inner_layout.addStretch() after adding the widgets?
-
QGridLayout is capable of using 3 rows, 3 columns as you need (even more if wanted)
just don't add the 1,2 and 2, 0 widgets.
only use 0,0 0,1 0,2 1,0 1,1 2,1 2,2.You don't need inner_layout at all and your problem will vanish.
Edit : in a table format :
x | x | x
x | x | 0
0 | x | x
only put widgets on the x's
-
ludde, inner_layout.addStretch() didn't work either.
I think the ComboBox has consumed the extra space
-
Right, in that case I would do what Eddy suggests above. When adding the line edit, you'll have to do something like @outer_layout.addWidget(line_edit, 0, 1, 1, 2)@ to make it span two columns.
-
@ Ludde : Exactly what i was trying to add after reading my post. The overloaded function with span can solve it.
-
I didn't show you the full UI
In fact, there are several more rows.
The problem of not using QHBoxLayout inside QGridLayout is that the widgets with the same column number will have the same width.For example, cell 2, 5, 8 will have the same column width.
If cell 5 contains a QCheckBox, cell 8 contains a QLineEdit and cell 6 contains a QPushButton, then the width of the line edit will be to small.If I increase the width of the line edit, the button in cell 6 will be too far apart from the checkbox
1 | 2 | 3
4 | 5 | 6
7 | 8 | 9The combobox is too far apart from the checkbox
-
I have to tell first that when designing forms I prefer to use Qt Designer.
There you can place widgets as you like and they can span several colums in the grid.The gridlayout will take care of this automatically. you really don't need to use horzontal layouts in it.
Just make some extra space where you need it.EDIT : I didn't see your image first.
You have 5 columns and 4 rows in that case. The same principles can be used here.
-
Thanks Eddy, that works for me!
I am just wondering why my first approach causes alignment problem
Is that a bug?
-
I tested your first code on windows 7 and didn't see the behaviour you have.
Layout margins use the theme defaults. But i cannot test it on mac. The only thing i could think of is the contentsmargins of your gridlayout.
Anyway, i'm glad i could help.
){kind=link}
){kind=link}