45 布局方法和布局管理器

为什么要布局？

对于一个完善的软件，布局管理却是必不可少的。无论是想要界面中部件有一个很整齐的排列，还是想要界面能适应窗口的大小变化，都要进行布局管理。Qt中主要提供了QLayout类及其子类来作为布局管理器，它们可以实现常用的布局管理功能。

布局管理系统

Qt的布局管理系统提供了简单而强大的机制来自动排列一个窗口中的部件，确保它们有效的使用空间。Qt包含了一组布局管理类来描述怎样在应用程序的用户界面中对部件进行布局，比如QLayout的几个子类，我们这里将它们称作布局管理器。

所有的QWidget类的子类的实例（对象）都可以使用布局管理器来管理位于它们之中的子部件，

QWidget::setLayout()函数可以在一个部件上应用布局管理器。

一旦一个部件上设置了布局管理器，那么它会完成以下几种任务：

1. 定位子部件
2. 感知窗口默认大小
3. 感知窗口最小大小
4. 改变大小处理
5. 当内容改变时自动更新：

• 字体大小，文本或子部件的其他内容随之改变
• 隐藏或显示子部件
• 移除一个子部件

1 布局管理器

QLayout类是布局管理器的基类，它是一个抽象基类。该类继承自QObject和QLayoutItem类，而QLayoutItem类提供了一个供QLayout操作的抽象项目。QLayout和QLayoutItem都是在设计自己的布局管理器时才使用的，一般只需要使用QLayout的几个子类就可以了，它们分别是：

• QBoxLayout（基本布局管理器）
• QGridLayout（栅格布局管理器）
• QFormLayout（窗体布局管理器）
• QStackedLayout（栈布局管理器）

2 部件随窗口变化大小

在设计模式中向界面上拖入一个字体选择框Font Combo Box和一个文本编辑器Text Edit部件。然后点击主界面，并按下Ctrl+L快捷键，这样便设置了垂直布局管理器，可以看到两个部件已经填满了整个界面。这时运行程序，然后拉伸窗口，两个部件会随着窗口的大小变化而变化，这就是布局管理器在起作用。

3 基本布局管理器（QBoxLayout）

基本布局管理器QBoxLayout类可以使子部件在水平方向或者垂直方向排成一列，它将所有的空间分成一行盒子，然后将每个部件放入一个盒子中。它有两个子类QHBoxLayout水平布局管理器和QVBoxLayout垂直布局管理器。布局管理器的几个属性如下表所示。

使用代码实现水平布局

QHBoxLayout *layout = new QHBoxLayout;      // 新建水平布局管理器

layout->addWidget(ui->fontComboBox);        // 向布局管理器中添加部件

layout->addWidget(ui->textEdit);

layout->setSpacing(50);                     // 设置部件间的间隔

layout->setContentsMargins(0, 0, 50, 100); // 设置布局管理器到边界的距离，
                                           // 四个参数顺序是左，上，右，下
setLayout(layout);

水平布局（QBoxLayout）

QHBoxLayout：把子窗口从左到右排列在一个水平行上。

QWidget * HBoxWindow = new QWidget;
QPushButton *button1 = new QPushButton("One");
QPushButton *button2 = new QPushButton("Two");
QPushButton *button3 = new QPushButton("Three");
QPushButton *button4 = new QPushButton("Four");
QPushButton *button5 = new QPushButton("Five");
QHBoxLayout *layout = new QHBoxLayout;
layout->addWidget(button1);layout->addWidget(button2);
layout->addWidget(button3);layout->addWidget(button4);
layout->addWidget(button5); 
HBoxWindow >setLayout(layout);
HBoxWindow >show();

垂直布局（QBoxLayout）

QVBoxLayout：把子窗口从上到下排列在一个垂直列上。

QWidget *VBoxWindow = new QWidget;
QPushButton *button1 = new QPushButton("One");
QPushButton *button2 = new QPushButton("Two");
QPushButton *button3 = new QPushButton("Three");
QPushButton *button4 = new QPushButton("Four");
QPushButton *button5 = new QPushButton("Five");
QVBoxLayout *layout = new QVBoxLayout;
layout->addWidget(button1);layout->addWidget(button2);
layout->addWidget(button3);layout->addWidget(button4);
layout->addWidget(button5); VBoxWindow >setLayout(layout);
VBoxWindow >show();

4 栅格布局管理器（QGridLayout）

栅格布局管理器QGridLayout类使得部件在网格中进行布局，它将所有的空间分隔成一些行和列，行和列的交叉处就形成了单元格，然后将部件放入一个确定的单元格中。

