PyQt5每天必学之布局管理


Posted in Python onApril 19, 2018

在GUI编程中有一个不容忽视的部分,那就是布局管理。布局管理掌控着我们的控件在应用程序窗口如何摆放。布局管理可以通过两种方式来完成。我们可以使用绝对定位或布局类两种方法控制程序窗口中的控件位置。

绝对定位

每个控件按程序员指定的位置放置。当您使用绝对定位,我们要了解以下限制:

  • 如果我们调整窗口的大小控件的大小和位置保持不变
  • 在不同平台上应用程序看起来可能会不同
  • 更改字体可能会破坏应用程序的布局
  • 如果决定改变布局,我们必须每个控件彻底的加以修改,这是繁琐和耗时的

下面的例子就是控件的绝对坐标定位方式。

#!/usr/bin/python3
# -*- coding: utf-8 -*-

"""
PyQt5 教程

这个例子显示了在窗口中使用绝对定位的三个标签。

作者:我的世界你曾经来过
博客:http://blog.csdn.net/weiaitaowang
最后编辑:2016年7月31日
"""

import sys
from PyQt5.QtWidgets import QApplication, QWidget, QLabel

class Example(QWidget):

 def __init__(self):
 super().__init__()

 self.initUI()

 def initUI(self):

 lbl1 = QLabel('我的世界你曾经来过', self)
 lbl1.move(15, 10)

 lbl2 = QLabel('CSND博客', self)
 lbl2.move(35, 40)

 lbl3 = QLabel('程序员', self)
 lbl3.move(55, 70)

 self.setGeometry(300, 300, 250, 150)
 self.setWindowTitle('绝对定位') 
 self.show()

if __name__ == '__main__':

 app = QApplication(sys.argv)
 ex = Example()
 sys.exit(app.exec_())

在我们的例子中使用的都是标签(Label)。我们通过提供x和y坐标值定位它们。坐标系的原点是控件的左上角。 x值增长是由左到右。 y值增长是从上到下。

lbl1 = QLabel('我的世界你曾经来过', self)
lbl1.move(15, 10)

标签控件被放置在 x=15 和 y=10。

程序执行后

PyQt5每天必学之布局管理

Box layout盒子布局

布局管理使用布局类的方式更加灵活、实用。它是将一个控件放在窗口中的首选方式。QHBoxLayout和QVBoxLayout分别是水平和垂直对齐控件的基本布局类。

试想一下,我们希望把两个按钮在程序的右下角。要创建这样一个布局,我们可以使用一横一纵两个框。要创造必要的空余空间,我们将增加一个拉伸因子(stretch factor)。

#!/usr/bin/python3
# -*- coding: utf-8 -*-

"""
PyQt5 教程

在这个例子中,我们在窗口的右下角放置两个按钮。

作者:我的世界你曾经来过
博客:http://blog.csdn.net/weiaitaowang
最后编辑:2016年7月31日
"""

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

class Example(QWidget):

 def __init__(self):
 super().__init__()

 self.initUI()

 def initUI(self):

 okButton = QPushButton('确定')
 cancelButton = QPushButton('取消')

 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, 350, 150)
 self.setWindowTitle('Box布局') 
 self.show()

if __name__ == '__main__':

 app = QApplication(sys.argv)
 ex = Example()
 sys.exit(app.exec_())

该示例将两个按钮放在窗口的右下角。当我们调整应用程序窗口的大小时,他们是固定在右下角的。我们同时使用HBoxLayout 和QVBoxLayout布局。

okButton = QPushButton('确定')
 cancelButton = QPushButton('取消')

这里我们创建了两个按钮。

hbox = QHBoxLayout()
hbox.addStretch(1)
hbox.addWidget(okButton)
hbox.addWidget(cancelButton)

我们创建了一个水平box布局,增加拉伸因子(addStretch),添加(addWidget)两个按钮。在添加两个按钮之前增加了一个拉伸因子,这会将两个按钮推到窗口右侧。

