PYQT5 Primary Tutorials--pyqt5 in layout management [5/13]_PYQT5

Want to write GUI with PyQt5, but the PYQT5 resources on the Internet are too few, find an English, translate, and learn PYQT5 students to encourage!

(All code in this series is tested through the Windows7 64-bit []/python 3.4.3 32bit/pyqt GPL v5.5 for Python v3.4 (x32)/eric6-6.0.8.)

Original address: http://zetcode.com/gui/pyqt5/

================================================================================

One of the most important aspects of GUI programs is layout management. Layout management is how we put parts in the program window. There are two ways. Absolute positioning and layout classes.

The programmer locates the position and size of each part to the pixel level. When you use absolute positioning, we need to understand the following limitations:
If we change the size of a window, the size and positioning of a part cannot be changed.
The program may look different on various platforms.
changing fonts within our program may break the layout
If we decide to modify the layout, we must all redo our layout, which is cumbersome and time-consuming.

The following example is an absolutely positioned layout part.

Import sys
from pyqt5.qtwidgets import Qwidget, Qlabel, Qapplication


class Example (qwidget):
    
    def __init__ ( Self):
        super (). __init__ ()
        
        Self.initui ()
        
        
    def initui (self):
        
        lbl1 = Qlabel (' Zetcode ', self)
        Lbl1.move (

        lbl2) = Qlabel (' tutorials ', self) lbl2.move lbl3
        
        = Qlabel (' For programmers ', self )
        self.setwindowtitle (' absolute '    
        ), Self.setgeometry (Lbl3.move) (in) Self.show ()
        
        
if __name__ = = ' __main__ ':
    
    app = Qapplication (SYS.ARGV)
    ex = Example ()
    sys.exit ( APP.EXEC_ ())

We use the mover () method to locate our parts. In this example, the part is the label. When we locate them, we use the axes x and Y. The first coordinate system is in the upper-left corner. x is left to right, and y is from top to bottom.

LBL1 = Qlabel (' Zetcode ', self)
lbl1.move (15, 10)

The label part is positioned in the x=15,y=10 position.

Picture: Absolute Positioning box layout

Layout management with layout class has better flexibility and practicability. It's a better way to put parts in a window. Qhboxlayout and Qvboxlayout are basic layout classes that make parts align horizontally and vertically.

Imagine that we want to put two buttons in the lower right corner. To create a layout like this, we need to use a horizontal and a vertical box. To create the necessary space, we need to add a scaling factor.

Import SYS from
pyqt5.qtwidgets import (Qwidget, Qpushbutton, 
    qhboxlayout, Qvboxlayout, qapplication)


Class Example (Qwidget):
    
    def __init__ (self):
        super (). __init__ ()
        
        Self.initui ()
        
        
    def initui (self):
        
        OKButton = Qpushbutton ("OK")
        CancelButton = Qpushbutton ("Cancel")

        Hbox = Qhboxlayout ()
        Hbox.addstretch (1)
        hbox.addwidget (okbutton)
        hbox.addwidget (cancelbutton)

        VBox = Qvboxlayout ()
        Vbox.addstretch (1)
        vbox.addlayout (Hbox)
        
        self.setlayout (vbox)    
        
        self.setgeometry (300, 300, 300
        self.setwindowtitle (' Buttons ')    
        self.show ()
        
        
if __name__ = = ' __main__ ':
    
    app = Qapplication ( SYS.ARGV)
    ex = Example ()
    sys.exit (App.exec_ ())

In the example we placed two buttons in the lower right corner of the window. When we resize the program window, their position is unchanged. We used a hboxlayout and a qvboxlayout.

OKButton = Qpushbutton ("OK")
CancelButton = Qpushbutton ("Cancel")

Here we create two buttons.

Hbox = Qhboxlayout ()
hbox.addstretch (1)
hbox.addwidget (okbutton)
hbox.addwidget (CancelButton)

We create a horizontal box layout, add a scaling factor and two buttons. The scaling factor is added to a scalable space before the two buttons. This places them on the right side of the window.

VBox = Qvboxlayout ()
vbox.addstretch (1)
vbox.addlayout (Hbox)

To create the necessary layout, we add the horizontal layout to the vertical layout. The scaling factor in the vertical layout puts the horizontal box with the button in the lower part of the window.

Self.setlayout (VBox)

Finally, we set the main layout of the window.

Picture: button

Qgridlayout (Grid layout)

The most commonly used layout class is the grid layout. This layout separates space into rows and columns. To create a network layout, we use the Qgridlayout class.

Import sys from pyqt5.qtwidgets import (Qwidget, Qgridlayout, Qpushbutton, Qapplication) class Example (Qwidget): def __init__ (self): Super (). __init__ () Self.initui () def initui (self
                 ): Grid = Qgridlayout () self.setlayout (grid) names = [' Cls ', ' Bck ', ', ', ', ', ', ', ', ', ', '] ' 7 ', ' 8 ', ' 9 ', '/', ' 4 ', ' 5 ', ' 6 ', ' * ', ' 1 ', ' 2 ', ' 3 ', '-', ' 0 ', '. ', ' = ', ' + '] positions = [(I,J) for I in range (5) for J in Range (4)] for position, Name in Zip (positions, names): if name = = ': Continue button = Qpush button (name) grid.addwidget (button, *position) Self.move Self.setwindow 
    Title (' Calculator ') self.show () if __name__ = = ' __main__ ': app = Qapplication (SYS.ARGV)
    ex = Example ()Sys.exit (App.exec_ ()) 

In this example, we created the grid button. To fill an empty space, we add a qlabel part.

Grid = Qgridlayout ()
self.setlayout (GRID)

The instance of Qgridlayout is created and set to the layout of the program window.

names = [' Cls ', ' Bck ', ', ', ', ', ' Close ',
            ' 7 ', ' 8 ', ' 9 ', '/', '
            4 ', ' 5 ', ' 6 ', ' * ', '
            1 ', ' 2 ', ' 3 ', '-', ' 0 ', '
            . ', ' '=', '+']

These are the labels used for the buttons.

positions = [(I,J) for I in range (5) for J in Range (4)]

We created a list of locations in the grid.

For position, name in zip (positions, names):
    
    if name = = ':
        continue
    button = Qpushbutton (name)
    Grid.addwidget (button, *position)

The button is created and added to the layout through the AddWidget () method.

Photo: Calculator Review Example parts can be divided into multiple rows and columns in a grid. In the next example, we'll show you.

Import sys from pyqt5.qtwidgets import (Qwidget, Qlabel, Qlineedit, Qtextedit, Qgridlayout, qapplication) class Exa
        
        
    Mple (qwidget): def __init__ (self): Super (). __init__ () Self.initui () def initui (self): title = Qlabel (' title ') Author = Qlabel (' author ') review = Qlabel (' Re View ') Titleedit = Qlineedit () Authoredit = Qlineedit () Reviewedit = Qtextedit () Grid =

        Qgridlayout () grid.setspacing (Grid.addwidget) (title, 1, 0) grid.addwidget (titleedit, 1, 1)
        Grid.addwidget (author, 2, 0) Grid.addwidget (authoredit, 2, 1) grid.addwidget (review, 3, 0) Grid.addwidget (Reviewedit, 3, 1, 5, 1) self.setlayout (GRID) Self.setgeometry (300, 300,
    
    Self.setwindowtitle (' Review ') self.show () if __name__ = = ' __main__ ': App = Qapplication (sYS.ARGV) ex = Example () sys.exit (App.exec_ ()) 

We create a window with three tabs, two row editors, and a file editor widget. The layout is done through qgridlayout.

Grid = Qgridlayout ()
grid.setspacing (10)

We create a grid layout and set the spacing between the parts.

Grid.addwidget (Reviewedit, 3, 1, 5, 1)

If we add a widget to the grid, we can supply the ruled and column widths of the parts. In this example, we use Reviewedit to divide the parts into 5 lines.

Photo: Review