Interface layout (layout) is a very important part of drawing interface. Here I will start from a practical example and explain how to use the Qt Creator tool for interface layout.
Let's assume that we draw such an http test client tool similar to postMan:
1. Create a project with Qt Creator
Set the window title to: HTTP Interface Test, and the window size to 800*700.
2. Regardless of layout, use Qt Creator to drag out the overall interface.
3. Layout
(1) Several commonly used layout methods
Generally, only Vertical Layout, Horizontal Layout and Spacer can be used to complete the layout of most interfaces.
(2) Layout operation 1
（2.1）
Select with the mouse at the same time (press and hold down the Ctrl key when clicking the mouse): the 3 controls in the first row - the combox selection box, the lineEdit input box, and the send button.
Click the right mouse button and select: Layout -- Horizontal Layout.
（2.2）
At this time, the interface becomes like this:
At this time, select the red frame outside with the mouse, and drag it to the right to enlarge the frame.
(3) Layout operation 2
Mouse selected: message header, +- button, with horizontal layout.
(4) Layout operation 3
Mouse selection: the whole above and the text box below, using "vertical layout".
(5) Layout operation 4
Select the "message body" and the "text box" below with the mouse, and adopt the "vertical layout".
(6) Layout operation 5
Select with the mouse: the whole on the left - 1, the "vertical line" in the middle - 2, the whole on the right - 3. Use a horizontal layout.
Then adjust the control to the appropriate size.
(7) Layout operation 6
Now, I select "MainWindow" with the mouse, then click the right mouse button and select Layout -- "Vertical" layout. After the operation is completed, the interface will look like this:
So far, the layout is basically complete. Next, let's execute the program to see the effect of the interface. We can see that no matter how the form is scaled, the controls in the form will be scaled together.
If readers still don't understand, it is recommended to take a good look at the video in the reference. (Video author is not me)
reference:
(1) Python Qt graphical interface programming - PySide2 PyQt5 PyQt PySide