【Qt】布局管理器

已于 2024-09-07 20:02:27 修改
阅读量707 收藏 26
点赞数 27
分类专栏： Qt 文章标签： qt 开发语言 c++
于 2024-08-13 15:41:43 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_72563041/article/details/141034000
版权

目录

QBoxLayout

QVBoxLayout 垂直布局

QHBoxLayout 水平布局

QGridLayout 网格布局

Stretch 拉伸系数

QSizePolicy 尺寸策略

QFormLayout 表单布局

QSpacerItem 空白区域

界面中各元素排列有序往往会更加的美观，Qt Designer虽然通过拖拽的方式添加控件简便了开发，但手动界面编排还是较为麻烦，为此Qt提供了布局管理器

布局管理器用于管理和安排窗口控件(widgets)，帮助确保界面在不同平台和窗口尺寸下保持一致和合理的布局。布局管理器负责调整和定位窗口部件，以便它们在窗口大小变化时能适应不同的布局需求

QBoxLayout

QBoxLayout 是矩形布局管理器，其管理的界面范围是一个矩形。Qt将其封装，形成了QVBoxLayout (垂直布局管理器) 和 QHBoxLayout (水平布局管理器) 

QVBoxLayout 垂直布局

QVBoxLayout 是垂直布局管理器，用于将窗口部件垂直排列。其按照添加顺序依次排列窗口控件，直到空间不足为止。

核心属性

属性说明
layoutLeftMargin左侧边距
layoutRightMargin右侧边距
layoutTopMargin上方边距
layoutBottomMargin下方边距
layoutSpacing相邻元素之间的间距

核心方法

方法说明
addWidget(QWidget *widget, int stretch = 0, Qt::Alignment alignment = Qt::Alignment())将控件添加到布局管理器中，第一个参数是控件指针，第二个参数是拉伸系数(后续讲解)
addSpacerItem(QSpacerItem *spacerItem)在布局管理器中添加一个可调整大小的空白控件(QSpacerItem)，可设置最小尺寸、最大尺寸和伸展系数。在其构造函数指定相关系数
addSpacing(int size)添加固定大小的空白间隔，指定一个整数作为参数，表示在布局中插入的像素间隔
addStretch(int stretch = 0)

添加一个伸展因子，可以理解为一个占位符，会根据布局中其他窗口控件的大小，自动调整器大小以填充可用空间

参数表示伸展因子的大小

addStruct(int size)

添加一个固定大小的占位控件

与addSpacing类似，但addStruct创建的不是一个真正的控件，而是一次固定大小的占位

addLayout(QLayout *layout)布局管理器嵌套布局管理器
insertWidget(int index, QWidget *widget, int stretch = 0, Qt::Alignment alignment = Qt::Alignment())上述方法都有insert系列，多了第一个参数index，表示插入的下标，若index = 0，则插入后的widget为第0个
insert ........

布局管理器只用于界面布局，所以没有提供信号

代码示例：使用垂直布局管理器规范三个按钮

编写widget.cpp，在构造函数中初始化相应控件

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);

    QVBoxLayout *layout = new QVBoxLayout();
    QPushButton *button1 = new QPushButton("按钮1");
    QPushButton *button2 = new QPushButton("按钮2");
    QPushButton *button3 = new QPushButton("按钮3");
    //将控件添加至布局管理器中
    layout->addWidget(button1);
    layout->addWidget(button2);
    layout->addWidget(button3);
    //将布局管理器应用在界面上
    this->setLayout(layout);
}

因为整个窗口就是一个界面，将布局管理器应用在该界面，其中添加的控件就会自适应窗口的大小 

Qt Designer添加布局管理器，类型有如下，通过拖拽的方式添加到窗口中

通过 Qt Designer 添加的布局管理器，其可调节管理范围，本质是在大窗口上创建了一个小窗口，然后在这个小窗口中启用布局管理器

如此布局管理器中的控件就不会随窗口大小改变而自适应，因为这些小窗口没有自适应大窗口的改变，自然其中的控件也不会变化

QHBoxLayout 水平布局

QHBoxLayout 和 QVBoxLayout 都继承自 QBoxLayout ，属性和方法都一致，此处不过多赘述

代码示例：使用水平布局管理三个按钮

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);

    //QVBoxLayout *layout = new QVBoxLayout();
    QHBoxLayout *layout = new QHBoxLayout();
    QPushButton *button1 = new QPushButton("按钮1");
    QPushButton *button2 = new QPushButton("按钮2");
    QPushButton *button3 = new QPushButton("按钮3");
    //将控件添加至布局管理器中
    layout->addWidget(button1);
    layout->addWidget(button2);
    layout->addWidget(button3);
    //将布局管理器应用在界面上
    this->setLayout(layout);
}

