admin管理员组

文章数量:1664590

基础信息
  • 平台:window 10

  • QT版本
    :5.14.2

  • 时间:2024.08.25

  • 本工程是QLayout专题,使用UI文件创建一个登陆窗体

  • 本例程原始资料来源于B站,UP主“爱编程的大丙”的视频教程《QT开发编程-入门基础教程QT5–6.2窗口布局举例-制作一个登陆界面》

  • 本笔记,用于实践上述例程,并进行笔记整理,提取最重要的干货信息。

创建工程

创建一个工程,工程名称=Login

使用默认的MainWindow工程即可

工程创建好以后,右键工程名称,添加一个“QT设计师界面类”,注意不要选错。


一般登陆窗口用对话框类即可。“QT设计师界面类”,选择使用不带按钮的即可。

新建的“QT设计师界面类”,名称=Login

控件布局

重点来临:研究QT的布局,要掌握一些最基本的知识,如水平布局,垂直布局,网络布局。在我看完了一本《QT5开发及实例》,并且手敲了一些代码,对QT有了一个基本的认识后,对一些知识点的理解和掌握,与脑海中想象的有偏差,这也是我想做几个练手的小例子来加深理解的原因。

用实战来纠正脑海中的偏差。

QT中的布局,就是这样一个例子。拖一拖、点一点、会把人搞蒙圈,这一点对入门的新手不太友好,还是要学习一下的。使用C++或C#在VS中开发,相比来说对新手要友好多了。

  • 给登陆界面设计一个标题,插入一个QLabel,起名叫“密码”,再把这个QLabel放入一个Widget中。如下2图:


  • 把QLable拖入到Widget中,未进行任何布局时,是下面的样子。

请注意:不要想当然的、惯性思维的去手动去调整位置,停下来,不要动!

请注意:不要想当然的、惯性思维的去手动去调整位置,停下来,不要动!

请注意:不要想当然的、惯性思维的去手动去调整位置,停下来,不要动!

  • 观察此时,右侧对象列表的状态,在未进行任何布局的情况下,图标右下角有一个红色的禁止图标。如下图:
  • 点击工具栏中的“水平布局”图标,QT会自动调整控件在Widget内水平布局,自动排列,无需手动操作。

  • “水平”布局,如下图所示,注意观察右侧红色禁止图标消失了,更新变成了水平布局的图标。

登陆窗口中的其它控件,如用户名、密码、输入框QLineEdit、单选按钮QRadioButton、复选框QCheckBox、按钮QPushButton等,不再赘述,见下图。

特别注意:用户名及输入框,和密码及输入框,请采用“网格布局”。

这相当于2行2列的矩阵,想像一下excel表格,然后把这4个控件,放入到了这2行2列的位置中去。网格布局,会使用户名的输入框与密码输入框是对齐的状态。无论窗体如何拉伸,它们都是对齐的。

  • 先中5个水平对齐,再点击工具栏的“垂直布局”,把5个水平布局的Widget容器再垂直布局,如下图所示。

这怎么这么难看?Q

T是如何处理左对齐、居中、右对齐的?

QT是如何处理控件间的间距的?

QT是如何处理窗体在拉伸时,控件的布局的?

重点来临:

“水平空格”和“垂直空格”来解决此问题。

好多网友也称“水平弹簧”、“垂直弹簧”

还有直接叫“弹簧”的、叫“刀哥”的。高手在民间啊~!

“弹簧”登场后,所见即所得,知道左对齐、居中、右对齐是怎么来的了吧~!一根弹簧往一侧挤,2根弹簧往中间挤,这下,不难理解了。

居中也不是问题了,Ctrl+R运行后,拉伸窗体看一看效果~!

弹簧可以设置sizeType,默认是Expanding扩展的,可以设置为Fixed固定的,然后再指定宽度,这就是设计控件间间距的方法。设置为FIxed后,窗体拉伸,控件间的间距保持不变。

扩展的,可以设置为Fixed固定的,然后再指定宽度,这就是设计控件间间距的方法。设置为FIxed后,窗体拉伸,控件间的间距保持不变。

本文标签: 实例窗口文件QTUI