Python Forum
[PyQt] How to give widget a left margin within a QHBoxLayout?
Thread Rating:
  • 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
[PyQt] How to give widget a left margin within a QHBoxLayout?
#1
I've got a widget placed within a QHBoxLayout, as well as a QGroupBox above it which has the same widgets within that. I want the widgets to align vertically whether they're in a group box or outside of one, so I want to add a left margin (CSS talk) to the widgets outside of a group box, but I'm not sure how to do it.

I've basically got this:

tab_content_layout = QVBoxLayout()
tab_content_layout.setAlignment(Qt.AlignmentFlag.AlignTop)
tab_content_layout.setSpacing(5)

group_1 = QGroupBox('T1 - Source Conversion')
...
tab_content_layout.addWidget(group_1)

fn = IgnitionFunctionButton('T2', 'Report UDT Instance Property Overrides', '', '')
## need to add left margin / move fn to the right 10px
tab_content_layout.addWidget(fn)
Note: IgnitionFunctionButton is a custom widget that shows a label, button, and two icons (SVGs).

   
Reply
#2
Looks like a UI design issue. Why does T1 have A and B, but T2 does not? If you fight the layout managers by adjusting margins it will be a constant battle. Better to make things consistent. The code is easier to write, and the user experience is better.

That said, Qt supports setting margins.
https://wiki.qt.io/Adjust_Spacing_and_Ma..._in_Layout
Reply
#3
(Oct-31-2024, 04:04 PM)deanhystad Wrote: Looks like a UI design issue. Why does T1 have A and B, but T2 does not? If you fight the layout managers by adjusting margins it will be a constant battle. Better to make things consistent. The code is easier to write, and the user experience is better.

That said, Qt supports setting margins.
https://wiki.qt.io/Adjust_Spacing_and_Ma..._in_Layout

It could well be a design issue!! :)

I'm replicating the previous design in tkinter, hopefully making it a little better in the process.
Basically:
- I have ~30 odd of functions, some related, others not, grouped at a high level by category: Tags, Views, Text, Misc, where the starting letter determines the first letter in the function's ID (e.g. T1 = 1st function (group) for the Tags category)
- each function or group gets a number (e.g. the 1 in T1)
- related functions have the same number but also get a letter for each individual function within the group (e.g. the "A" in group T1)
- a group box will group related functions together.
- the application itself is just a set of functions that help development of other software (SCADA). It's for internal use only

The number and letter serve as an ID for the function, so instead of refering to them as "function that does this", I can just tell people to use "T1A". It helps both them, as numbers are ordered and it's therefore easy to find the button in the list, as well as helps me not having to remember the name of the function button. But as people use it more, myself included, they will get to know the numbers and/or positions and build muscle memory to know where they are.

This is the old tkinter interface. It's super ugly and simple, but it works "ok".
   

This is the start of the Qt interface:
   

In tkinter I grouped related functions together simply by setting the pady/padx to 0, and to 5 if they weren't related.

Happy to consider alternatives if you have any ideas!! It's the first time I'm using PyQt before, so I have very little experience
Reply


Possibly Related Threads…
Thread Author Replies Views Last Post
  [Tkinter] Text Button - How Do I Reduce The Margin? vman44 6 15,920 Apr-27-2020, 10:48 PM
Last Post: Larz60+
  [Tkinter] how do i add a margin to a Listbox DT2000 27 24,799 May-14-2019, 04:07 AM
Last Post: DT2000

Forum Jump:

User Panel Messages

Announcements
Announcement #1 8/1/2020
Announcement #2 8/2/2020
Announcement #3 8/6/2020