备案控制台
探索云世界
开发者社区 开发与运维 文章 正文

Python Qt GUI设计：窗口布局管理方法【强化】（基础篇—6）

2021-12-20 330
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介： Python Qt GUI设计：窗口布局管理方法【强化】（基础篇—6）

目录

1、 水平布局类（QHBoxLayout）


2、垂直布局类（QVBoxLayout）


3、网格布局类（QGridLayout）


3.1、单一的网络布局


3.2、跨越行、列的网络布局


4、表单布局类（QFormLayout）


5、嵌套布局


5.1、在布局中添加其他布局


5.2、在控件中添加布局


5.3、QSplitter布局管理器


在Python Qt GUI设计：窗口布局管理方法【基础篇】（基础篇—5）文章中，聊到了如何使用Qt Designer进行窗口布局管理，其实在Qt Designer中可以非常方便进行窗口布局管理设计，本篇博文在4种窗口布局方式基础上继续深入聊聊API函数~


在PyQt 5中有四种布局方式：水平布局、垂直布局、网格布局、表单布局，以及两种布局方法，即 addLayout()和addWidget()，其中 addLayout()用于在布局中插入子布局，addWidget()用于在布局中插入控件。


四种布局方式对应四个布局类：


水平布局类（QHBoxLayout），可以把所添加的控件在水平方向上依次排列；

垂直布局类（QVBoxLayout），可以把所添加的控件在垂直方向上依次排列；

网格布局类（QGridLayout），可以把所添加的控件以网格的形式排列；

表单布局类（QFormLayout），可以把所添加的控件以两列的形式排列。

布局类及其子类的继承关系如下图所示：


image.png


1、 水平布局类（QHBoxLayout）

采用QHBoxLayout类，按照从左到右的顺序来添加控件。QHBoxLayout类中的常用方法如下表所示：


image.png


在创建QHBoxLayout布局时用到的对齐方式参数如下表所示：


image.png


通过一个例子，了解水平布局使用，示例代码如下所示：


import sys
from PyQt5.QtWidgets import QApplication  ,QWidget ,QHBoxLayout , QPushButton
from PyQt5.QtCore import Qt 
class Winform(QWidget):
  def __init__(self,parent=None):
  super(Winform,self).__init__(parent)
  self.setWindowTitle("水平布局管理例子") 
  # 水平布局按照从左到右的顺序进行添加按钮部件。
  hlayout = QHBoxLayout()  
  hlayout.addWidget(QPushButton(str(1)))
  hlayout.addWidget(QPushButton(str(2)))
  hlayout.addWidget(QPushButton(str(3)))
  hlayout.addWidget(QPushButton(str(4)))        
  hlayout.addWidget(QPushButton(str(5)))    
  #设置控件间的间距
  hlayout.setSpacing( 0 ) 
  self.setLayout(hlayout)   
if __name__ == "__main__":  
  app = QApplication(sys.argv) 
  form = Winform()
  form.show()
  sys.exit(app.exec_())

运行效果如下所示：


image.png


2、垂直布局类（QVBoxLayout）

采用QVBoxLayout类，按照从上到下的顺序添加控件。QHBoxLayout和QVBoxLayout类都继承自QBoxLayout类，所以常用方法也是相同的。


通过一个例子，了解垂直布局使用，示例代码如下所示：


import sys
from PyQt5.QtWidgets import QApplication  ,QWidget ,QVBoxLayout , QPushButton
class Winform(QWidget):
  def __init__(self,parent=None):
  super(Winform,self).__init__(parent)
  self.setWindowTitle("垂直布局管理例子") 
  self.resize(330, 150)  
        # 垂直布局按照从上到下的顺序进行添加按钮部件。
  vlayout = QVBoxLayout()
  vlayout.addWidget( QPushButton(str(1)))
  vlayout.addWidget( QPushButton(str(2)))
  vlayout.addWidget( QPushButton(str(3)))
  vlayout.addWidget( QPushButton(str(4)))
  vlayout.addWidget( QPushButton(str(5)))
  self.setLayout(vlayout)   
