美文网首页
PuQt5 表格布局深入:让组件可以跨度多行多列

PuQt5 表格布局深入:让组件可以跨度多行多列

作者: _Mirage | 来源:发表于2020-04-02 03:23 被阅读0次

重点是 一个grid布局的setSpacing方法,作用是设置各个组件之间的间隙(空格),
然后是grid布局的addWidget方法的后两个参数不设置的话默认是1, 1,即是row方向填充1, column方向填充1(也就是没填充), 如果设置成别的就相当于填充了, 填充了之后相当于和其他跨度为1的组件在某方向上的变化了多少倍(大概是这样).

代码:

# coding='utf-8'


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


class Gui(QWidget):
    def __init__(self):
        super(Gui, self).__init__()
        self.start()

    def start(self):
        # 所有的label
        labels = [
            QLabel('标题'),
            QLabel('作者'),
            QLabel('内容'),
        ]

        # 所有的行编辑器
        line_edits = [
            QLineEdit(),
            QLineEdit(),
        ]

        # 所有的多行编辑器
        text_edits = [
            QTextEdit()
        ]

        # 实例化表格布局
        grid = QGridLayout()
        # 设置组件之间的空格为10个像素
        grid.setSpacing(10)

        # 放置第一行的组件,没有跨度
        grid.addWidget(labels[0], 1, 0)
        grid.addWidget(line_edits[0], 1, 1)

        # 放置第二行的组件,也没有跨度
        grid.addWidget(labels[1], 2, 0)
        grid.addWidget(line_edits[1], 2, 1)

        # 放置第三行的组件,组件在row方向上有跨度,\
        # 跨度是row跨5行(是前面的5倍),column跨1行(和前面一样了)
        grid.addWidget(labels[2], 3, 0)
        grid.addWidget(text_edits[0], 3, 1, 5, 1)

        # 将QWidget的布局设置成grid布局
        self.setLayout(grid)

        # 设置具体的位置和大小
        self.setGeometry(300, 300, 350, 300)
        self.setWindowTitle('gird跨多行')
        self.show()


win = QApplication(sys.argv)
gui = Gui()
sys.exit(win.exec_())

运行结果:


image.png

相关文章

  • PuQt5 表格布局深入:让组件可以跨度多行多列

    重点是 一个grid布局的setSpacing方法,作用是设置各个组件之间的间隙(空格),然后是grid布局的ad...

  • 前端如何实现表格布局

    实现效果 详细实现思路 表格整体布局为:五行四列,部分单元格占据多行或者多列。表格的标题是使用caption标签,...

  • 六、表格布局TableLayout

    表格布局由TableLayout所代表,表格布局采用行、列的形式来管理UI组件,TableLayout并不需要明确...

  • Masonry多行多列布局

    这是我写在自定义视图中的布局,请根据需要做相应调整,核心代码已贴出

  • WPS 表格 - 快速选中多行、多列、多行和多列

    方法1:使用shift键 鼠标选中某个单元格,按住shift键,然后鼠标点击另外一个单元单元格。 方法2:在A上面...

  • CSS Grid和Flexbox

    Flexbox(弹性盒)用于一维布局 —— 也就是行或者列. 网格用于二维布局 —— 也就是多行多列.https:...

  • LaTeX表格tabular合并多行、多列

    1.说明 合并多列用命令\multicolumn,合并多行需要引入宏包\usepackage{multirow},...

  • 鸿蒙ListContainer 多行多列

    鸿蒙开发 列表 ListContainer 目前是不支持多行多列的,不过开发者可以自己实现效果图: 布局代码

  • css

    一:布局 浮动:做文字环绕效果 弹性盒:单行或单列布局 网格:多行多列布局 1、弹性盒 详细文档见MDN[http...

  • 看懂UDTF写法

    UDTF函数,表生成函数,他可以把一行打成多行多列,也可以打成一行多列,一列多行。比起UDAF,UDTF更好理解一...

网友评论

      本文标题:PuQt5 表格布局深入:让组件可以跨度多行多列

      本文链接:https://www.haomeiwen.com/subject/kghtphtx.html