vbox = QVBoxLayout()
vbox.addStretch(1)
vbox.addLayout(hbox)

要得到我们想要的布局,还需将横向布局放入垂直的布局中。在垂直框上的拉伸因子会将水平框包括里面的控件推至窗口的底部。

self.setLayout(vbox)

最后,我们设置窗口的主布局。

程序执行后

PyQt5每天必学之布局管理

QGridLayout网格布局

最经常使用的布局类是网格布局。这种布局将该空间分成行和列。要创建一个网格布局,我们使用QGridLayout 的类。

#!/usr/bin/python3
# -*- coding: utf-8 -*-

"""
PyQt5 教程

在这个例子中,我们使用网格布局创建一个计算器的框架。

作者:我的世界你曾经来过
博客:http://blog.csdn.net/weiaitaowang
最后编辑:2016年7月31日
"""

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

class Example(QWidget):

 def __init__(self):
 super().__init__()

 self.initUI()

 def initUI(self):

 grid = QGridLayout() 
 self.setLayout(grid)

 names = ['Cls', 'Bck', '', 'Close', 
 '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 = QPushButton(name)
  grid.addWidget(button, *position)

 self.move(300, 150)
 self.setWindowTitle('计算器') 
 self.show()

if __name__ == '__main__':

 app = QApplication(sys.argv)
 ex = Example()
 sys.exit(app.exec_())

在我们的例子中,我们将创建的按钮控件放在网格中。

grid = QGridLayout() 
self.setLayout(grid)

实例化 QGridLayout 并设置应用程序窗口的布局。

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

这是以后要用到的按钮标签。

positions = [(i, j) for i in range(5) for j in range(4)]

x我们创建了网格位置的列表。

for position, name in zip(positions, names):

  if name == '':
  continue
  button = QPushButton(name)
  grid.addWidget(button, *position)

创建按钮并添加(addWidget)到布局中。

程序执行后

PyQt5每天必学之布局管理

扩展网格布局

窗口中的控件可以跨越网格中的多个列或行。在下面的例子中,我们说明这一点。

#!/usr/bin/python3
# -*- coding: utf-8 -*-

"""
PyQt5 教程

在这个例子中,我们使用GridLayout的跨行创建了一个更复杂的窗口布局。

作者:我的世界你曾经来过
博客:http://blog.csdn.net/weiaitaowang
最后编辑:2016年7月31日
"""

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

class Example(QWidget):

 def __init__(self):
 super().__init__()

 self.initUI()

 def initUI(self):

 title = QLabel('标题')
 author = QLabel('作者')
 review = QLabel('评论')

 titleEdit = QLineEdit()
 authorEdit = QLineEdit()
 reviewEdit = QTextEdit()

 grid =QGridLayout()
 grid.setSpacing(10)

 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, 350, 300)
 self.setWindowTitle('评论') 
 self.show()

if __name__ == '__main__':

 app = QApplication(sys.argv)
 ex = Example()
 sys.exit(app.exec_())

我们创建的程序中包含三个标签,两个单行文本输入框和一个文本编辑控件,使用QGridLayout布局。

grid =QGridLayout()
grid.setSpacing(10)

实例化网格布局和并设置设置间距。

grid.addWidget(reviewEdit, 3, 1, 5, 1)

添加一个控件到网格布局中,我们可以为这个控件使用行跨度或列跨度。在我们的例子中,我们要求reviewEdit控件跨度5行。

程序执行后

PyQt5每天必学之布局管理