QWidget *Gridwindow = new QWidget;
QPushButton *button1 = new QPushButton("One");
QPushButton *button2 = new QPushButton("Two");
QPushButton *button3 = new QPushButton("Three");
QPushButton *button4 = new QPushButton("Four");
QPushButton *button5 = new QPushButton("Five");
QGridLayout *layout = new QGridLayout;
layout->addWidget(button1, 0, 0);layout->addWidget(button2, 0, 1);
layout->addWidget(button3, 1, 0, 1, 2);layout->addWidget(button4, 2, 0);
layout->addWidget(button5, 2, 1); Gridwindow >setLayout(layout);
Gridwindow >show();

例如：

QGridLayout *layout = new QGridLayout;
// 添加部件，从第0行0列开始，占据1行2列
layout->addWidget(ui->fontComboBox, 0, 0, 1, 2);
// 添加部件，从第0行2列开始，占据1行1列
layout->addWidget(ui->pushButton, 0, 2, 1, 1);
// 添加部件，从第1行0列开始，占据1行3列
layout->addWidget(ui->textEdit, 1, 0, 1, 3);
setLayout(layout);

说明：当部件加入到一个布局管理器中，然后这个布局管理器再放到一个窗口部件上时，这个布局管理器以及它包含的所有部件都会自动重新定义自己的父对象（parent）为这个窗口部件，所以在创建布局管理器和其中的部件时并不用指定父部件。

5 窗体布局管理器（QFormLayout）

窗体布局管理器QFormLayout类用来管理表单的输入部件和与它们相关的标签。窗体布局管理器将它的子部件分为两列，左边是一些标签，右边是一些输入部件，比如行编辑器或者数字选择框等。

例如：     在设计模式，从部件栏中找到Form Layout，将其拖入到界面上，然后双击它，或者在它上面点击鼠标右键，选择“添加窗体布局行”菜单。然后在弹出的“添加表单布局行”对话框中填入标签文字“姓名(&N)：”，这样下面便自动填写了“标签名称”、“字段类型”和“字段名称”等，并且设置了伙伴关系。

这里填写的标签文字中（&N），要注意括号必须是英语半角的，表明它的快捷键是Alt+N，设置伙伴关系表示当按下Alt+N时，光标会自动跳转到标签后面对应的行编辑器中。按下确定键，便会在布局管理器中添加一个标签和一个行编辑器。按照这种方法，再添加三行：性别(&S)，使用QComoBox；年龄(&A)，使用QSpinBox；邮箱(&M)，使用QLineEdit。 

可以按下快捷键Alt+N，这样光标就可以定位到“姓名”标签后的行编辑器中。

QWidget *Formwindow = new QWidget;
QPushButton *button1 = new QPushButton("One");
QLineEdit *lineEdit1 = new QLineEdit();
QPushButton *button2 = new QPushButton("Two");
QLineEdit *lineEdit2 = new QLineEdit();
QPushButton *button3 = new QPushButton("Three");
QLineEdit *lineEdit3 = new QLineEdit();
QFormLayout *layout = new QFormLayout;
layout->addRow(button1, lineEdit1);layout->addRow(button2, lineEdit2);
layout->addRow(button3, lineEdit3);Formwindow >setLayout(layout);
Formwindow >show();

6 综合使用布局管理器

将前面的界面再进行设计：按下Ctrl键同时选中界面上的字体选择框fontComboBox和按钮pushButton，然后按下Ctrl+H快捷键将它们放入一个水平布局管理器中。然后再从部件栏中拖入一个Vertical Spacer垂直分隔符，它们是用来在部件间产生间隔的，将它放在表单布局管理器与水平布局管理器之间。    

最后点击主界面，然后按下Ctrl+L快捷键，让整个界面处于一个垂直布局管理器中。这时我们可以在右上角的对象列表中选择分隔符Spacer，然后在属性栏中设置它的高度为100。

7 分裂器(QSplitter) 

分裂器QSplitter类提供了一个分裂器部件。其实它和QBoxLayout很相似，可以完成布局管理器的功能，但是包含在它里面的部件，默认是可以随着分裂器的大小变化而进行相应大小变化的（ QSplitter使得用户可以通过拖动子窗口之间的边界来控制它们的大小）。

比如一个按钮，放在布局管理器中，它的垂直方向默认是不会被拉伸的，但是放到分裂器中就可以被拉伸。

还有一个不同就是，布局管理器是继承自QObject类的，而分裂器却是继承自QFrame类，QFrame类又是继承自QWidget类，也就是说，分裂器拥有QWidget类的特性，它是可见的，而且可以像QFrame一样设置边框。

注意：

再用界面布局时，widget不能处于打破状态

要把widget的垂直布局和水平布局弄好了才能

应该是这种状态