if __name__ == "__main__":  
  app = QApplication(sys.argv) 
  form = Winform()
  form.show()
  sys.exit(app.exec_())

运行效果如下所示：  


image.png


3、网格布局类（QGridLayout）

QGridLayout（网格布局）是将窗口分隔成行和列的网格来进行排列。通常可以使用函数addWidget()将被管理的控件(Widget)添加到窗口中，或者使用addLayout()函数将布局(Layout)添加到窗口中。也可以通过addWidget()函数对所添加的控件设置行数和列数的跨越，最后实现网格占据多个窗格。


QGridLayout类中的常用方法如下表所示：


image.png


3.1、单一的网络布局

来做个单一网格布局的小案例，创建QGridLayout的实例，并设置为窗口的布局，创建按钮的标签列表，在网格中创建一个位置列表，创建按钮，并通过addWidget()方法添加到布局中，示例如下所示：


import sys
from PyQt5.QtWidgets import QApplication  ,QWidget  , QGridLayout, QPushButton
class Winform(QWidget):
  def __init__(self,parent=None):
  super(Winform,self).__init__(parent)
  self.initUI()
  def initUI(self):            
        #创建QGridLayout的实例，并设置为窗口的布局
  grid = QGridLayout()  
  self.setLayout(grid)  
        #创建按钮的标签列表
  names = ['Cls', 'Back', '', 'Close',  
                 '7', '8', '9', '/',  
                '4', '5', '6', '*',  
                 '1', '2', '3', '-',  
                '0', '.', '=', '+']  
        #在网格中创建一个位置列表
  positions = [(i,j) for i in range(5) for j in range(4)]  
        #创建按钮，并通过addWidget()方法添加到布局中
  for position, name in zip(positions, names):                
    if name == '':  
    continue  
    button = QPushButton(name)  
    grid.addWidget(button, *position)  
  self.move(300, 150)  
  self.setWindowTitle('网格布局管理例子')  
if __name__ == "__main__":  
  app = QApplication(sys.argv) 
  form = Winform()
  form.show()
  sys.exit(app.exec_())

运行效果如下所示：  


image.png


3.2、跨越行、列的网络布局

本示例将实现跨越行、列的网络单元格设计，示例如下所示：


import sys
from PyQt5.QtWidgets import (QWidget, QLabel, QLineEdit,   QTextEdit, QGridLayout, QApplication)  
class Winform(QWidget):
  def __init__(self,parent=None):
  super(Winform,self).__init__(parent)
  self.initUI()
  def initUI(self):            
  titleLabel = QLabel('标题')  
  authorLabel = QLabel('提交人')  
  contentLabel = QLabel('申告内容')  
  titleEdit = QLineEdit()  
  authorEdit = QLineEdit()  
  contentEdit = QTextEdit()  
  grid = QGridLayout()  
  grid.setSpacing(10)  
        #把titleLabel放在QGridLayout布局的第1行第0列。
  grid.addWidget(titleLabel, 1, 0)  
        #把titleEdit放在QGridLayout布局的第1行第1列。
  grid.addWidget(titleEdit, 1, 1)  
        #把authorLabel放在QGridLayout布局的第2行第0列。
  grid.addWidget(authorLabel, 2, 0)  
        #把authorEdit放在QGridLayout布局的第2行第1列。
  grid.addWidget(authorEdit, 2, 1)  
        #把contentLabel放在QGridLayout布局的第3行第0列。
  grid.addWidget(contentLabel, 3, 0)  
        #把contentEdit放在QGridLayout布局的第3行第1列，跨越5行1列。
  grid.addWidget(contentEdit, 3, 1, 5, 1)  
  self.setLayout(grid)   
  self.setGeometry(300, 300, 350, 300)  
  self.setWindowTitle('故障申告')