代码示例：嵌套布局管理器。实现三行按钮，前两行各有一个按钮，最后一行有两个按钮

 编写 widget.cpp 的构造函数

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);

    //垂直布局
    QVBoxLayout *main_layout = new QVBoxLayout();
    QPushButton *button1 = new QPushButton("按钮1");
    QPushButton *button2 = new QPushButton("按钮2");
    main_layout->addWidget(button1);
    main_layout->addWidget(button2);
    //水平布局
    QHBoxLayout *layout = new QHBoxLayout();
    QPushButton *button3 = new QPushButton("按钮3");
    QPushButton *button4 = new QPushButton("按钮4");
    layout->addWidget(button3);
    layout->addWidget(button4);
    //将水平布局设置进垂直布局中
    main_layout->addLayout(layout);
    //将布局设置进窗口
    this->setLayout(main_layout);
}

QGridLayout 网格布局

QGridLayout 用于实现网格布局的效果，将界面分成若干行和列，可以将控件放置在网格的指定位置上，支持跨越多行和多列的布局，可以达到 M * N 的网格效果

核心属性

QGridLayout 整体属性和 QBoxLayout 相似，但是设置 spacing 的时候是按照垂直水平两个方向设置的

属性说明
layoutLeftMargin左侧边距
layoutRightMargin右侧边距
layoutTopMargin上方边距
layoutBottomMargin下方边距
layoutSpacing相邻元素之间的间距
layoutHorizontalSpacing相邻元素之间水平方向的间距
layoutVerticalSpacing相邻元素之间垂直方向的间距
layoutRowStretch行方向的拉伸系数
layoutColumnStretch列方向的拉伸系数

核心方法 

QGridLayout 整体方法也与 QBoxLayout 相似，不过因为QGridLayout管理的控件为多行多列，所以再设置控件/布局管理器时，需要指明行列号 

方法说明
addWidget(QWidget *widget, int row, int column,  Qt::Alignment alignment = Qt::Alignment())将控件添加到布局管理器中，第一个参数是控件指针，二三参数是指定的行列号
addWidget(QWidget *widget, int fromRow, int formColumn,  int rowSpan, int columnSpan, Qt::Alignment alignment = Qt::Alignment())

将控件放置在从 (fromRow, formColumn) 开始，控件宽度为 columnSpan，高度为 rowSpan

如果 columnSpan/rowSpan 为-1，那么将填充至列/行结尾

setVerticalSpacing(int spacing)只在垂直方向设置空白间隔
setHorizontalSpacing(int spacing)只在水平方向设置空白间隔
setSpacing(int spacing)在垂直和水平方向都添加空白间隔
setColumnStretch(int column, int stretch)

设置 column 列的拉伸系数

setRowStretch(int row, int stretch)设置 row 行的拉伸系数
addLayout(QLayoutItem *item, int row, int column,  Qt::Alignment alignment = Qt::Alignment())嵌套布局管理器，将布局管理器设置到指定行列
addLayout(QLayoutItem *item, int fromRow, int formColumn,  int rowSpan, int columnSpan, Qt::Alignment alignment = Qt::Alignment())和第二个addWidget类似，多了宽度和高度

代码示例：将按钮按两行两列排列

编写 widget.cpp的构造函数

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    QGridLayout *layout = new QGridLayout();
    QPushButton *button1 = new QPushButton("按钮1");
    QPushButton *button2 = new QPushButton("按钮2");
    QPushButton *button3 = new QPushButton("按钮3");
    QPushButton *button4 = new QPushButton("按钮4");
    //将按钮添加到布局管理器中
    layout->addWidget(button1, 0, 0);
    layout->addWidget(button2, 0, 1);
    layout->addWidget(button3, 1, 0);
    layout->addWidget(button4, 1, 1);
    //将布局管理设置进窗口
    this->setLayout(layout);
}

 

调整指定的行列，观察不同效果

可以看到，并不是设置到第几行第几列就会将界面划分到几行几列，而是根据有多少行列值不同而划分

Stretch 拉伸系数

有时我们并不想布局管理器中所有的控件大小都相同，此时就可以通过 stretch 改变行列间控件的大小。

通过设置拉伸系数，会将一行/列的控件按各自的拉伸系数，等比例的划分行/列

代码示例：对两行三列的按钮，进行大小改变

