Qt学习22 布局管理器（一）

存在的问题

• 目前的GUI开发方式：绝对定位

  • 直接在像素级指定各个组件的位置和大小

    void QWidget::move(int x, int y)

    void QWidget::resize(int x, int y)

• 问题：

  • 组件的位置和大小无法自适应父窗口的变化

布局管理器

• 解决方案：布局管理器
  • 提供相关的类对界面组件进行布局管理
    • 能够自动排列窗口中的界面组件
    • 窗口变化后自动更新组件的大小
• QLayout是Qt中布局管理器的抽象基类
• 通过继承QLayout实现了功能各异且互补的布局管理器
• Qt中可以根据需要自定义布局管理器
• 布局管理器不是界面部件，而是界面部件的定位策略

• QBoxLayout布局管理器
  • 以水平或者垂直的方式管理界面组件

• 布局管理器可以相互嵌套，形成更加复杂的布局方式
  • 布局嵌套几乎可以完成所有常用的界面布局
  • 自定义布局类可以达到个性化界面布局的效果
• QBoxLayout嵌套实例

代码实验

#ifndef WIDGET_H
#define WIDGET_H

#include <QWidget>
#include <QPushButton>

class Widget : public QWidget
{
    Q_OBJECT
private:
    QPushButton TestBtn1;
    QPushButton TestBtn2;
    QPushButton TestBtn3;
    QPushButton TestBtn4;
    void initBtn();
    void initControl();
    void testVBoxLayout();
    void testHBoxLayout();
    void testVHBoxLayout();
public:
    Widget(QWidget *parent = 0);
    ~Widget();
};

#endif // WIDGET_H
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

#include "Widget.h"
#include <QBoxLayout>


Widget::Widget(QWidget *parent) : QWidget(parent),
    TestBtn1(this), TestBtn2(this), TestBtn3(this), TestBtn4(this)
{
    initBtn();			// 初始化按钮控件
    //initControl();    // 绝对定位，无法自适应窗口变化
    //testVBoxLayout(); // 垂直布局管理
    //testHBoxLayout(); // 水平布局管理
    testVHBoxLayout();    // 嵌套布局管理
}

Widget::~Widget()
{

}

void Widget::initBtn()
{
    TestBtn1.setText("Test Button 1");
    TestBtn2.setText("Test Button 2");
    TestBtn3.setText("Test Button 3");
    TestBtn4.setText("Test Button 4");
    // 设置按钮最小大小
    TestBtn1.setMinimumSize(160, 30);
    TestBtn2.setMinimumSize(160, 30);
    TestBtn3.setMinimumSize(160, 30);
    TestBtn4.setMinimumSize(160, 30);
    // 设置按钮大小策略
    TestBtn1.setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    TestBtn2.setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    TestBtn3.setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
    TestBtn4.setSizePolicy(QSizePolicy::Expanding, QSizePolicy::Expanding);
}

void Widget::initControl()
{
    TestBtn1.setText("Test Button 1");
    TestBtn1.move(20, 20);
    TestBtn1.resize(160, 30);

    TestBtn2.setText("Test Button 2");
    TestBtn2.move(20, 70);
    TestBtn2.resize(160, 30);

    TestBtn3.setText("Test Button 3");
    TestBtn3.move(20, 120);
    TestBtn3.resize(160, 30);

    TestBtn4.setText("Test Button 4");
    TestBtn4.move(20, 170);
    TestBtn4.resize(160, 30);
}

void Widget::testVBoxLayout()
{
    QVBoxLayout* layout = new QVBoxLayout();

    // 布局管理器添加窗口控件
    layout->addWidget(&TestBtn1);
    layout->addWidget(&TestBtn2);
    layout->addWidget(&TestBtn3);
    layout->addWidget(&TestBtn4);
    // 布局管理器设置控件间的间距
    layout->setSpacing(20);
    // 设置当前窗口的布局管理器
    setLayout(layout);
}

void Widget::testHBoxLayout()
{
    QHBoxLayout* layout = new QHBoxLayout();
    // 布局管理器添加窗口控件
    layout->addWidget(&TestBtn1);
    layout->addWidget(&TestBtn2);
    layout->addWidget(&TestBtn3);
    layout->addWidget(&TestBtn4);
    // 布局管理器设置控件间的间距
    layout->setSpacing(20);
    // 设置当前窗口的布局管理器
    setLayout(layout);
}

void Widget::testVHBoxLayout()
{
    QHBoxLayout* hLayout1 = new QHBoxLayout();
    QHBoxLayout* hLayout2 = new QHBoxLayout();
    QVBoxLayout* vLayout = new QVBoxLayout();

    hLayout1->addWidget(&TestBtn1);
    hLayout1->addWidget(&TestBtn2);
    hLayout1->setSpacing(20);
    hLayout2->addWidget(&TestBtn3);
    hLayout2->addWidget(&TestBtn4);
    hLayout2->setSpacing(20);
    vLayout->addLayout(hLayout1);
    vLayout->addLayout(hLayout2);
    vLayout->setSpacing(20);
    setLayout(vLayout);
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102

#include "Widget.h"
#include <QApplication>

int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
    Widget w;
    w.show();

    return a.exec();
}
1
2
3
4
5
6
7
8
9
10
11

小结

• 绝对定位的布局方式无法自适应窗口的变化
• Qt提供了相关的类对界面组件进行布局管理
• Qt预定义了功能各异且互补的布局管理器
• 布局管理器能够相互嵌套形成复杂的布局