if __name__ == "__main__":  
  app = QApplication(sys.argv) 
  form = Winform()
  form.show()
  sys.exit(app.exec_())

运行效果如下所示：    


image.png


4、表单布局类（QFormLayout）

QFormLayout是label-field式的表单布局，顾名思义，就是实现表单方式的布局。


表单是提示用户进行交互的一种模式，其主要由两列组成：第一列用于显示信息，给用户提示，一般叫作label域;第二列需要用户进行选择或输入，一般叫作field域。label与field的关系就是label关联field。示例如下所示：


import sys
from PyQt5.QtWidgets import QApplication  ,QWidget ,QFormLayout , QLineEdit, QLabel
class Winform(QWidget):
  def __init__(self,parent=None):
  super(Winform,self).__init__(parent)
  self.setWindowTitle("表单布局管理例子") 
  self.resize(400, 100)  
  fromlayout = QFormLayout()
  labl1 = QLabel("标签1")
  lineEdit1 = QLineEdit()
  labl2 = QLabel("标签2")
  lineEdit2 = QLineEdit()
  labl3 = QLabel("标签3")
  lineEdit3 = QLineEdit()
  fromlayout.addRow(labl1, lineEdit1)
  fromlayout.addRow(labl2, lineEdit2)
  fromlayout.addRow(labl3, lineEdit3)
  self.setLayout(fromlayout)   
if __name__ == "__main__":  
  app = QApplication(sys.argv) 
  form = Winform()
  form.show()
  sys.exit(app.exec_())

运行效果如下所示：    


image.png


5、嵌套布局

在窗口中进行单一的布局并不难，但若是进行比较复杂的布局，就涉及布局的嵌套了，推荐使用Qt Designer的可视化管理工具来进行界面布局，可参见上篇博文。


image.png

Qt Designer中嵌套布局层级效果

本文仅介绍API函数实现嵌套布局的示例方法。


5.1、在布局中添加其他布局

整个例子，首先全局布局采用的是水平布局，局部布局采用的分别是水平布局、垂直布局、网格布局和表单布局，准备4个QWidget控件:hwg、vwg、gwg和formlayout，使用4个QWidget控件分别设置局部布局，接下来，将4个QWidget控件添加到全局变量中，最后，把全局布局应用到窗口本身。


示例效果如下所示：


image.png


实现代码如下所示：


import sys
from PyQt5.QtWidgets import QApplication  ,QWidget , QHBoxLayout,  QVBoxLayout,  QGridLayout ,  QFormLayout, QPushButton 
class MyWindow( QWidget):  
    def __init__(self):  
        super().__init__()
        self.setWindowTitle('嵌套布局示例')
        # 全局布局（1个）：水平
        wlayout =  QHBoxLayout() 
         # 局部布局（4个）：水平、竖直、网格、表单
        hlayout =  QHBoxLayout()
        vlayout =  QVBoxLayout()
        glayout = QGridLayout()
        formlayout =  QFormLayout()
        # 局部布局添加部件（例如：按钮）
        hlayout.addWidget( QPushButton(str(1)) ) 
        hlayout.addWidget( QPushButton(str(2)) )
        vlayout.addWidget( QPushButton(str(3)) )
        vlayout.addWidget( QPushButton(str(4)) )
        glayout.addWidget( QPushButton(str(5)) , 0, 0 )
        glayout.addWidget( QPushButton(str(6)) , 0, 1 )
        glayout.addWidget( QPushButton(str(7)) , 1, 0)
        glayout.addWidget( QPushButton(str(8)) , 1, 1)
        formlayout.addWidget( QPushButton(str(9))  )
        formlayout.addWidget( QPushButton(str(10)) )
        formlayout.addWidget( QPushButton(str(11)) )
        formlayout.addWidget( QPushButton(str(12)) )
        # 准备四个部件
        hwg =  QWidget() 
        vwg =  QWidget()
        gwg =  QWidget()
        fwg =  QWidget()
        # 四个部件设置局部布局
        hwg.setLayout(hlayout) 
        vwg.setLayout(vlayout)
        gwg.setLayout(glayout)
        fwg.setLayout(formlayout)
         # 四个部件加至全局布局
        wlayout.addWidget(hwg)
        wlayout.addWidget(vwg)
        wlayout.addWidget(gwg)
        wlayout.addWidget(fwg)
        # 窗体本体设置全局布局
        self.setLayout(wlayout) 
