7、QI基础——布局管理器

简介: 7、QI基础——布局管理器

所谓 GUI 界面,归根结底,就是一堆组件的叠加。我们创建一个窗口,把按钮放上面,把图标放上面,这样就成了一个界面。在放置时,组件的位置尤其重要。我们必须要指定组件放在哪里,以便窗口能够按照我们需要的方式进行渲染。这就涉及到组件定位的机制。


Qt 提供了两种组件定位机制:绝对定位和布局定位。


绝对定位就是一种最原始的定位方法:给出这个组件的坐标和长宽值。

这样,Qt 就知道该把组件放在哪里以及如何设置组件的大小。但是这样做带来的一个问题是,如果用户改变了窗口大小,比如点击最大化按钮或者使用鼠标拖动窗口边缘,采用绝对定位的组件是不会有任何响应的。这也很自然,因为你并没有告诉 Qt,在窗口变化时,组件是否要更新自己以及如何更新。或者,还有更简单的方法:禁止用户改变窗口大小。但这总不是长远之计。


布局定位:你只要把组件放入某一种布局,布局由专门的布局管理器进行管理。当需要调整大小或者位置的时候,Qt 使用对应的布局管理器进行调整。

布局定位完美的解决了使用绝对定位的缺陷。


Qt 提供的布局中以下三种是我们最常用的:


QHBoxLayout:按照水平方向从左到右布局;

QVBoxLayout:按照竖直方向从上到下布局;

QGridLayout:在一个网格中进行布局,类似于 HTML 的 table;

7.1 系统提供的布局控件


tt.png

这4个为系统给我们提供的布局的控件,但是使用起来不是非常的灵活,这里就不详细介绍了。

7.2 利用widget做布局

第二种布局方式是利用控件里的widget来做布局,在Containers中

tt.png

在widget中的控件可以进行水平、垂直、栅格布局等操作,比较灵活。

再布局的同时我们需要灵活运用弹簧的特性让我们的布局更加的美观,下面是一个登陆窗口,利用widget可以搭建出如下登陆界面:

tt.png

目录
相关文章
|
7月前
|
算法 数据可视化 程序员
【Qt UI】调色板QPalette类在Qt编程中的应用
【Qt UI】调色板QPalette类在Qt编程中的应用
218 0
|
4月前
【Qt 学习笔记】Qt常用控件 | 布局管理器 | 空白项Spacer
【Qt 学习笔记】Qt常用控件 | 布局管理器 | 空白项Spacer
191 2
|
数据安全/隐私保护
PyQt5-Qt Designer控件之间的伙伴关系和Tab顺序如何设置?
PyQt5-Qt Designer控件之间的伙伴关系和Tab顺序如何设置?
112 0
PyQt5-Qt Designer控件之间的伙伴关系和Tab顺序如何设置?
《QT从基础到进阶·二十一》QGraphicsView、QGraphicsScene和QGraphicsItem坐标关系和应用
《QT从基础到进阶·二十一》QGraphicsView、QGraphicsScene和QGraphicsItem坐标关系和应用
872 0
《QT从基础到进阶·二十一》QGraphicsView、QGraphicsScene和QGraphicsItem坐标关系和应用
《QT从基础到进阶·十》QTableView,QTableWidget,QLineEdit设置只读和输入限制
《QT从基础到进阶·十》QTableView,QTableWidget,QLineEdit设置只读和输入限制
362 0
《QT从基础到进阶·十五》用鼠标绘制矩形(QGraphicsView、QPainter、QGraphicsRectItem)
《QT从基础到进阶·十五》用鼠标绘制矩形(QGraphicsView、QPainter、QGraphicsRectItem)
673 0
Revit二次开发—修改元素的Material Color(图形颜色)
Revit二次开发—修改元素的Material Color(图形颜色)
Revit二次开发—修改元素的Material Color(图形颜色)
QSpinBox/QDoubleSpinBox/QSlider组合使用
QSpinBox/QDoubleSpinBox/QSlider组合使用
304 0
Qt编写自定义控件29-颜色选取面板
一、前言 这个控件主要是模仿QColorDialog对话框中的颜色选取面板,提供一个十字形状的标识器,鼠标按下开始选取颜色,移动到哪就选择该处的颜色值,对应右侧颜色条放大显示,本控件的难点就是如何绘制一个边缘框限定鼠标只能在此框中移动,还有一个就是如何绘制颜色渐变的背景颜色集合,这里采用的是对每一个像素的高度区域设置不同的开始颜色+中间颜色+结束颜色,作为渐变颜色,然后设置QLinearGradient作为画笔的颜色进行绘制,其实就是假设宽度是100,其实是绘制了100条垂直方向的竖线而形成的效果。
1161 0
|
前端开发
自定义控件详解(八):贝塞尔曲线
Path类有4个贝塞尔曲线相关方法: //二阶贝赛尔 public void quadTo(float x1, float y1, float x2, float y2) public void rQuadTo(float dx1, float dy1, float dx2, float ...
1258 0