day04（Qt）UI设计

目录

UI设计

1. Designer 设计师（掌握）

2. Layout 布局（重点）

2.1 基本使用

2.2 高级用法

2.3 代码布局（了解）

3. Designer与C++的关系（熟悉）

4. 基本组件（掌握）

4.1 QWidget

4.2 QLabel 标签

4.3 QAbstractButton 按钮类

4.4 QLineEdit 单行文本输入框

4.5 QComboBox 组合框

4.6 一组与数字相关的组件

---

UI设计

1. Designer 设计师（掌握）

Designer是Qt内置的一款界面设计程序，设计的界面文件为.ui格式。

C++程序员通常不会单独启动Designer，如果要在项目中使用Designer程序，只需要在新建项目时，勾选“创建界面文件”选项。

这样的项目自带dialog.ui，双击dialog.ui可以直接使用Designer程序打开此文件。

2. Layout 布局（重点）

2.1 基本使用

可以把布局看做是一个透明的盒子，内部放置各种组件对象，这些组件对象会按照布局预设的规则自动排序，并形成一个布局整体。

Qt中有四种布局：

主要学习前两种，垂直/水平布局指的是布局中所有的子组件垂直/水平排成一排，常用属性如下：

需要注意的是，最终的显示效果是多个因素综合决定的，并非一个因素完全决定。

2.2 高级用法

• 伸展器

如果需要在布局中填充空白，可以使用伸展器组件。

• 嵌套

布局和布局之间可以嵌套，内层布局相当于外层布局的一个组件。

• 贴合

选中窗口对象，点击，可以让最外层布局贴合窗口，以达到窗口大小自适应效果。

可以点击打破任何一个选中的布局，例如取消贴合效果，需要先选中窗口，然后点击此按钮。

2.3 代码布局（了解）

也可以使用C++进行布局，仅做展示。

dialog.h

#ifndef DIALOG_H
#define DIALOG_H

#include <QDialog>
#include <QVBoxLayout>
#include <QPushButton>

class Dialog : public QDialog
{
     
    Q_OBJECT

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

private:
    QVBoxLayout* layout;
    QPushButton* btn1;
    QPushButton* btn2;
};

#endif // DIALOG_H

dialog.cpp

#include "dialog.h"

Dialog::Dialog(QWidget