if __name__=="__main__":    
    app =  QApplication(sys.argv)    
    win = MyWindow()  
    win.show()  
    sys.exit(app.exec_())

这样的布局有一个缺点：4种局部布局需要4个空白控件，假如有10种局部布局，就需要10个空白控件。怎么解决这个问题呢? 这时候就需要在控件中添加布局。


5.2、在控件中添加布局

在控件中添加布局，可以不管有多少种局部布局，只需要一个空白控件，然后在这个空白控件中进行多种布局就可以实现嵌套布局的效果。


对5.1中的示例进行优化，先准备一个全局控件，用于添加全局布局，定义全局布局和4种局部布局，在局部布局中放置一些按钮控件，最后把4种局部布局添加到全局布局中。实现代码如下所示：


from PyQt5.QtWidgets import *
import sys   
class MyWindow(QWidget):  
  def __init__(self):  
  super().__init__()
  self.setWindowTitle('嵌套布局示例')
  self.resize(700, 200)
        # 全局部件（注意参数 self），用于"承载"全局布局
  wwg = QWidget(self)
         # 全局布局（注意参数 wwg）
  wl = QHBoxLayout(wwg)
  hlayout =  QHBoxLayout()
  vlayout =  QVBoxLayout()
  glayout = QGridLayout()
  formlayout =  QFormLayout()
         # 局部布局添加部件（例如：按钮）
  hlayout.addWidget( QPushButton(str(1)) )
  hlayout.addWidget( QPushButton(str(2)) )
  vlayout.addWidget( QPushButton(str(3)) )
  vlayout.addWidget( QPushButton(str(4)) )
  glayout.addWidget( QPushButton(str(5)) , 0, 0 )
  glayout.addWidget( QPushButton(str(6)) , 0, 1 )
  glayout.addWidget( QPushButton(str(7)) , 1, 0)
  glayout.addWidget( QPushButton(str(8)) , 1, 1)
  formlayout.addWidget( QPushButton(str(9))  )
  formlayout.addWidget( QPushButton(str(10)) )
  formlayout.addWidget( QPushButton(str(11)) )
  formlayout.addWidget( QPushButton(str(12)) )
        # 这里向局部布局内添加部件,将他加到全局布局
  wl.addLayout(hlayout)  
  wl.addLayout(vlayout)
  wl.addLayout(glayout)
  wl.addLayout(formlayout)       
if __name__=="__main__":    
  app = QApplication(sys.argv)    
  win = MyWindow()  
  win.show()  
  sys.exit(app.exec_())

5.3、QSplitter布局管理器

除了上面介绍的Layout布局管理，PyQt还提供了一个特殊的布局管理器：QSplitter，它可以动态地拖动子控件之间的边界，算是一个动态的布局管理器。


QSplitter 允许用户通过拖动子控件的边界来控制子控件的大小，并提供了一个处理拖曳子控件的控制器。


在QSplitter对象中各子控件默认是横向布局的，可以使用Qt.Vertical进行垂直布局。QSplitter类中的常用方法如下表所示：


image.png


通过一个例子，了解QSplitter布局的使用，在这个例子中，显示了使用两个QSplitter组织的两个QFrame控件。其中第一个QSplitter对象包含了一个QFrame对象和QTextEdit对象，并按照水平方向进行布局。第二个QSplitter对象添加了第一个QSplitter对象和另一个QFrame对象，并按照垂直方向进行布局。


示例效果如下所示：


