QT基础 - 布局管理器间隔控件

一. QVBoxLayout

二. QHBoxLayout

三. QGridLayout

四. QFormLayout

五. Spacers

六.总结

一. QVBoxLayout

QVBoxLayout 主要用于将控件在垂直方向上进行排列。

它具有以下特点：

可以方便地管理和组织控件，使其按照垂直顺序依次排列。
能够自动根据添加的控件数量和尺寸来调整布局的整体高度。
提供了简单直观的方式来构建具有垂直层次结构的界面。

通过使用 QVBoxLayout，可以让界面的布局更加清晰、有序，易于维护和扩展。它在许多 Qt 应用程序中被广泛使用，以实现各种不同的界面布局需求。

属性：

通常没有特定的独特属性，而是继承自父类的一些通用布局属性。

方法：

addWidget(QWidget *widget)：添加一个控件到布局中。
addLayout(QLayout *layout)：添加一个子布局到该布局中。

实例代码：

#include <QApplication>
#include <QWidget>
#include <QVBoxLayout>
#include <QPushButton>

int main(int argc, char *argv[]) {
    QApplication a(argc, argv);

    QWidget widget;

    QVBoxLayout *layout = new QVBoxLayout(&widget);

    QPushButton *button1 = new QPushButton("按钮 1");
    QPushButton *button2 = new QPushButton("按钮 2");

    layout->addWidget(button1);
    layout->addWidget(button2);

    widget.show();

    return a.exec();
}

效果图:

二. QHBoxLayout

QHBoxLayout 是一种将控件按水平方向依次排列的布局管理器。

其主要特点包括：

让控件在水平方向上整齐排列，保持水平方向的对齐和间隔。
能够自动处理控件之间的间距和布局的整体宽度。
提供了简洁高效的方式来构建具有水平布局结构的界面。

在实际应用中，常用于构建菜单栏、工具栏等具有水平排列控件需求的界面部分。它使得界面的水平布局更加规范和易于管理，增强了界面的可读性和易用性。例如，在一个图形编辑软件的工具栏中，各种工具按钮可以通过 QHBoxLayout 进行整齐的水平排列。

属性：

同 QVBoxLayout 一样，主要继承自通用布局属性。

方法：

addWidget(QWidget *widget)：向布局中添加一个控件。
addLayout(QLayout *layout)：添加一个子布局。

实例代码：

#include <QApplication>
#include <QWidget>
#include <QHBoxLayout>
#include <QPushButton>

int main(int argc, char *argv[]) {
    QApplication a(argc, argv);

    QWidget widget;

    QHBoxLayout *layout = new QHBoxLayout(&widget);

    QPushButton *button1 = new QPushButton("按钮 1");
    QPushButton *button2 = new QPushButton("按钮 2");

    layout->addWidget(button1);
    layout->addWidget(button2);

    widget.show();

    return a.exec();
}

效果图:

三. QGridLayout

QGridLayout 是一种将控件以网格形式进行排列的布局管理器。

它具有以下显著特点：

可以灵活地将控件放置在网格的特定行和列中，实现精确的布局控制。
支持跨行和跨列的控件放置，以适应不同的布局需求。
能够自动调整网格的尺寸和间距，以适应所包含控件的数量和大小。

这种布局方式非常适合构建具有规则表格结构或需要精确位置控制的界面。比如在一个数据录入界面中，可以将各个输入字段按照行列整齐地排列；在游戏界面中，也可以用它来布置各种游戏元素的位置。它使得界面布局更加规范、整齐，同时提供了较好的可扩展性和可维护性。

属性方面一般较少有其特有的属性。

方法主要有：

addWidget(QWidget *widget, int row, int col, int rowSpan = 1, int colSpan = 1)：将控件添加到指定的行和列，并可指定跨的行数和列数。
addLayout(QLayout *layout, int row, int col)：添加一个子布局到指定位置。

实例代码:

#include <QApplication>
#include <QWidget>
#include <QGridLayout>
#include <QLabel>

int main(int argc, char *argv[]) {
    QApplication a(argc, argv);

    QWidget widget;

    QGridLayout *layout = new QGridLayout(&widget);

    QLabel *label1 = new QLabel("标签 1");
    QLabel *label2 = new QLabel("标签 2");
    QLabel *label3 = new QLabel("标签 3");

    layout->addWidget(label1, 0, 0);
    layout->addWidget(label2, 0, 1);
    layout->addWidget(label3, 1, 0);

    widget.show();

    return a.exec();
}

效果图:

四. QFormLayout

QFormLayout 是 Qt中的一个布局管理器，用于在窗口中创建表单布局。它能够根据需要自动调整表单元素的大小和位置，从而创建一个漂亮且具有一致性的表单界面。

