Qt 重要控件：多元素控件、容器类控件及布局管理器

文章目录

- 一、多元素控件
- - [1.1 ListWidget（列表控件）](#1.1 ListWidget（列表控件）)
  - [1.2 TableWidget（表格控件）](#1.2 TableWidget（表格控件）)
  - [1.3 TreeWidget（树形控件）](#1.3 TreeWidget（树形控件）)
- 二、容器类控件
- - [2.1 GroupBox（分组框）](#2.1 GroupBox（分组框）)
  - [2.2 TabWidget（标签页控件）](#2.2 TabWidget（标签页控件）)
- 三、布局管理器
- - [3.1 垂直布局（QVBoxLayout）](#3.1 垂直布局（QVBoxLayout）)
  - [3.2 水平布局（QHBoxLayout）](#3.2 水平布局（QHBoxLayout）)
  - [3.3 网格布局（QGridLayout）](#3.3 网格布局（QGridLayout）)
  - [3.4 表单布局（QFormLayout）](#3.4 表单布局（QFormLayout）)
  - [3.5 Spacer（空白间隔）](#3.5 Spacer（空白间隔）)

一、多元素控件

多元素控件用于展示多条数据 ，支持列表、表格、树形 结构，常用控件包括 ListWidget、TableWidget、TreeWidget（xxWidget 是 xxView 的子类，封装了 Model 层，使用更简便）。

xxWidget与xxView的区别：
用 QTableWidget 和 QTableView 举例，核心区别是数据管理方式：
QTableView 是基于 MVC 设计的基础控件，自身不存数据，得用户手动创建 Model（比如 QStandardModel）并和它关联，数据存在 Model 里，改 Model 或改 View 会双向同步；而 QTableWidget 是它的子类，已经封装好了 Model，不用用户额外创建，直接就能往控件里加数据。
总结：View 需要自己配 Model，更灵活；Widget 已经封装好 Model ，开箱即用。

1.1 ListWidget（列表控件）

核心属性

属性	说明
currentRow	当前被选中的是第几行
count	一共有多少行
sortingEnabled	是否允许排序
isWrapping	是否允许换行
itemAlignment	元素的对齐方式
selectRectVisible	被选中的元素矩形是否可见
spacing	元素之间的间隔

核心方法

方法	说明
addItem(const QString& label)	列表中添加元素
addItem(QListWidgetItem *item)	列表中添加元素（通过QListWidgetItem对象）
currentItem()	返回QListWidgetItem*表示当前选中的元素
setCurrentItem(QListWidgetItem* item)	设置选中哪个元素
setCurrentRow(int row)	设置选中第几行的元素
insertItem(const QString& label, int row)	在指定位置插入元素
insertItem(QListWidgetItem *item, int row)	在指定位置插入元素（通过QListWidgetItem对象）
item(int row)	返回QListWidgetItem*表示第row行的元素
takeItem(int row)	删除指定行的元素，返回QListWidgetItem*表示被删元素

核心信号

信号	说明
currentItemChanged(QListWidgetItem* current, QListWidgetItem* old)	选中不同元素时触发，参数是当前/之前选中的元素
currentRowChanged(int)	选中不同元素时触发，参数是当前选中元素的行数
itemClicked(QListWidgetItem* item)	点击某个元素时触发
itemDoubleClicked(QListWidgetItem* item)	双击某个元素时触发
itemEntered(QListWidgetItem* item)	鼠标进入元素时触发

核心方法

方法	说明
setFont	设置字体
setIcon	设置图标
setHidden	设置隐藏
setSizeHint	设置尺寸
setSelected	设置是否选中
setText	设置文本
setTextAlignment	设置文本对齐方式

显示纵向列表，支持新增、删除、选中元素，每个元素为 QListWidgetItem。
核心方法：addItem()（添加元素）、takeItem()（删除元素）、currentItem()（获取当前选中元素）。
可通过ui变型为其他控件：
代码示例1：列表元素增删改查

拖放 ListWidget、LineEdit、两个按钮（新增/删除），也可以通过ui直接添加：
编写代码：

cpp 复制代码

Widget::Widget(QWidget *parent)
: QWidget(parent), ui(new Ui::Widget)
{
    ui->setupUi(this);
    // 添加元素
    ui->listWidget->addItem("apple");
    //或ui->listWidget->addItem(new QListWidgetItem("apple"));
    ui->listWidget->addItem("banana");
    //或ui->listWidget->addItem(new QListWidgetItem("banana"));
    ui->listWidget->addItem("orange");
    //或ui->listWidget->addItem(new QListWidgetItem("oragne"));
}
// 新增元素
void Widget::on_pushButton_clicked()
{
    const QString& text = ui->lineEdit->text();
    if (!text.isEmpty()) ui->listWidget->addItem(text);
}
// 删除元素
void Widget::on_pushButton_2_clicked()
{
    int row = ui->listWidget->currentRow();
    ui->listWidget->takeItem(row);
}

1.2 TableWidget（表格控件）

核心方法

方法	说明
item(int row, int column)	根据行列数获取指定的 QTableWidgetItem*
setItem(int row, int column, QTableWidgetItem*)	根据行列数设置表格中的元素
currentItem()	返回被选中的元素 QTableWidgetItem*
currentRow()	返回被选中元素所在的行号
currentColumn()	返回被选中元素所在的列号
row(QTableWidgetItem*)	获取指定Item所在的行号
column(QTableWidgetItem*)	获取指定Item所在的列号
rowCount()	获取表格的总行数
columnCount()	获取表格的总列数
insertRow(int row)	在第row行处插入新行
insertColumn(int column)	在第column列处插入新列
removeRow(int row)	删除第row行
removeColumn(int column)	删除第column列
setHorizontalHeaderItem(int column, QTableWidgetItem*)	设置指定列的表头
setVerticalHeaderItem(int row, QTableWidgetItem*)	设置指定行的表头

核心信号

信号	说明
cellClicked(int row, int column)	点击单元格时触发
cellDoubleClicked(int row, int column)	双击单元格时触发
cellEntered(int row, int column)	鼠标进入单元格时触发
currentCellChanged(int row, int column, int previousRow, int previousColumn)	选中不同单元格时触发（含前后单元格行列）

核心方法

方法	说明
row()	获取当前Item所在的行号
column()	获取当前Item所在的列号
setText(const QString&)	设置Item的文本内容
setTextAlignment(int)	设置Item的文本对齐方式
setIcon(const QIcon&)	设置Item的图标
setSelected(bool)	设置Item是否被选中
setSizeHints(const QSize&)	设置Item的尺寸
setFont(const QFont&)	设置Item的字体

显示二维表格，每个单元格为 QTableWidgetItem，支持行/列增删、单元格编辑。
核心方法：insertRow()/insertColumn()（增行/列）、removeRow()/removeColumn()（删行/列）、setItem()（设置单元格内容）。
可以使用ui直接添加固定信息：
代码示例1：学生信息表格（支持增删行/列）

cpp 复制代码

Widget::Widget(QWidget *parent)
: QWidget(parent), ui(new Ui::Widget)
{
    ui->setupUi(this);
    // 创建3行
    ui->tableWidget->insertRow(0);
    ui->tableWidget->insertRow(1);
    ui->tableWidget->insertRow(2);

    // 创建3列
    ui->tableWidget->insertColumn(0);
    ui->tableWidget->insertColumn(1);
    ui->tableWidget->insertColumn(2);

    ui->tableWidget->setHorizontalHeaderItem(0, new QTableWidgetItem("学号"));
    ui->tableWidget->setHorizontalHeaderItem(1, new QTableWidgetItem("姓名"));
    ui->tableWidget->setHorizontalHeaderItem(2, new QTableWidgetItem("年龄"));

    ui->tableWidget->setItem(0, 0, new QTableWidgetItem("1001"));
    ui->tableWidget->setItem(0, 1, new QTableWidgetItem("张三"));
    ui->tableWidget->setItem(0, 2, new QTableWidgetItem("20"));

    ui->tableWidget->setItem(1, 0, new QTableWidgetItem("1002"));
    ui->tableWidget->setItem(1, 1, new QTableWidgetItem("李四"));
    ui->tableWidget->setItem(1, 2, new QTableWidgetItem("21"));

    ui->tableWidget->setItem(2, 0, new QTableWidgetItem("1003"));
    ui->tableWidget->setItem(2, 1, new QTableWidgetItem("王五"));
    ui->tableWidget->setItem(2, 2, new QTableWidgetItem("19"));
}
void Widget::on_pushButton_addRow_clicked()
{
    // 获取当前行数，在末尾插入新行
    int rowCount = ui->tableWidget->rowCount();
    ui->tableWidget->insertRow(rowCount);
}

void Widget::on_pushButton_delRow_clicked()
{
    // 获取当前选中的行号
    int curRow = ui->tableWidget->currentRow();
    // 存在选中行时才删除
    if (curRow >=0 ) {
        ui->tableWidget->removeRow(curRow);
    }
}

void Widget::on_pushButton_addCol_clicked()
{
    // 获取当前列数，在末尾插入新列
    int colCount = ui->tableWidget->columnCount();
    ui->tableWidget->insertColumn(colCount);

    // 从输入框获取列名，设置新列表头
    const QString& name = ui->lineEdit->text();
    ui->tableWidget->setHorizontalHeaderItem(colCount, new QTableWidgetItem(name));
}

void Widget::on_pushButton_delCol_clicked()
{
    // 获取当前选中的列号
    int curCol = ui->tableWidget->currentColumn();
    // 存在选中列时才删除
    if (curCol != -1) {
        ui->tableWidget->removeColumn(curCol);
    }
}

1.3 TreeWidget（树形控件）

核心方法

方法	说明
clear	清空所有子节点
addTopLevelItem(QTreeWidgetItem* item)	新增顶层节点
topLevelItem(int index)	获取指定下标的顶层节点
topLevelItemCount()	获取顶层节点个数
indexOfTopLevelItem(QTreeWidgetItem* item)	查询指定节点是顶层节点中的下标
takeTopLevelItem(int index)	删除指定的顶层节点，返回QTreeWidgetItem*表示被删除的元素
currentItem()	获取当前选中的节点，返回QTreeWidgetItem*
setCurrentItem(QTreeWidgetItem* item)	选中指定节点
setExpanded(bool)	展开/关闭节点
setHeaderLabel(const QString& text)	设置TreeWidget的header名称

核心信号

信号	说明
currentItemChanged(QTreeWidgetItem* current, QTreeWidgetItem* old)	切换选中元素时触发
itemClicked(QTreeWidgetItem* item, int col)	点击元素时触发
itemDoubleClicked(QTreeWidgetItem* item, int col)	双击元素时触发
itemEntered(QTreeWidgetItem* item, int col)	鼠标进入时触发
itemExpanded(QTreeWidgetItem* item)	元素被展开时触发
itemCollapsed(QTreeWidgetItem* item)	元素被折叠时触发

核心属性

属性	说明
text	持有的文本
textAlignment	文本对齐方式
icon	持有的图表
font	文本字体
hidden	是否隐藏
disabled	是否禁用
expand	是否展开
sizeHint	尺寸大小
selected	是否选中

核心方法

方法	说明
addChild(QTreeWidgetItem* child)	新增子节点
childCount()	子节点的个数
child(int index)	获取指定下标的子节点，返回QTreeWidgetItem*
takeChild(int index)	删除对应下标的子节点
removeChild(QTreeWidgetItem* child)	删除对应的子节点
parent()	获取该元素的父节点

显示树形结构，支持顶层节点和子节点嵌套，每个节点为 QTreeWidgetItem。
核心方法：addTopLevelItem()（添加顶层节点）、addChild()（添加子节点）、takeTopLevelItem()（删除顶层节点）。
同样可以直接通过ui添加：
代码示例1：动物分类树形结构

cpp 复制代码

Widget::Widget(QWidget *parent)
: QWidget(parent), ui(new Ui::Widget)
{
    ui->setupUi(this);
     // 1. 创建空的顶层节点
    QTreeWidgetItem *catItem = new QTreeWidgetItem();
    // 2. 设置第0列的文本（TreeWidget默认是1列，列索引从0开始）
    catItem->setText(0, "猫");
    // 3. 添加到TreeWidget中
    ui->treeWidget->addTopLevelItem(catItem);

    QTreeWidgetItem* dogItem=new QTreeWidgetItem();
    dogItem->setText(0,"狗");
    ui->treeWidget->addTopLevelItem(dogItem);

    QTreeWidgetItem* fishItem=new QTreeWidgetItem();
    fishItem->setText(0,"鱼");
    ui->treeWidget->addTopLevelItem(fishItem);

    QTreeWidgetItem *catchild1 = new QTreeWidgetItem();
    catchild1->setText(0,"狸花猫");
    catItem->addChild(catchild1);
    QTreeWidgetItem *catchild2 = new QTreeWidgetItem();
    catchild2->setText(0,"缅因猫");
    catItem->addChild(catchild2);

    QTreeWidgetItem *dogchild1 = new QTreeWidgetItem();
    dogchild1->setText(0,"边牧");
    dogItem->addChild(dogchild1);
}

代码示例2：按钮添加

cpp 复制代码

void Widget::on_add_top_clicked()
{
    const QString& str=ui->lineEdit_2->text();
    QTreeWidgetItem *item = new QTreeWidgetItem();
    item->setText(0,str);
    ui->treeWidget->addTopLevelItem(item);
}

void Widget::on_add_choose_clicked()
{
    QTreeWidgetItem* choosen=ui->treeWidget->currentItem();
    if(choosen==nullptr) return;
    const QString& str=ui->lineEdit_2->text();
    QTreeWidgetItem *item = new QTreeWidgetItem();
    item->setText(0,str);
    choosen->addChild(item);
}

void Widget::on_del_choose_clicked()
{
    QTreeWidgetItem* choosen=ui->treeWidget->currentItem();
    if(choosen==nullptr) return;
    QTreeWidgetItem* parent=choosen->parent();
    if(parent==nullptr)//为顶层元素，删除顶层节点
    {
        ui->treeWidget->takeTopLevelItem(ui->treeWidget->indexOfTopLevelItem(choosen));
    }
    else//非顶层元素，删除子节点
    {
        parent->removeChild(choosen);
    }
}

二、容器类控件

容器类控件用于包裹其他控件，实现分组、分页、布局管理，常用控件包括 GroupBox、TabWidget。

2.1 GroupBox（分组框）

QGroupBox 核心属性表格：

属性	说明
title	分组框的标题
alignment	分组框内部内容的对齐方式
flat	是否是"扁平"模式
checkable	是否可选择；设为 true，则在 title 前方会多出一个可勾选的部分
checked	描述分组框的选择状态（前提是 checkable 为 true）

带有标题的分组容器，用于将相关控件归类，提升界面可读性。
核心属性：title（分组标题）、checkable（是否可勾选，勾选后启用组内控件）、flat（是否扁平样式）。
代码示例1：将麦当劳点餐控件分组

2.2 TabWidget（标签页控件）

核心属性

属性	说明
tabPosition	标签页所在的位置，可选值： - North（上方） - South（下方） - West（左侧） - East（右侧）
currentIndex	当前选中了第几个标签页（从 0 开始计算）
currentTabText	当前选中的标签页的文本
currentTabName	当前选中的标签页的名字
currentTabIcon	当前选中的标签页的图标
currentTabToolTip	当前选中的标签页的提示信息
tabsClosable	标签页是否可以关闭
movable	标签页是否可以移动

核心信号

信号	说明
currentChanged(int)	在标签页发生切换时触发，参数为被点击的选项卡编号
tabBarClicked(int)	在点击选项卡的标签条时触发，参数为被点击的选项卡编号
tabBarDoubleClicked(int)	在双击选项卡的标签条时触发，参数为被点击的选项卡编号
tabCloseRequest(int)	在标签页关闭时触发，参数为被关闭的选项卡编号

核心函数

方法	说明
count()	获取标签页的总数，返回 `int`
addTab(QWidget *page, const QString &label)	添加标签页：参数为标签页对应的 `QWidget`、标签文本
addTab(QWidget *page, const QIcon &icon, const QString &label)	添加带图标的标签页：参数为 `QWidget`、图标、标签文本
insertTab(int index, QWidget *page, const QString &label)	在指定索引（`index`）处插入标签页
removeTab(int index)	移除指定索引（`index`）对应的标签页
widget(int index)	获取指定索引（`index`）对应的标签页 `QWidget`
setTabText(int index, const QString &text)	设置指定索引（`index`）标签页的文本
tabText(int index)	获取指定索引（`index`）标签页的文本
setTabIcon(int index, const QIcon &icon)	设置指定索引（`index`）标签页的图标
tabIcon(int index)	获取指定索引（`index`）标签页的图标
setTabToolTip(int index, const QString &toolTip)	设置指定索引（`index`）标签页的提示信息
setCurrentIndex(int index)	选中指定索引的标签页
setCurrentWidget(QWidget *widget)	通过标签页对应的 `QWidget` 选中该标签页
currentIndex()	获取当前选中标签页的索引（返回 `int`）
currentWidget()	获取当前选中标签页对应的 `QWidget`

支持多标签页切换，每个标签页为一个 QWidget，可放置不同组的控件。
核心属性：currentIndex（当前选中标签页下标）、tabsCloseable（是否可关闭标签页）、movable（标签页是否可拖动）。

关于 QTabWidget 的注意事项：

QTabWidget 中的每个标签页都是一个 QWidget
点击标签页，就可以直接切换
右键 QTabWidget，可以添加标签页或者删除标签页
代码示例1：使⽤标签⻚管理多组控件

cpp 复制代码

// 新增标签页
void Widget::on_pushButton_3_clicked()
{
    QWidget* newwidget=new QWidget();
    int count=ui->tabWidget->count();
    ui->tabWidget->addTab(newwidget,QString::fromStdString("Tab "+std::to_string(count+1)));
    //增加一个标签
    QLabel* label=new QLabel("新标签页",newwidget);
    label->setGeometry(newwidget->x()+20,newwidget->y()+20,50,20);
    //指向创建好的标签页
    ui->tabWidget->setCurrentIndex(count);
}

void Widget::on_pushButton_4_clicked()
{
    int pos=ui->tabWidget->currentIndex();
    if(pos>=0)
    {
        ui->tabWidget->removeTab(pos);
    }
}

三、布局管理器

布局管理器用于自动排列控件，解决绝对定位无法自适应窗口大小的问题，Qt 提供四种核心布局：垂直布局（QVBoxLayout）、水平布局（QHBoxLayout）、网格布局（QGridLayout）、表单布局（QFormLayout）。

3.1 垂直布局（QVBoxLayout）

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

控件垂直排列，随窗口高度调整控件大小。
核心属性：layoutMargin（边距）、layoutSpacing（控件间距）。
代码示例1：垂直排列三个按钮（使⽤addWidget 把控件添加到布局管理器中、使⽤ setLayout 设置该布局管理器到 widget 中.）

cpp 复制代码

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

    QPushButton* button1=new QPushButton("按钮1",this);
    QPushButton* button2=new QPushButton("按钮2",this);
    QPushButton* button3=new QPushButton("按钮3",this);
    //使用addWidget添加按钮
    QVBoxLayout* layout=new QVBoxLayout();
    layout->addWidget(button1);
    layout->addWidget(button2);
    layout->addWidget(button3);
    //使用setLayout将布局管理器设置到widget中
    this->setLayout(layout);
}

还可以直接通过Qt designer添加：

或者通过选中添加垂直布局：

请注意如果通过代码添加绑定到Widget，那么控件的大小可以自适应窗口大小，并且一个Widget只能绑定一个layout，如果多次调用 setLayout() 那么只有最后一次调用会生效；如果采用Qt designer进行添加，没有 this->setLayout(布局管理器); 那么控件大小固定不变。

3.2 水平布局（QHBoxLayout）

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

控件水平排列，随窗口宽度调整控件大小，属性与垂直布局一致。
代码示例1：水平排列三个按钮

cpp 复制代码

Widget::Widget(QWidget *parent)
: QWidget(parent), ui(new Ui::Widget)
{
    ui->setupUi(this);
    QPushButton* btn1 = new QPushButton("按钮1");
    QPushButton* btn2 = new QPushButton("按钮2");
    QPushButton* btn3 = new QPushButton("按钮3");
    QHBoxLayout* layout = new QHBoxLayout();
    layout->addWidget(btn1);
    layout->addWidget(btn2);
    layout->addWidget(btn3);
    this->setLayout(layout);
}

代码示例2：嵌套的布局管理器

cpp 复制代码

Widget::Widget(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::Widget)
{
    ui->setupUi(this);
    QPushButton* button1=new QPushButton("按钮1",this);
    QPushButton* button2=new QPushButton("按钮2",this);
    QPushButton* button3=new QPushButton("按钮3",this);
    QPushButton* button4=new QPushButton("按钮4",this);
    QPushButton* button5=new QPushButton("按钮5",this);
    QPushButton* button6=new QPushButton("按钮6",this);
    
    QVBoxLayout* layoutv= new QVBoxLayout();
    this->setLayout(layoutv);
    layoutv->addWidget(button1);
    layoutv->addWidget(button2);
    layoutv->addWidget(button3);

    QHBoxLayout* layouth= new QHBoxLayout();
    this->setLayout(layouth);
    layouth->addWidget(button4);
    layouth->addWidget(button5);
    layouth->addWidget(button6);
    layoutv->addLayout(layouth);

}

3.3 网格布局（QGridLayout）

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

控件按网格排列（M 行 N 列），支持控件跨行列、拉伸比例设置。
核心属性：layoutHorizontalSpacing（水平间距）、layoutVerticalSpacing（垂直间距）、layoutRowStretch/layoutColumnStretch（行/列拉伸比例）。
代码示例1：2 行 2 列网格布局

cpp 复制代码

Widget::Widget(QWidget *parent)
: QWidget(parent), ui(new Ui::Widget)
{
    ui->setupUi(this);
    QPushButton* btn1 = new QPushButton("按钮1");
    QPushButton* btn2 = new QPushButton("按钮2");
    QPushButton* btn3 = new QPushButton("按钮3");
    QPushButton* btn4 = new QPushButton("按钮4");
    QGridLayout* layout = new QGridLayout();
    // 添加控件到网格（行下标，列下标）
    layout->addWidget(btn1, 0, 0);
    layout->addWidget(btn2, 0, 1);
    layout->addWidget(btn3, 1, 0);
    layout->addWidget(btn4, 1, 1);
    this->setLayout(layout);
}

如果将列/行设置为相同（不一定皆为0），则可以实现垂直/水平布局管理器的效果，并且控件之间的间隔不会因为设置的参数过大而变大。

代码示例2：设置水平拉伸系数

cpp 复制代码

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

    QPushButton* button1=new QPushButton("按钮1",this);
    QPushButton* button2=new QPushButton("按钮2",this);
    QPushButton* button3=new QPushButton("按钮3",this);
    QPushButton* button4=new QPushButton("按钮4",this);
    QPushButton* button5=new QPushButton("按钮5",this);
    QPushButton* button6=new QPushButton("按钮6",this);
    QGridLayout* grid=new QGridLayout();
    this->setLayout(grid);

    grid->addWidget(button1,0,0);
    grid->addWidget(button2,0,1);
    grid->addWidget(button3,0,2);
    grid->addWidget(button4,1,0);
    grid->addWidget(button5,1,1);
    grid->addWidget(button6,1,2);

    //设置水平拉伸系数
    //第 0 列拉伸比例为 1
    grid->setColumnStretch(0,1);
    //第 1 列不参与拉伸，保持固定大小
    grid->setColumnStretch(1,0);
    //第 2 列拉伸比例为 2
    grid->setColumnStretch(2,2);

}

代码示例3：设置垂直拉伸系数

按钮默认的尺寸策略是Preferred（保持自身理想尺寸），只会维持默认/设置的固定尺寸，不会主动填充布局分配的额外空间，直接设垂直拉伸系数的效果不明显。

------ 将按钮的sizePolicy设为Expanding，让按钮具备"根据布局空间调整尺寸、尽可能填充布局"的能力，布局的行拉伸系数才能生效，按钮才会随布局的空间分配放大/缩小。

属性值	说明
QSizePolicy::Ignored	忽略控件的尺寸，不对布局的空间分配产生影响
QSizePolicy::Minimum	控件的最小尺寸为固定值，布局时不会超过该最小尺寸
QSizePolicy::Maximum	控件的最大尺寸为固定值，布局时不会小于该最大尺寸
QSizePolicy::Preferred	控件的理想尺寸为固定值，布局时会尽量接近该理想尺寸
QSizePolicy::Expanding	控件的尺寸可以根据空间调整，尽可能占据更多布局空间
QSizePolicy::Shrinking	控件的尺寸可以根据空间调整，尽可能缩小以适配布局空间

cpp 复制代码

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

    QPushButton* button1=new QPushButton("按钮1",this);
    QPushButton* button2=new QPushButton("按钮2",this);
    QPushButton* button3=new QPushButton("按钮3",this);
    QPushButton* button4=new QPushButton("按钮4",this);
    QPushButton* button5=new QPushButton("按钮5",this);
    QPushButton* button6=new QPushButton("按钮6",this);
    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);

    QGridLayout* grid=new QGridLayout();
    this->setLayout(grid);

    grid->addWidget(button1,0,0);
    grid->addWidget(button2,0,1);
    grid->addWidget(button3,1,0);
    grid->addWidget(button4,1,1);
    grid->addWidget(button5,2,0);
    grid->addWidget(button6,2,1);

    //设置垂直拉伸系数
    grid->setRowStretch(0,1);
    grid->setRowStretch(1,0);
    grid->setRowStretch(2,2);
}

3.4 表单布局（QFormLayout）

两列表单布局（左侧标签，右侧输入控件），适合用户信息填写场景。
使⽤ addRow ⽅法来添加⼀⾏，每⾏包含两个控件第⼀个控件固定是 QLabel / ⽂本，第⼆个控件则可以是任意控件，如果把第⼀个参数填写为 NULL，则什么都不显⽰
代码示例：个人信息表单

cpp 复制代码

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

    QLabel* label1=new QLabel("姓名",this);
    QLabel* label2=new QLabel("年龄",this);
    QLabel* label3=new QLabel("电话",this);
    QLineEdit* edit1=new QLineEdit(this);
    QLineEdit* edit2=new QLineEdit(this);
    QLineEdit* edit3=new QLineEdit(this);

    QPushButton* button=new QPushButton("commit",this);

    QFormLayout* form=new QFormLayout();
    form->addRow(label1,edit1);
    form->addRow(label2,edit2);
    form->addRow(label3,edit3);
    form->addRow(nullptr,button);
    this->setLayout(form);

}

3.5 Spacer（空白间隔）

属性	说明
width	QSpacerItem的宽度
height	QSpacerItem的高度
hData	水平方向的尺寸策略（QSizePolicy），可选值： - `Ignored`：忽略尺寸，不影响布局 - `Minimum`：最小尺寸固定，布局不超该值 - `Maximum`：最大尺寸固定，布局不小于该值 - `Preferred`：理想尺寸固定，布局尽量接近该值 - `Expanding`：尺寸随空间调整，尽可能占更多空间 - `Shrinking`：尺寸随空间调整，尽可能缩小适配
vData	垂直方向的尺寸策略（QSizePolicy），可选值与`hData`的选项完全一致

用于在布局中添加空白间隔，调整控件间距，支持水平/垂直方向。
代码示例1：两个按钮中间添加水平间隔

cpp 复制代码

Widget::Widget(QWidget *parent)
: QWidget(parent), ui(new Ui::Widget)
{
    ui->setupUi(this);
    QPushButton* btn1 = new QPushButton("按钮1");
    QPushButton* btn2 = new QPushButton("按钮2");
    QHBoxLayout* layout = new QHBoxLayout();
    // 创建水平间隔（宽度200，高度20）
    QSpacerItem* spacer = new QSpacerItem(200, 20);
    layout->addWidget(btn1);
    layout->addSpacerItem(spacer); // 添加间隔
    layout->addWidget(btn2);
    this->setLayout(layout);
}

还可以直接通过Qt designer添加