image.png


示例代码如下所示：


from PyQt5.QtCore import *
from PyQt5.QtGui import *
from PyQt5.QtWidgets import *
class SplitterExample(QWidget):
  def __init__(self):
  super(SplitterExample, self).__init__()
  self.initUI()
  def initUI(self): 
  hbox = QHBoxLayout(self)
  self.setWindowTitle('QSplitter 布局例子')
  self.setGeometry(300, 300, 300, 200)         
  topleft = QFrame()
  topleft.setFrameShape(QFrame.StyledPanel)
  bottom = QFrame()
  bottom.setFrameShape(QFrame.StyledPanel)
  splitter1 = QSplitter(Qt.Horizontal)
  textedit = QTextEdit()
  splitter1.addWidget(topleft)
  splitter1.addWidget(textedit)
  splitter1.setSizes([100,200])
  splitter2 = QSplitter(Qt.Vertical)
  splitter2.addWidget(splitter1)
  splitter2.addWidget(bottom)
  hbox.addWidget(splitter2)
  self.setLayout(hbox)
if __name__ == '__main__':
  app = QApplication(sys.argv)
  demo = SplitterExample()
  demo.show()
  sys.exit(app.exec_())

文章知识点与官方知识档案匹配，可进一步学习相关知识


文章标签：
Python
数据可视化
API
关键词：
Python方法
Python管理
Qt方法
Python GUI
Qt窗口
不脱发的程序猿
目录
相关文章
众所周知
|
13天前
|
Python
python魔法方法如何应用
【4月更文挑战第12天】这个Python示例展示了类继承和方法重写。`Student`类继承自`Person`，并覆盖了`say_hello`方法。通过`super().__init__(name)`调用父类的`__init__`初始化`name`属性，`Student`添加了`age`属性，并在重写的`say_hello`中使用。创建`Student`实例`student`并调用其`say_hello`，输出定制的问候信息。
众所周知
19 1
同学小张
|
2天前
|
人工智能 Python
【Python实用技能】建议收藏：自动化实现网页内容转PDF并保存的方法探索（含代码，亲测可用）
【Python实用技能】建议收藏：自动化实现网页内容转PDF并保存的方法探索（含代码，亲测可用）
同学小张
20 0
阿文没烦恼
|
7天前
|
存储 关系型数据库 MySQL
Python搭建代理IP池实现存储IP的方法
Python搭建代理IP池实现存储IP的方法
阿文没烦恼
28 2
阿文没烦恼
|
7天前
|
Python
Python动态IP代理防止被封的方法
Python动态IP代理防止被封的方法
阿文没烦恼
26 3
阿文没烦恼
|
7天前
|
数据采集 存储 安全
python检测代理ip是否可用的方法
python检测代理ip是否可用的方法
阿文没烦恼
16 0
4as3qn2go3ure
|
8天前
|
数据可视化 测试技术 Python
在Python和R中使用交叉验证方法提高模型性能
在Python和R中使用交叉验证方法提高模型性能
4as3qn2go3ure
20 0
cuicuicuic
|
9天前
|
存储 监控 开发工具
对象存储OSS产品常见问题之python sdk中的append_object方法支持追加上传xls文件如何解决
对象存储OSS是基于互联网的数据存储服务模式，让用户可以安全、可靠地存储大量非结构化数据，如图片、音频、视频、文档等任意类型文件，并通过简单的基于HTTP/HTTPS协议的RESTful API接口进行访问和管理。本帖梳理了用户在实际使用中可能遇到的各种常见问题，涵盖了基础操作、性能优化、安全设置、费用管理、数据备份与恢复、跨区域同步、API接口调用等多个方面。
cuicuicuic
38 9
微芒不朽
|
9天前
|
Python
python面型对象编程进阶（继承、多态、私有化、异常捕获、类属性和类方法）（上）
python面型对象编程进阶（继承、多态、私有化、异常捕获、类属性和类方法）（上）
微芒不朽
51 0
wljslmz
|
14天前
|
机器学习/深度学习 人工智能 算法
AI人工智能在Python中构建回归器的原理、优缺点、应用场景和实现方法
【4月更文挑战第6天】
wljslmz
42 7
东方睿赢
|
14天前
|
安全 Python
python字典的内置方法
Python字典主要方法包括：`keys()`（返回所有键）、`values()`（返回所有值）、`items()`（返回所有键值对）、`get()`（安全取值，键不存在时返回默认值）、`setdefault()`（设置默认值）、`update()`（合并字典）、`pop()`（删除并返回值）、`clear()`（清空字典）、`copy()`（浅拷贝）、`fromkeys()`（新建字典并设置默认值）、`popitem()`（随机删除键值对）。
东方睿赢
8 0