在PyQt5教程的这一部分专门介绍了布局管理。后面将会介绍PyQt5的事件相关内容。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Python 相关文章推荐
python刷投票的脚本实现代码
Nov 08 Python
玩转python爬虫之爬取糗事百科段子
Feb 17 Python
Python连接SQLServer2000的方法详解
Apr 19 Python
Flask之flask-script模块使用
Jul 26 Python
tensorflow 恢复指定层与不同层指定不同学习率的方法
Jul 26 Python
python shutil文件操作工具使用实例分析
Dec 25 Python
TensorFlow tensor的拼接实例
Jan 19 Python
TensorFlow加载模型时出错的解决方式
Feb 06 Python
基于Python实现视频的人脸融合功能
Jun 12 Python
python进行二次方程式计算的实例讲解
Dec 06 Python
python使用pygame创建精灵Sprite
Apr 06 Python
Python Pandas 删除列操作
Mar 16 Python
PyQt5每天必学之创建窗口居中效果
Apr 19 #Python
PyQt5每天必学之弹出消息框
Apr 19 #Python
详谈python3中用for循环删除列表中元素的坑
Apr 19 #Python
PyQt5每天必学之关闭窗口
Apr 19 #Python
python实现在IDLE中输入多行的方法
Apr 19 #Python
python贪婪匹配以及多行匹配的实例讲解
Apr 19 #Python
PyQt5每天必学之工具提示功能
Apr 19 #Python
You might like
php通过baihui网API实现读取word文档并展示
2015/06/22 PHP
javascript实现多栏闭合展开式广告位菜单效果实例
2015/08/05 Javascript
JavaScript操作select元素和option的实例代码
2016/01/29 Javascript
基于javascript实现句子翻牌网页版小游戏
2016/03/23 Javascript
JavaScript必知必会(三) String .的方法来自何方
2016/06/08 Javascript
bootstrap中模态框、模态框的属性实例详解
2017/02/17 Javascript
d3.js实现立体柱图的方法详解
2017/04/28 Javascript
jquery实现倒计时小应用
2017/09/19 jQuery
详解Webstorm 新建.vue文件支持高亮vue语法和es6语法
2017/10/26 Javascript
详解Vue用自定义指令完成一个下拉菜单(select组件)
2017/10/31 Javascript
再谈Angular4 脏值检测(性能优化)
2018/04/23 Javascript
npm全局模块卸载及默认安装目录修改方法
2018/05/15 Javascript
Vue实现侧边菜单栏手风琴效果实例代码
2018/05/31 Javascript
详解小程序原生使用ES7 async/await语法
2018/08/06 Javascript
Angular8基础应用之表单及其验证
2019/08/11 Javascript
layui加载表格,绑定新增,编辑删除,查看按钮事件的例子
2019/09/06 Javascript
Js Snowflake(雪花算法)生成随机ID的实现方法
2020/08/26 Javascript
vue中watch的用法汇总
2020/12/28 Vue.js
Python基于pygame实现的font游戏字体(附源码)
2015/11/11 Python
在windows下快速搭建web.py开发框架方法
2016/04/22 Python
Python人脸识别初探
2017/12/21 Python
python多线程之事件Event的使用详解
2018/04/27 Python
解决nohup重定向python输出到文件不成功的问题
2018/05/11 Python
python连接、操作mongodb数据库的方法实例详解
2019/09/11 Python
pytorch cuda上tensor的定义 以及减少cpu的操作详解
2020/06/23 Python
推荐10个HTML5响应式框架
2016/02/25 HTML / CSS
一家专门做特卖的网站:唯品会
2016/10/09 全球购物
日本卡普空电视游戏软件公司官方购物网站:e-CAPCOM
2018/07/17 全球购物
材料专业大学毕业生自荐书
2014/07/02 职场文书
年终晚会活动方案
2014/08/21 职场文书
幼儿园园长六一致辞
2015/07/31 职场文书
中学团支部工作总结
2015/08/13 职场文书
2016年清明节寄语
2015/12/04 职场文书
Springboot如何同时装配两个相同类型数据库
2021/11/17 Java/Android
基于PostgreSQL/openGauss 的分布式数据库解决方案
2021/12/06 PostgreSQL
Python OpenCV超详细讲解基本功能
2022/04/02 Python