qt5开发及实例第四版代码_代码化 UI 设计

UI 的可视化设计是对用户而言的，其实底层都是 C++ 的代码实现，只是 Qt 巧妙地进行了处理，让用户省去了很多繁琐的界面设计工作。

由于界面设计的底层其实都是由 C++ 语言实现的，底层实现的功能比可视化设计更加强大和灵活。某些界面效果是可视化设计无法完成的，或者某些人习惯了用纯代码的方式来设计界面，就可以采用纯代码的方式设计界面，如 Qt 自带的实例基本都是用纯代码方式实现用户界面的。

所以，本节介绍一个用纯代码方式设计 UI 的实例(该实例与上一篇基本相同)，通过实例了解用纯代码设计 UI 的基本原理。与前面的可视化 UI 设计相对应，且称之为代码化 UI 设计。

本篇目录

1. 实例效果

2. 水平布局编组框

3. 完善其余布局

4. 窗口事件

---

运行环境：

    win 10 + Qt 5.12.5 + Qt Creator 4.10

---

1. 实例功能

首先建立一个 Widget Application 项目 BasicLayouts，在创建项目向导中选择基类时，选择基类 QDialog，新类的名称命名为 Dialog，关键是取消创建窗体，即不勾选 "Generate form" 复选框。创建后的项目文件目录树下没有 *.ui 文件。本例完成后的运行效果如下图所示

2. 水平布局编组框

在上述新建项目 BasicLayouts 的 dialog.h 中添加如下加粗代码，用于实现界面中的第一个编组框。

#ifndef DIALOG_H
#define DIALOG_H

#include 
#include 
#include 

class Dialog : public QDialog
{
    
    Q_OBJECT

public:
    Dialog(QWidget *parent = nullptr);
    ~Dialog();

private:
    void createHorizontalGroupBox();

    QGroupBox *horizontalGroupBox;
    QPushButton *buttons[4];
};
#endif // DIALOG_H

其中，

• 加入实现 GroupBox 和 PushButton 控件的头文件

• 定义界面中 GroupBox 和 PushButton 控件对象(4 个)