热门文章

最新文章

  • 1
    【Qt 底层机制之图形渲染引擎】深入理解 Qt 的 渲染机制：从基础渲染到高级图形
  • 2
    【Qt 底层机制之信号和槽 】深入探究Qt信号和槽背后的原理
  • 3
    【Qt 并发 】理解Qt中事件循环与并发机制的协同工作
  • 4
    【Qt 底层之事件驱动系统】深入理解 Qt 事件机制：主事件循环与工作线程的交互探究，包括 QML 的视角
  • 5
    深入对比：Qt 的 QFile/QFileInfo 和与 C++17 Filesystem 和标准文件流 的细节剖析
  • 6
    【Qt 应用开发 】初步理解 Qt窗口中的模态性应用
  • 7
    Qt中实现界面回放的艺术：从理论到代码“ (“The Art of Implementing UI Playback in Qt: From Theory to Code
  • 8
    【Qt 元对象系统 01 】深入探索Qt的元对象系统：核心地位、功能与构成
  • 9
    基于Qt的简易PDF阅读器设计与实现
  • 10
    Qt编码之谜：乱码问题的成因与解决策略
  • 1
    Python用机器学习算法进行因果推断与增量、增益模型Uplift Modeling智能营销模型
    28
  • 2
    Python用RNN神经网络：LSTM、GRU、回归和ARIMA对COVID19新冠疫情人数时间序列预测
    42
  • 3
    PYTHON用时变马尔可夫区制转换（MARKOV REGIME SWITCHING）自回归模型分析经济时间序列
    13
  • 4
    数据分享|Python决策树、随机森林、朴素贝叶斯、KNN（K-最近邻居）分类分析银行拉新活动挖掘潜在贷款客户
    20
  • 5
    Python监控主机是否存活,并发报警邮件
    5
  • 6
    【Python实用技能】建议收藏：自动化实现网页内容转PDF并保存的方法探索（含代码，亲测可用）
    20
  • 7
    Python 妙用运算符重载——玩出“点”花样来（上）
    25
  • 8
    python 教你如何创建一个自定义库 colorlib.py
    17
  • 9
    Python 一步一步教你用pyglet制作汉诺塔游戏
    14
  • 10
    Python变量类型
    8

    • 相关课程

    更多
  • Python Web开发基础
  • Python开发基础入门
  • Python常用数据科学库
  • Python网络爬虫实战
  • Python完全自学手册图文教程
  • Python基础快速入门实战教程

    • 相关电子书

    更多
  • From Python Scikit-Learn to Sc
  • Data Pre-Processing in Python:
  • 双剑合璧-Python和大数据计算平台的结合

    • 相关实验场景

    更多
  • 用Python画圣诞树
  • 使用Python完成RDS数据开发及分析
  • 语言入门-1：环境构建
  • 前端开发基础2：VS Code和Edge的联动开发
  • 前端开发基础1：前端开发环境的安装和配置
  • 云端Python及基本操作

    • 推荐镜像

    更多
  • qt
  • msys2
  • eclipse
    • 下一篇
    部署LAMP环境（Alibaba Cloud Linux 3）