• Python界面编程之六----布局


    布局(转载于–学点编程吧)
    通过实践可知采用了布局之后能够让我们的程序在使用上更加美观,不会随着窗体的大小发生改变而改变,符合我们的使用习惯。

    绝对位置
    程序员以像素为单位指定每个小部件的位置和大小。 当您使用绝对定位时,我们必须了解以下限制:

    如果我们调整窗口大小,则小部件的大小和位置不会改变
    各种平台上的应用可能会有所不同
    在我们的应用程序中更改字体可能会损坏布局
    如果我们决定改变我们的布局,我们必须彻底重做布局,这很浪费时间

    下面这个例子我们将小部件置于绝对坐标中:

    import sys
    from PyQt5.QtWidgets import (QWidget, QPushButton, QApplication)


    class Example(QWidget):
    def __init__(self):
    super().__init__()

    self.setGeometry(300,300,400,300)
    self.setWindowTitle('学点编程吧')

    bt1 = QPushButton('剪刀',self)
    bt1.move(50,250)

    bt2 = QPushButton('石头',self)
    bt2.move(150,250)

    bt3 = QPushButton('布',self)
    bt3.move(250,250)
    self.show()


    if __name__ == '__main__':
    app = QApplication(sys.argv)
    ex = Example()
    sys.exit(app.exec_())
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    我们使用move()方法来定位我们的小部件。 在我们的例子中,这些是按钮。 我们通过提供x和y坐标来定位它们。 坐标系的开始位于左上角。 x值从左到右增长。 y值不变。

    箱式布局
    QHBoxLayout和QVBoxLayout是基本的布局类,它们在水平和垂直方向上排列小部件。

    import sys
    from PyQt5.QtWidgets import QWidget, QPushButton, QApplication, QHBoxLayout, QVBoxLayout


    class Example(QWidget):
    def __init__(self):
    super().__init__()

    self.setGeometry(300,300,400,300)
    self.setWindowTitle('箱式布局')
    self.init_ui()

    def init_ui(self):
    bt1 = QPushButton('剪刀', self)
    bt2 = QPushButton('石头', self)
    bt3 = QPushButton('布', self)

    h_box = QHBoxLayout()
    h_box.addStretch(1)
    h_box.addWidget(bt1)
    h_box.addWidget(bt2)
    h_box.addWidget(bt3)

    v_box = QVBoxLayout()
    v_box.addStretch(1)
    v_box.addLayout(h_box)

    self.setLayout(v_box)

    self.show()


    if __name__ == '__main__':
    app = QApplication(sys.argv)
    ex = Example()
    app.exit(app.exec_())
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    该示例在窗口的右下角放置了三个按钮。 当我们调整应用程序窗口大小时,它们会留在那里,我们同时使用一个HBoxLayout和一个QVBoxLayout。
    在这里插入图片描述

    bt1 = QPushButton('剪刀', self)
    bt2 = QPushButton('石头', self)
    bt3 = QPushButton('布', self)
    1
    2
    3
    我们新建三个按钮

    h_box = QHBoxLayout()
    h_box.addStretch(1)
    h_box.addWidget(bt1)
    h_box.addWidget(bt2)
    h_box.addWidget(bt3)
    1
    2
    3
    4
    5
    我们创建一个水平框布局,并添加一个拉伸因子和三个按钮。这个拉伸在三个按钮之前增加了一个可伸缩的空间。这将把它们推到窗口的右边。

    v_box = QVBoxLayout()
    v_box.addStretch(1)
    v_box.addLayout(h_box)
    1
    2
    3
    水平布局放置在垂直布局中。垂直框中的拉伸因子将按钮的水平框推到窗口的底部。

    self.setLayout(v_box)
    1
    最后,我们设置窗口的主要布局。

    addStretch函数的作用是在布局器中增加一个伸缩量,里面的参数表示QSpacerItem的个数,默认值为零,会将你放在layout中的空间压缩成默认的大小。例如用addStretch函数实现将QHBoxLayout的布局器的空白空间分配。

    import sys
    from PyQt5.QtWidgets import (QWidget, QPushButton, QApplication, QHBoxLayout)

    class Example(QWidget):
    def __init__(self):
    super().__init__()
    self.init_ui()

    self.setGeometry(300,300,400,300)
    self.setWindowTitle('学点编程吧')

    def init_ui(self):
    bt1 = QPushButton('剪刀', self)
    bt2 = QPushButton('石头', self)
    bt3 = QPushButton('布', self)

    h_box = QHBoxLayout()
    h_box.addStretch(1) #增加伸缩量
    h_box.addWidget(bt1)
    h_box.addStretch(1)#增加伸缩量
    h_box.addWidget(bt2)
    h_box.addStretch(1)#增加伸缩量
    h_box.addWidget(bt3)
    h_box.addStretch(6)#增加伸缩量

    self.setLayout(h_box)

    self.show()


    if __name__ == '__main__':
    app = QApplication(sys.argv)
    ex = Example()
    app.exit(app.exec_())
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    在这里插入图片描述
    其中四个addStretch()函数用于在button按钮间增加伸缩量,伸缩量的比例为1:1:1:6,意思就是将button以外的空白地方按设定的比例等分为9份并按照设定的顺序放入布局器中。

    格栅布局,也被称作网格布局(多行多列)
    栅格布局将位于其中的窗口部件放入一个网状的栅格之中。QGridLayout需要将提供给它的空间划分成的行和列,并把每个窗口部件插入并管理到正确的单元格。

    栅格布局是这样工作的:它计算了位于其中的空间,然后将它们合理的划分成若干个行(row)和列(column),并把每个由它管理的窗口部件放置在合适的单元之中,这里所指的单元(cell)即是指由行和列交叉所划分出来的空间。

    坐标分布是这样的:
    在这里插入图片描述
    下面这个例子就是采用格栅布局制作的一个计算器界面,当然在功能上按下按钮只是能显示而已,不能进行具体的计算,后期我们会制作一个完整的计算器。

    import sys
    from PyQt5.QtWidgets import QWidget, QPushButton, QApplication, QGridLayout, QLCDNumber


    class Example(QWidget):
    def __init__(self):
    super().__init__()
    self.Init_UI()

    def Init_UI(self):
    grid = QGridLayout()
    self.setLayout(grid)

    self.setGeometry(300, 300, 400, 300)
    self.setWindowTitle('栅格布局-计算器')

    self.lcd = QLCDNumber()
    grid.addWidget(self.lcd, 0, 0, 3, 0)
    grid.setSpacing(10)

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

    positions = [(i, j) for i in range(4, 9) for j in range(4, 8)]
    for position, name in zip(positions, names):
    if name == '':
    continue
    button = QPushButton(name)
    grid.addWidget(button, *position)
    button.clicked.connect(self.Cli)

    self.show()

    def Cli(self):
    sender = self.sender().text()
    ls = ['/', '*', '-', '=', '+']
    if sender in ls:
    self.lcd.display('A')
    else:
    self.lcd.display(sender)


    if __name__ == '__main__':
    app = QApplication(sys.argv)
    ex = Example()
    app.exit(app.exec_())
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    执行结果:
    在这里插入图片描述

    grid = QGridLayout()
    self.setLayout(grid)
    1
    2
    创建QGridLayout的实例并将其设置为应用程序窗口的布局。

    grid.addWidget(self.lcd,0,0,3,0)
    grid.setSpacing(10)
    1
    2
    如果我们向窗格添加窗口小部件,我们可以提供窗口小部件的行跨度和列跨度。 在我们的例子中,我们使QLCDNumber小部件跨越4行。同时我们创建一个网格布局并在窗口小部件之间设置间距。

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

    positions = [(i,j) for i in range(4,9) for j in range(4,8)]
    1
    2
    3
    4
    5
    6
    7
    我们创建了19个按钮并指定了具体的坐标位置。

    if name == '':
    continue
    button = QPushButton(name)
    grid.addWidget(button, *position)
    button.clicked.connect(self.Cli)
    1
    2
    3
    4
    5
    使用addWidget()方法创建并添加到布局中的按钮。同时当我们按下按钮的时候调用self.Cli()方法

    def Cli(self):
    sender = self.sender().text()
    ls = ['/', '*', '-', '=', '+']
    if sender in ls:
    self.lcd.display('A')
    else:
    self.lcd.display(sender)
    1
    2
    3
    4
    5
    6
    7
    当我们按下按钮的时候我们会得到按钮上显示的名称,如果是操作符则在LCD上显示“A”(因为LCD的显示功能有限),否则显示我们按下的信息。
    1
    表单布局
    QFormLayout管理输入型控件和关联的标签组成的那些Form表单。

    QFormLayout是一个方便的布局类,其中的控件以两列的形式被布局在表单中。左列包括标签,右列包含输入控件,例如:QLineEdit、QSpinBox、QTextEdit等。

    下面这个例子就是说明表单布局是怎么用的

    import sys
    from PyQt5.QtWidgets import QWidget, QApplication, QFormLayout, QLabel, QLineEdit, QTextEdit


    class Example(QWidget):
    def __init__(self):
    super().__init__()
    self.setGeometry(300, 300, 300, 200)
    self.setWindowTitle('表单布局')
    self.ui_init()

    def ui_init(self):
    form_layout = QFormLayout()
    name_label = QLabel('姓名')
    name_line_edit = QLineEdit('')
    introduction_label = QLabel('简介')
    introduction_line_edit = QTextEdit('')

    form_layout.addRow(name_label, name_line_edit)
    form_layout.addRow(introduction_label, introduction_line_edit)
    self.setLayout(form_layout)

    self.show()


    if __name__ == '__main__':

    app = QApplication(sys.argv)
    ex = Example()
    app.exit(app.exec_())
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    在这里插入图片描述

    form_layout = QFormLayout(http://www.my516.com)
    1
    创建一个表单布局

    formlayout.addRow(nameLabel,nameLineEdit)
    formlayout.addRow(introductionLabel,introductionLineEdit)
    1
    2
    向表单中增加一行,内容是我们定义的小部件。

  • 相关阅读:
    新博客即将启用
    关于博主 | 联系博主
    结束吧,为这不圆满的故事划上一个残缺的句号
    自用线段树模板
    NOIP 2017 day 1 游记
    NOIP 2017 Day 0. 游记
    NOIP 2017 day -1 杂记
    再一次想不出应该起什么标题
    做图与树做到吐的一天
    自用二分图匹配模板
  • 原文地址:https://www.cnblogs.com/hyhy904/p/11007514.html
Copyright © 2020-2023  润新知