PyQt5 笔记(01):嵌套布局

 

PyQt5 有四种布局:水平(QHBoxLayout)、竖直(QVBoxLayout)、网格(QGridLayout)、表单(QFormLayout)
在窗体中单一的布局应该不难,但若是比较复杂的布局,一般涉及到布局的嵌套,这就头疼了。

本文的四个知识点:
1. 布局不能直接嵌套(如果我错了,欢迎指正!)
2. 内层的布局必须先“附着”在一个空 QWidget
3. 然后把这个“承载”着内层布局的空部件添加至外层布局
4. 最后,别忘记把全局布局“附着”到窗体本尊

 

0. 先看效果图

下面对布局进行分析

 

1. 全局布局分析

全局布局使用了一个水平布局

wlayout = QtWidgets.QHBoxLayout()

 

2. 局部布局分析

四个局部布局分别使用了水平布局、竖直布局、网格布局、表单布局

hlayout = QtWidgets.QHBoxLayout()
vlayout = QtWidgets.QVBoxLayout()
glayout = QtWidgets.QGridLayout()
flayout = QtWidgets.QFormLayout()

 

到这里,其实开始时我产生了一个很自然,但是错误的想法:把四个局部布局直接添加到全局布局内:

wlayout.addWidget(hlayout)
wlayout.addWidget(vlayout)
wlayout.addWidget(glayout)
wlayout.addWidget(flayout)

报错信息提示:addWidget() 参数必须为 QWidget 类型!

这给了我启示:

 

先准备四个 QWidget: hwg, vwg, gwg, fwg

hwg = QtWidgets.QWidget()
vwg = QtWidgets.QWidget()
gwg = QtWidgets.QWidget()
fwg = QtWidgets.QWidget()

 

然后用这四个 QWidget 分别去设置前面四个局部布局

hwg.setLayout(hlayout)
vwg.setLayout(vlayout)
gwg.setLayout(glayout)
fwg.setLayout(flayout)

 

再把这四个 QWidget 部件添加至全局变量

wlayout.addWidget(hwg)
wlayout.addWidget(vwg)
wlayout.addWidget(gwg)
wlayout.addWidget(fwg)

 

最后一步,把全局布局应用到窗体本尊

self.setLayout(wlayout)

 

 

3. 完整代码

from PyQt5 import QtWidgets  

class MyWindow(QtWidgets.QWidget):  

    def __init__(self):
        super().__init__()
        self.setWindowTitle('PyQt5布局示例')

        # 开始:
        wlayout = QtWidgets.QHBoxLayout() # 全局布局(1个):水平

        hlayout = QtWidgets.QHBoxLayout() # 局部布局(4个):水平、竖直、网格、表单
        vlayout = QtWidgets.QVBoxLayout()
        glayout = QtWidgets.QGridLayout()
        flayout = QtWidgets.QFormLayout()

        hlayout.addWidget(QtWidgets.QPushButton(str(1))) # 局部布局添加部件(例如:按钮)
        hlayout.addWidget(QtWidgets.QPushButton(str(2)))
        vlayout.addWidget(QtWidgets.QPushButton(str(3)))
        vlayout.addWidget(QtWidgets.QPushButton(str(4)))
        glayout.addWidget(QtWidgets.QPushButton(str(5)),0,0)
        glayout.addWidget(QtWidgets.QPushButton(str(6)),0,1)
        glayout.addWidget(QtWidgets.QPushButton(str(7)),1,0)
        glayout.addWidget(QtWidgets.QPushButton(str(8)),1,1)
        flayout.addWidget(QtWidgets.QPushButton(str(9)))
        flayout.addWidget(QtWidgets.QPushButton(str(10)))
        flayout.addWidget(QtWidgets.QPushButton(str(11)))
        flayout.addWidget(QtWidgets.QPushButton(str(12)))

        hwg = QtWidgets.QWidget() # 准备四个部件
        vwg = QtWidgets.QWidget()
        gwg = QtWidgets.QWidget()
        fwg = QtWidgets.QWidget()

        hwg.setLayout(hlayout) # 四个部件设置局部布局
        vwg.setLayout(vlayout)
        gwg.setLayout(glayout)
        fwg.setLayout(flayout)

        wlayout.addWidget(hwg) # 四个部件加至全局布局
        wlayout.addWidget(vwg)
        wlayout.addWidget(gwg)
        wlayout.addWidget(fwg)

        self.setLayout(wlayout) # 窗体本尊设置全局布局