编写widget.cpp的构造函数

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    QGridLayout *layout = new QGridLayout();
    QPushButton *button1 = new QPushButton("按钮1");
    QPushButton *button2 = new QPushButton("按钮2");
    QPushButton *button3 = new QPushButton("按钮3");
    QPushButton *button4 = new QPushButton("按钮4");
    QPushButton *button5 = new QPushButton("按钮5");
    QPushButton *button6 = new QPushButton("按钮6");
    //将按钮添加到布局管理器中
    layout->addWidget(button1, 0, 0);
    layout->addWidget(button2, 0, 1);
    layout->addWidget(button3, 0, 2);
    layout->addWidget(button4, 1, 0);
    layout->addWidget(button5, 1, 1);
    layout->addWidget(button6, 1, 2);
    //设置列拉伸系数为1:2:3
    layout->setColumnStretch(0, 1);//第0列拉伸系数为1
    layout->setColumnStretch(1, 2);//第1列拉伸系数为2
    layout->setColumnStretch(2, 3);//第2列拉伸系数为3
    //将布局管理设置进窗口
    this->setLayout(layout);
}

若想设置行拉伸系数，直接设置并没有效果，因为控件大小还受 sizePolicy 影响

QSizePolicy 尺寸策略

QsizePolicy 类用于描述控件的大小策略，即小控件在其父布局中如何调整自身大小以适应可用空间

核心属性

属性说明
HorizontalPolicy水平方向的调整方式
VerticalPolicy垂直方向的调整方式
PolicyTypes

策略类型

  • QSizePolicy::Fixed：固定大小，不会被调整
  • QSizePolicy::Minimum：控件可以缩小，但不能小于最小大小
  • QSizePolicy::Maximum：控件可以放大，但不能大于最大大小
  • QSizePolicy::Preferred：控件会尽可能接近其建议的大小，也可以调整
  • QSizePolicy::Expanding：控件会尽可能扩展以填充可用空间
  • QSizePolicy::Shrinking：控件会尽可能缩小以适应空间
  • QSizePolicy::MinimumExpanding：达到最小大小后仍可以扩展
  • QSizePolicy::Ignored：由其他因素(如布局)决定大小

如果要设置行拉伸因子，还需要将控件的行尺寸策略设置为 QSizePolicy::Expanding

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    //三行两列，行拉伸比例为1:0:3
    QGridLayout *layout = new QGridLayout();
    QPushButton *button1 = new QPushButton("按钮1");
    QPushButton *button2 = new QPushButton("按钮2");
    QPushButton *button3 = new QPushButton("按钮3");
    QPushButton *button4 = new QPushButton("按钮4");
    QPushButton *button5 = new QPushButton("按钮5");
    QPushButton *button6 = new QPushButton("按钮6");
    //设置控件的尺寸策略
    button1->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    button2->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    button3->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    button4->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    button5->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    button6->setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    //将按钮添加到布局管理器中
    layout->addWidget(button1, 0, 0);
    layout->addWidget(button2, 0, 1);
    layout->addWidget(button3, 1, 0);
    layout->addWidget(button4, 1, 1);
    layout->addWidget(button5, 2, 0);
    layout->addWidget(button6, 2, 1);
    //设置行拉伸系数为1:0:3
    layout->setRowStretch(0, 1);
    layout->setRowStretch(1, 0);//第1列行伸系数为0，设置为0，即为固定大小，不参与拉伸
    layout->setRowStretch(2, 3);
    //将布局管理设置进窗口
    this->setLayout(layout);
}

使用 QGridLayout 可以代替很多 QHBoxLayout 和 QVBoxLayout 嵌套的场景

同时 QGridLayout 也可以嵌套 QHBoxLayout 和 QVBoxLayout，反之如此，QHBoxLayout也可以嵌套 QGridLayout

QFormLayout 表单布局

QFormLayout 属于 QGridLayout 的特殊情况，专门用于实现两列表单的布局，将表单字段(如标签和输入框)组织成标签和对应控件的对，通常用于配置界面或设置界面

核心方法

方法

说明

addRow(QWidget *widget)

addRow(QLayout *layout)

添加一行，只有单个控件/布局器

addRow(QWidget *label, QWidget *field)

addRow(QWidget *label, QLayout *field)

添加一行，有标签和控件/布局器组成的对

insert(int row, QWidget *label, QWidget *field)

.......

插入一行表单

insert方法与add类似，就多了第一个参数 row

removeRow(int row)删除一行表单
rowCount()获取当前行数

代码示例：有姓名、密码两个表单

