3、水平布局 QHBoxLayout：创建水平排列的按钮组、设置间距与边距、添加弹簧 (addStretch) 控制对齐

水平布局，说白了就是把控件从左到右排成一排。这是 Qt 里最常用的布局之一，也是我最早接触的布局方式。记得我刚学 Qt 那会儿，觉得布局不就是把按钮放上去嘛，有啥难的？结果做出来的界面要么挤成一团，要么间距大得离谱。嗯，今天咱们就把 QHBoxLayout 彻底讲透。

3.1 创建水平排列的按钮组

先看一个最简单的例子。假设我们要做三个按钮，水平排开：

QHBoxLayout *layout = new QHBoxLayout;

QPushButton *btn1 = new QPushButton("打开");
QPushButton *btn2 = new QPushButton("保存");
QPushButton *btn3 = new QPushButton("关闭");

layout->addWidget(btn1);
layout->addWidget(btn2);
layout->addWidget(btn3);

// 把这个布局设置到窗口上
QWidget *window = new QWidget;
window->setLayout(layout);

代码很简单，对吧？但这里有个细节——addWidget() 的顺序决定了控件从左到右的排列顺序。我在项目中遇到过有人把顺序搞反了，结果「关闭」按钮跑到了最左边，用户一脸懵。

3.2 设置间距与边距

刚才的代码跑起来，你会发现按钮之间几乎没有空隙，紧挨着。这通常不是我们想要的效果。这时候就需要设置间距（spacing）和边距（margin）了。

间距（Spacing）

间距控制的是布局内相邻控件之间的空白距离。设置方法有两种：

// 方法一：在构造时设置
QHBoxLayout *layout = new QHBoxLayout;
layout->setSpacing(10);  // 每个按钮之间留 10 像素

// 方法二：在 addWidget 时单独设置
layout->addWidget(btn1, 0, Qt::AlignLeft);
layout->addSpacing(20);  // 在 btn1 和 btn2 之间插入 20 像素空白
layout->addWidget(btn2);

我个人习惯用 setSpacing() 统一设置，除非某个特殊位置需要更大的间距。比如在「保存」和「删除」按钮之间留更多空间，避免用户误操作——我曾经就因为这个设计，帮客户减少了不少误点击的投诉。

边距（Margin / Contents Margins）

边距是布局整体与窗口边缘之间的空白。Qt 里用 setContentsMargins() 来控制：

layout->setContentsMargins(10, 5, 10, 5);
// 参数顺序：左、上、右、下

这里有个坑，我踩过好几次：默认的边距可能不是 0。不同平台、不同 Qt 版本，默认值可能不一样。Windows 上可能是 11 像素，macOS 上可能是 20 像素。所以如果你发现控件贴边了或者离边缘太远，先检查一下边距设置。

3.3 添加弹簧 (addStretch) 控制对齐

这是 QHBoxLayout 最强大的功能之一。弹簧（Stretch）本质上是一个可伸缩的空白区域，它会自动占据剩余空间，把控件「推」到你想放的位置。

基本用法

QHBoxLayout *layout = new QHBoxLayout;

layout->addStretch();       // 左边加一个弹簧
layout->addWidget(btn1);
layout->addWidget(btn2);
layout->addStretch();       // 右边加一个弹簧
// 效果：两个按钮居中显示

为什么会这样？因为弹簧会吃掉所有多余的空间。左右各一个弹簧，它们平分剩余空间，按钮就被挤到中间了。

弹簧的权重

addStretch() 可以传一个整数参数，表示弹簧的「伸缩因子」。数值越大，这个弹簧占的空间越多。

layout->addStretch(1);      // 左边弹簧权重 1
layout->addWidget(btn1);
layout->addStretch(3);      // 右边弹簧权重 3
// 效果：按钮偏左，因为右边弹簧占的空间是左边的 3 倍

这个权重机制，说白了就是按比例分配剩余空间。我在做工具栏布局时经常用这个技巧——把「帮助」按钮推到最右边，其他按钮靠左排列：

layout->addWidget(btnOpen);
layout->addWidget(btnSave);
layout->addStretch();       // 弹簧把后面的按钮推到右边
layout->addWidget(btnHelp);

实战：一个典型的对话框按钮布局

很多对话框的「确定」「取消」按钮都在右下角。用弹簧实现起来很简单：

QHBoxLayout *buttonLayout = new QHBoxLayout;
buttonLayout->addStretch();           // 把所有按钮推到右边
buttonLayout->addWidget(okBtn);
buttonLayout->addWidget(cancelBtn);
buttonLayout->setSpacing(8);          // 按钮之间留 8 像素
buttonLayout->setContentsMargins(0, 10, 10, 10);  // 右边和底部留边距

3.4 知识体系图

下面这张图帮你理清 QHBoxLayout 的核心知识点：

3.5 避坑指南

• 弹簧不是控件：addStretch() 添加的是空白区域，不是 QWidget。你不能对它调用 setStyleSheet() 或者连接信号槽。
• 间距和弹簧不要混用：如果你用了 addStretch()，setSpacing() 的效果可能会被弹簧「稀释」。我建议要么用弹簧控制整体布局，要么用间距微调，别两个一起乱用。
• 嵌套布局时注意边距叠加：如果一个 QHBoxLayout 嵌套在另一个布局里，内外边距会叠加。我曾经做过一个界面，按钮离窗口边缘特别远，查了半天才发现是内外布局各设了 20 像素边距，加起来 40 像素了。

好了，水平布局的核心内容就这些。你想想看，其实 QHBoxLayout 并不复杂——创建按钮组、设置间距边距、用弹簧控制对齐，这三步走下来，大部分水平排列的需求都能搞定。下一节咱们聊垂直布局 QVBoxLayout，原理类似，但方向不同。到时候你会发现，很多技巧是相通的。