if __name__=="__main__":
    import sys    

    app = QtWidgets.QApplication(sys.argv)
    win = MyWindow()
    win.show()
    sys.exit(app.exec_())   

 

时间: 2024-09-20 12:19:30

PyQt5 笔记(01):嵌套布局的相关文章

PyQt5 笔记(02):嵌套布局

如前一篇笔记,我们还是只讨论两层嵌套布局的情况. 前面的布局有一个缺点:有三个内层布局,则需要三个空部件.那若有十个内层布局呢?显然会让人不舒服. 刚才在玩 Qt Designer 时,发现了一个更好的办法,不管有多少个内层布局,只需要一个空部件.   一.过程分析: 1. 先准备一个全局部件,用于"承载"全局布局 # 全局部件(注意参数 self),用于"承载"全局布局 wwg = QWidget(self)   2. 再定义全局布局 wl = QVBoxLayo

android 嵌套布局出现width问题 不知n道什么原因

问题描述 android 嵌套布局出现width问题 不知n道什么原因 Attribute "android:layout_width" was already specified for element "RelativeLayout". 解决方案 同一个RelativeLayout中定义了2遍android:layout_width 解决方案二: 我也是醉了-------- 解决方案三: 感觉提示不是很明显嘛,你好好看看,还不是多写了 解决方案四: 你写了两遍a

【Andorid X 项目笔记】嵌套Fragment的使用(5)

前言  之前的文章有介绍ActivityGroup,不少人问嵌套使用的问题,同样的需求在Fragment中也存在,幸好在最新的Android support 包已经支持这一特性!这里就跳过Fragment的介绍,需要注意的是TabActivity已经被标记为弃用(deprecated).   声明 欢迎转载,但请保留文章原始出处:) 博客园:http://www.cnblogs.com 农民伯伯: http://www.cnblogs.com/over140/    正文 一.准备 关于最新的A

Android App中的多个LinearLayout嵌套布局实例解析_Android

在做android  UI布局时,用了LinearLayout嵌套,发现效果并不如我预料一般 查了下资料,说是要设置layout_weight属性 资料说得不是很清楚,也没仔细看,就去弄,结果越弄越混乱. 于是静下心来,自己写xml测试,发现如下. 如果LinearLayout是最外面的一层,它是不会弹出layout_weight属性的, 换句话说最外层不能用layout_weight xml布局如下 <LinearLayout xmlns:android="http://schemas.

PyQt5 笔记(03):弹出窗口大全

本文实现了PyQt5个各种弹出窗口:输入框.消息框.文件对话框.颜色对话框.字体对话框.自定义对话框 其中,为了实现自定义对话框的返回值,使用了信号/槽   本文基于 windows 7 + python 3.4   效果图:     取得弹出窗口的返回值     全部代码:   from PyQt5.QtWidgets import * from PyQt5.QtCore import Qt, pyqtSignal, QTimer class MyWindow(QWidget): def __

restful 笔记01

restful 笔记 如何保持可见性? (a)使用HTTP方法(例如GET,POST,PUT)时,其语义要与HTTP所规定的语义保持一致,并添加适当的标头来描述请求和响应. (b)使用适当的状态码和状态消息,以便代理,缓存和客户端可以判断请求的结果.状态码是一个整数,状态消息是文本   如何保证安全性和幂等性? 实现GET,OPTIONS 和HEAD 方法时,不要引起任何副作用.当客户端重新提交一个GET,HEAD,OPTIONS,PUT或DELETE请求时,确保服务器提供同样的表述形式,并发情

ExtJs学习笔记(17)_table布局

table布局顾名思义,就是象table表格一样的布局 <script type="text/javascript"> Ext.onReady(function() { var win = new Ext.Window({ title: "table Layout", height: 210, width: 290, plain: true, bodyStyle: 'padding:15px', layout: 'table', layoutConfig

ExtJs学习笔记(16)_Form布局

这是最重要的一个布局,几乎所有的表单界面都可以采用form布局,详细的用法本文不作讨论(可以查阅官方API文档),这里只给出一个简单的示例 <script type="text/javascript"> Ext.onReady(function() { var win = new Ext.Window({ title: "form Layout", height: 150, width: 230, plain: true, bodyStyle: 'pad

ExtJs学习笔记(15)_fit布局

fit布局很好理解,容器内的组件会自动充满整个容器 <script type="text/javascript"> Ext.onReady(function() { var win = new Ext.Window({ title: "fit Layout", height: 200, width: 200, plain: true, layout: 'fit', items: { html:"这就是内容区,会自动充满容器,要注意的事,通常fi