编写widget.cpp的构造函数

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);

    QFormLayout *layout = new QFormLayout();
    //创建标签
    QLabel *label_name = new QLabel("姓名");
    QLabel *label_password = new QLabel("密码");
    //创建输入框
    QLineEdit *edit_name = new QLineEdit();
    QLineEdit *edit_password = new QLineEdit();
    edit_password->setEchoMode(QLineEdit::Password);
    //创建提交按钮
    QPushButton *button = new QPushButton("提交");
    //添加表单
    layout->addRow(label_name, edit_name);
    layout->addRow(label_password, edit_password);
    layout->addRow(button);
    //设置布局管理器
    this->setLayout(layout);
}

QSpacerItem 空白区域

QSpacerItem 主要用于在布局中添加可调整的空白区域，使界面更加美观

核心属性

属性说明
width宽度
height高度
hData

水平方向的 sizePolicy

Expanding、Ignored、Preferred等等

VDate

垂直方向的 sizePolicy

选项同上

代码示例：layout 是一个水平布局管理器，有两个按钮，在中间和后面添加 QSpacerItem，观察效果

结束语

感谢你的阅读，如果觉得本篇文章对你有所帮助的话，不妨点个赞支持一下博主，拜托啦，这对我真的很重要   

好想有猫猫
关注
专栏目录
QT布局管理器【QVBoxLayout，QHBoxLayout，QGridLayout】
m0_45463480的博客
06-22 1204
QT布局管理器【QVBoxLayout，QHBoxLayout，QHBoxLayout】 简介 main.cpp mainwindow.h mainwindow.cpp ui界面设计 登录界面为例 总结
qt布局嵌套_QT 布局管理器的嵌套使用
weixin_30069113的博客
01-30 603
int main(int argc,char *argv[]){QApplication a(argc,argv);QWidget *win=new QWidget(0);QLineEdit *line=new QLineEdit(win);line->setText("Line");QTextEdit *text=new QTextEdit(win);text->setText("t...
Qt布局管理器
weixin_46571142的博客
02-08 948
1.存在的问题 目前的GUI开发方式：绝对定位 直接在像素级指定各个组件的位置和大小 void QWidget::move(int x, int y) void QWidget::resize(int w, int h); 问题：组件的位置和大小无法自适应父窗口的变化 2.解决方案：布局管理器 提供相关的类对界面组件进行布局管理 能够自动排列窗口中的界面组件 窗口变化后自动更新界面组件的大小 QLayout是Qt中布局管理器的抽象基类 通过继承QLayout实现了功能各异且互补的布局管理器 Qt中可以根据需
Qt 实战（5）布局管理器 | 5.2、深入解析Qt布局管理器
个人技术博客
06-18 1008
Qt布局管理器是创建灵活和可适应不同设备和分辨率的用户界面的关键工具。通过合理地使用不同类型的布局管理器、嵌套布局、间距和对齐方式以及测试不同环境，开发人员可以创建出功能完善且易于使用的用户界面。希望本文能帮助您更深入地了解Qt布局管理器并为您的开发工作提供有用的指导。
Hello Qt（二十）——QT布局管理器
天山老妖
03-05 1390
一、布局管理器简介 QT中使用绝对定位的布局方式无法自适应窗口的变化。 QT中提供了对界面组件进行布局管理的类，用于对界面组件进行管理，能够自动排列窗口中的界面组件，窗口大小变化后自动更新界面组件的大小。 QLayout是QT中布局管理器的抽象基类，通过对QLayout的继承，实现了功能各异且互补的布局管理器。 布局管理器不是界面组件，而是界面组件的定位策略。 任意容器类型的组件都可以指定布局管理器。 同一个布局管理器管理中的组件拥有相同的父组件，在设置布局管理器的同时已经隐式指定了父.
【Qt】Qt布局管理器
C/C++软件工程师、嵌入式软件工程师、物联网研发工程师、C/C++讲师、物联网讲师、嵌入式讲师---欢迎大家一起交流(私信添加博主微信)
03-22 4298
00. 目录 文章目录00. 目录01. 概述02. 开发环境03. Qt设计师实现布局04. 代码实现布局05. 预留06. 附录 01. 概述 一个软件不仅要有强大的功能，还要有一个美观的界面，布局管理器就是用来对界面部件进行布局管理的。Qt中的布局管理器主要包括QBoxLayout基本布局管理器、QGridLayout栅格布局管理器和QFormLayout窗体布局管理器，而基本布局管理器又分为QHBoxLayout水平布局管理器和QVBoxLayout垂直布局管理器。 02. 开发环境 Windows
qt布局嵌套_QT开发（二十一）——QT布局管理器
weixin_39805387的博客
12-19 799
QT开发(二十一)——QT布局管理器一、布局管理器简介QT中使用绝对定位的布局方式无法自适应窗口的变化。QT中提供了对界面组件进行布局管理的类，用于对界面组件进行管理，能够自动排列窗口中的界面组件，窗口大小变化后自动更新界面组件的大小。QLayout是QT中布局管理器的抽象基类，通过对QLayout的继承，实现了功能各异且互补的布局管理器。布局管理器不是界面组件，而是界面组件的定位策略。任意容器类...
Qt布局管理器一些会迷惑的点(1)
05-22
本篇文章将深入探讨Qt布局管理器的一些常见迷惑点，帮助开发者更好地理解和运用布局管理器进行UI设计。 1. **什么是Qt布局管理器？** Qt布局管理器是一种机制，它根据窗口或容器的大小变化自动调整其内部控件的...
qt5总中布局管理器的源码
08-20
Qt5中的布局管理器是构建GUI应用程序的核心工具之一，它帮助开发者自动调整控件在窗口中的位置和大小，以适应不同的屏幕分辨率和用户界面需求。本文将深入解析Qt5布局管理器的源码，探讨其工作原理和实现细节。 ...
比较stl库的ostringstream与Qt的QString::arg(),QString::number()
liji_digital的博客
09-11 335
对于stringstream,使用比较繁琐，要联合使用std::fixed和std::setprecision才能实现固定小数位数显示，qstring则要简单一些。注意，使用qstring的时候，不论使用arg还是number，format输入参数都必须是'f'，不能用'g'，否则可能无法获得理想的效果。考虑STL库的ostringstream或者Qt的QString::arg(), number。显示一个float或者double类型的数，要求小数点后的数字位数为定值。
QT 自定义组件 界面跳转
weixin_64918301的博客
09-10 881
/槽函数定义lab4->setWindowTitle("账号为空");//绑定//自适应尺寸else if(edit1->text() == edit2->text()) //发送事件//发送跳转信号//信号会发送给所有对象，但只有和该信号绑定的对象才会响应}elselab5->setWindowTitle("账号密码不正确");//绑定//自适应尺寸"退出","确定退出吗？",this);
Qt-QPushButton按钮类控件(22)
weixin_67595436的博客
09-12 367
QPushButton控件的介绍与使用
Qt实现登录界面
Black.Spider的博客
09-11 373
本文基于Qt实现一个简单的登录界面，主要使用到Widget、button、edit等控件，基于自定义的信号槽实现界面的跳转，使用绘图设备添加背景图等。
QT使用定时器事件驱动完成定时播报效果
weixin_64005144的博客
09-10 571
【代码】QT使用定时器事件驱动完成定时播报效果。
Qt/C++ 了解NTFS文件系统，了解MFT(Master File Table)主文件表（一）
qq_35554617的博客
09-13 908
简单了解NTFS文件系统中的MFT(Master File Table)主文件表，介绍GitHub开源项目NTFS-File-Search，统计Qt库和Windows Api函数，以及使用NTFS-File-Search项目中的方法读取盘符所有目录文件速度示例
Qt：懒汉单例(附带单例使用和内存管理)
m0_71489826的博客
09-15 697
本文主要写懒汉单例以及单例的释放，网上很多教程只有单例的创建，但是并没有告诉我们单例的内存管理，这就很头疼。
QT --- 初识QT
m0_67635008的博客
09-15 692
一般通过代码来构造界面的时候，通常会把构造界面的代码放到Widget/MainWindow的构造函数中。Qt中每个类都有对应同名的头文件上古时期，Qt用的是这种风格的文件。1998年之后，C++标准成立了，C++98标准。规定，包含头文件，统一使用#include<cstdio>代替原有的#include<stdio.h>Lable叫做标签，界面上一个用来显示内容字符串的控件，创建对象的时候，可以直接堆上创建，也可以在栈上创建。跟推荐在堆上创建对象。
Qt：饿汉单例(附带单例使用和内存管理)
最新发布
m0_71489826的博客
09-15 289
本文主要写饿汉单例以及单例的释放，网上很多教程只有单例的创建，但是并没有告诉我们单例的内存管理，这就很头疼。
linux使用命令行编译qt.cpp
vczxh的专栏
09-14 629
make //从Makefile文件编译为可执行程序。qmake//从pro文件生成Makefile文件。qmake -project //生成pro文件。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值