QT学习笔记:界面布局layout

界面布局(layout)是画界面时非常重要的一个环节。我这里就从一个实际的例子出发,讲解怎么用Qt Creator工具进行界面布局。

我们假设画这么一个类似postMan的http测试客户端工具:

 1、用Qt Creator创建项目

设置窗口title为:HTTP接口测试, 窗体尺寸为800*700。

2、先不考虑layout,用Qt Creator拖拉出整体界面。

3、布局(layout) 

(1)几种常用的布局方法

 一般只用Vertical Layout、Horizontal Layout和Spacer 就可以完成大多数界面的布局。

 (2)布局操作1

(2.1)

鼠标同时选中(点鼠标时,同时按住Ctrl键):第一排的3个控件 -- combox选择框、lineEdit输入框、发送按钮。

点鼠标右键,选择:布局 -- 水平布局。

(2.2)

这时,界面变成这样:

这时,鼠标选中外面的红框,往右拖动,就可以拉大这个框框。

   (3)布局操作2

 鼠标选中:消息头、+-按钮,用水平布局。

(4)布局操作3

 鼠标选中:上面的整体和下面的文本框,采用“垂直布局”。

(5)布局操作4

 鼠标选中“消息体”和下面的“文本框”,采用“垂直布局”。

(6)布局操作5

鼠标选中:左边的整体 -- 1,中间的“垂直线” -- 2,最右边的整体 -- 3。采用水平布局。

然后把控件调整到合适的尺寸。

 (7)布局操作6

现在,我鼠标选中“MainWindow”,然后点鼠标右键,选择布局 -- “垂直”布局。操作完成后,界面成这样了:

到这里为止,布局基本算完成了。下面我们执行下程序,看看界面的效果。我们可以看到,现在无论怎样缩放窗体,窗体里的控件都会跟着一起缩放。

如果读者还是看不太明白,建议好好地看下参考里的视频。(视频作者不是我)

参考:

(1)Python Qt 图形界面编程 - PySide2 PyQt5 PyQt PySide

  • 0
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
为了使更多的Qt初学者能尽快入门Qt,也为了QtQt Creator的快速普及,我们花费大量精力写出了这一系列教程。虽然教程的知识可能很浅显,虽然教程的语言可能不规范,但是它却被数十万网友所认可。我们会将这一系列教程一直写下去,它将涉及Qt的方方面面 一、Qt Creator的安装和hello world程序的编写 二、Qt Creator编写多窗口程序 三、Qt Creator登录对话框 四、Qt Creator添加菜单图标 五、Qt Creator布局管理器的使用 六、Qt Creator实现文本编辑 七、Qt Creator实现文本查找 八、Qt Creator实现状态栏显示 九、Qt Creator中鼠标键盘事件的处理实现自定义鼠标指针 十、Qt Creator中实现定时器和产生随机数 十一、Qt 2D绘图(一)绘制简单图形 十二、Qt 2D绘图(二)渐变填充 十三、Qt 2D绘图(三)绘制文字 十四、Qt 2D绘图(四)绘制路径 十五、Qt 2D绘图(五)显示图片 十六、Qt 2D绘图(六)坐标系统 十七、Qt 2D绘图(七)Qt坐标系统深入 十八、Qt 2D绘图(八)涂鸦板 十九、Qt 2D绘图(九)双缓冲绘图简介 二十、Qt 2D绘图(十)图形视图框架简介 二十一、Qt数据库(一)简介 二十二、Qt数据库(二)添加MySQL数据库驱动插件 二十三、Qt数据库(三)利用QSqlQuery类执行SQL语句(一) 二十四、Qt数据库(四)利用QSqlQuery类执行SQL语句(二) 二十五、Qt数据库(五)QSqlQueryModel 二十六、Qt数据库(六)QSqlTableModel 二十七、Qt数据库(七)QSqlRelationalTableModel 二十八、Qt数据库(八)XML(一) 二十九、Qt数据库(九)XML(二) 三十、Qt数据库(十)XML(三) 三十一、Qt 4.7.0及Qt Creator 2.0 beta版安装全程图解 三十二、第一个Qt Quick程序(QML程序) 三十三、体验QML演示程序 三十四、Qt Quick Designer介绍 三十五、QML组件 三十六、QML项目之Image和BorderImage 三十七、Flipable、Flickable和状态与动画 三十八、QML视图 三十九、QtDeclarative模块 四十、使用Nokia Qt SDK开发Symbian和Maemo终端软件 四十一、Qt网络(一)简介 四十二、Qt网络(二)HTTP编程 四十三、Qt网络(三)FTP(一) 四十四、Qt网络(四)FTP(二) 四十五、Qt网络(五)获取本机网络信息 四十六、Qt网络(六)UDP 四十七、Qt网络(七)TCP(一) 四十八、Qt网络(八)TCP(二)

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值