QFormLayout 按照类似 HTML 表单的方式将窗口分割成行和列，每个表单元素都放置在一个单独的行中。每一行通常包含一个标签（用于描述表单元素的用途）和一个表单控件（如文本框、下拉框等）。

QFormLayout 具有以下优点：

遵守不同平台的外观和感觉准则，支持不同的标签对齐方式。
支持包装长行，对于具有小显示器的设备，可以将 QFormLayout 设置为包装长行，甚至包装所有行。
提供了便捷的 API，用于创建标签-字段对。

属性：

fieldGrowthPolicy：字段的增长方式，默认值取决于小部件或应用程序样式。
formAlignment：在布局的几何图形中保持窗体布局内容的对齐，默认值取决于小部件或应用程序样式。
horizontalSpacing：并排排列的小部件之间的间距，默认情况下，如果没有显式设置值，则布局的水平间距将从父布局或父小部件的样式设置继承。
verticalSpacing：垂直布局的小部件之间的间距，默认情况下，如果没有显式设置值，则布局的垂直间距将从父布局或父小部件的样式设置继承。
labelAlignment：标签的水平对齐，默认值取决于小部件或应用程序样式。
rowWrapPolicy：窗体行的换行方式，默认值取决于小部件或应用程序样式。

方法：

addRow(QWidget *label, QWidget *field)：在末尾新增一行，左侧添加标签，右侧添加控件。
addRow(QWidget *label, QLayout *field)：在末尾新增一行，左侧添加标签，右侧添加布局。
addRow(const QString &labelText, QWidget *field)：在末尾新增一行，使用指定的标签文本创建一个QLabel对象，并将其添加到左侧，右侧添加控件。
addRow(const QString &labelText, QLayout *field)：在末尾新增一行，使用指定的标签文本创建一个QLabel对象，并将其添加到左侧，右侧添加布局。
insertRow(int row, QWidget *label, QWidget *field)：在指定位置插入一行，左侧添加标签，右侧添加控件。
insertRow(int row, QWidget *label, QLayout *field)：在指定位置插入一行，左侧添加标签，右侧添加布局。
insertRow(int row, const QString &labelText, QWidget *field)：在指定位置插入一行，使用指定的标签文本创建一个QLabel对象，并将其添加到左侧，右侧添加控件。
insertRow(int row, const QString &labelText, QLayout *field)：在指定位置插入一行，使用指定的标签文本创建一个QLabel对象，并将其添加到左侧，右侧添加布局。
setRowWrapPolicy(RowWrapPolicy policy)：设置换行策略。
setWidget(int row, ItemRole role, QWidget *widget)：设置行row所对应的控件。

代码示例:

#include <QApplication>
#include <QWidget>
#include <QFormLayout>
#include <QLabel>
#include <QLineEdit>

int main(int argc, char *argv[]) {
    QApplication app(argc, argv);

    QWidget window;
    window.setWindowTitle("QFormLayout Example");

    QFormLayout *layout = new QFormLayout;

    layout->addRow(new QLabel("Name:"), new QLineEdit());
    layout->addRow(new QLabel("Age:"), new QLineEdit());

    window.setLayout(layout);

    window.show();

    return app.exec();
}

效果图:

五. Spacers

Spacers（间隔器）用于在布局中不同部件间增加间隔，以辅助解决一些布局无法完美解决的部件布局排列美观问题。Qt的spacer布局控件主要用于填充两个控件之间的间隔距离，当窗口缩放时，弹簧会把控件向两端（上下、左右）进行弹起，其弹起量随窗口的变化而变化。spacer分为vertical spacer（垂直弹簧）和horizontal spacer（水平弹簧）两种。

以下是一个使用Spacers的示例代码：

#include <QApplication>
#include <QWidget>
#include <QFormLayout>
#include <QLabel>
#include <QLineEdit>
#include <QSpacerItem>
#include<QPushButton>

int main(int argc, char *argv[]) {
    QApplication app(argc, argv);

    QWidget window;
    window.setWindowTitle("Spacers Example");

    QFormLayout *layout = new QFormLayout;

    // 添加标签和输入框
    layout->addRow(new QLabel("Name:"), new QLineEdit());
    layout->addRow(new QLabel("Age:"), new QLineEdit());

    // 添加垂直间隔
    QSpacerItem *verticalSpacer = new QSpacerItem(20, 40, QSizePolicy::Minimum, QSizePolicy::Expanding);
    layout->addItem(verticalSpacer);

    // 添加按钮
    layout->addRow(new QPushButton("OK"), new QPushButton("Cancel"));

    window.setLayout(layout);

    window.show();

    return app.exec();
}

效果图: