目录
[1. 浮动窗口](#1. 浮动窗口)
[1.1 浮动窗口的创建](#1.1 浮动窗口的创建)
[1.2 设置停靠的位置](#1.2 设置停靠的位置)
[2. 对话框](#2. 对话框)
[2.1 对话框简介](#2.1 对话框简介)
[2.2 对话框的分类](#2.2 对话框的分类)
[2.3 自定义对话框](#2.3 自定义对话框)
[2.4 Qt 内置对话框](#2.4 Qt 内置对话框)
[2.4.1 消息对话框 QMessageBox](#2.4.1 消息对话框 QMessageBox)
[2.4.2 颜色对话框 QColorDialog](#2.4.2 颜色对话框 QColorDialog)
[2.4.3 文件对话框 QFileDialog](#2.4.3 文件对话框 QFileDialog)
[2.4.4 字体对话框 QFontDialog](#2.4.4 字体对话框 QFontDialog)
[2.4.5 输入对话框 QInputDialog](#2.4.5 输入对话框 QInputDialog)
1. 浮动窗口
在 Qt 中,浮动窗口也称之为铆接部件。浮动窗口是通过 QDockWidget类来实现浮动的功能。浮动窗口一般是位于核心部件的周围,可以有多个。
1.1 浮动窗口的创建
浮动窗口的创建是通过 QDockWidget 类提供的构造方法 QDockWidget() 函数动态创建的。
示例:

1.2 设置停靠的位置
浮动窗口是位于中心部件的周围。可以通过 QDockWidget类 中提供 setAllowedAreas() 函数设置其允许停靠的位置。其中可以设置允许停靠的位置有:
- Qt::LeftDockWidgetArea 停靠在左侧
- Qt::RightDockWidgetArea 停靠在右侧
- Qt::TopDockWidgetArea 停靠在顶部
- Qt::BottomDockWidgetArea 停靠在底部
- Qt::AllDockWidgetAreas 以上四个位置都可停靠
不能直接给浮动窗口添加子控件,而是需要创建出一个单独的 QWidget,把需要添加的控件加入到 QWidget 中,然后再把这个 QWidget 设置到 dockWidget 中。
示例如下:设置浮动窗口只允许在左边或者上边停靠:


2. 对话框
2.1 对话框简介
对话框是 GUI 程序中不可或缺的组成部分。一些不适合在主窗口实现的功能组件可以设置在对话框中。对话框通常是一个顶层窗口,出现在程序最上层,用于实现短期任务或者简洁("短平快")的用户交互。Qt 常用的内置对话框有:QFiledialog(文件对话框)、QColorDialog(颜色对话框)、QFontDialog (字体对话框)、QInputDialog (输入对话框)和 QMessageBox(消息框) 。
2.2 对话框的分类
对话框 分为 模态对话框 和 非模态对话框 和 混合属性对话框。
(1)模态对话框
模态对话框 指的是:显示后无法与父窗口进行交互,是一种阻塞式的对话框。使用 QDialog:: exec () 函数调用。
模态对话框适用于必须依赖用户选择的场合,比如消息显示、文件选择、打印设置等。
示例:新建 Qt 项目,在 ui 文件中的菜单栏中设置两个菜单:"文件" 和 "编辑",在菜单 "文件" 下新建菜单项:"创建" 并将菜单项 "新建" 置于工具栏中。
如下图示:

在 mainwindow.cpp 文件中实现:当点击 "新建" 时,弹出一个模态对话框
说明:在菜单项中,点击菜单项时就会触发 **triggered()**信号。

(2)非模态对话框
非模态对话框显示后独立存在,可以同时与父窗口进行交互,是一种非阻塞式对话框,使用 QDialog::show() 函数调用。
非模态对话框⼀般在堆上创建,这是因为如果创建在栈上时,弹出的非模态对话框就会一闪而过。我们需要将 delete 和关闭按钮的点击信号关联起来,在用户点击关闭时触发 delete,所以同时还需要设置 Qt:WA_DeleteOnClose 属性,目的是:当创建多个非模态对话框时(如打开了多个非模态窗口),为了避免内存泄漏要设置此属性。
非模态对话框适用于特殊功能设置的场合,比如查找操作,属性设置等。
示例:

(3)混合属性对话框
混合属性对话框同时具有模态对话框和非模态对话框的属性,对话框的生成和销毁具有非模态对话框属性,功能上具有模态对话框的属性。
使用 QDialog::setModal() 函数可以创建混合特性的对话框。通常,创建对话框时需要指定对话框的父组件。
示例:

2.3 自定义对话框
(1)通过代码的方式




展示效果:


(2)通过图形化界面的方式
新增一个 ui 文件:




完成之后新增的文件:

选择 dialog.ui,创建一个 Push Button 和一个 Label:

代码:


展示效果:


2.4 Qt 内置对话框
Qt 提供了多种可复用的对话框类型,即 Qt 标准对话框。Qt 标准对话框全部继承于 QDialog类。常用标准对话框如下:

2.4.1 消息对话框 QMessageBox
消息对话框是应用程序中最常用的界面元素。消息对话框主要用于为用户提示重要信息,强制用户进行选择操作。
QMessageBox 类中定义了静态成员函数,可以直接调用创建不同风格的消息对话框,其中包括:



其对应的函数原型如下:

实现一个警告提示信息对话框:

实现效果如下:


其中可以设置的按钮的类型如下:

更改消息对话框中的按钮类型:

实现效果如下:

类似的,**问题(Question)/ 信息(Information)/ 错误(Critical)**提示对话框效果图如下:



2.4.2 颜色对话框 QColorDialog
Qt QColorDialog 的功能就是内置了调色板,效果和下面看到的画图板的调色板非常类似。
颜色对话框的功能是允许用户选择颜色。继承自 QDialog 类。颜色对话框如下图示:

常用方法介绍:
创建对象的同时设置父对象:
QColorDialog (QWidget *parent = nullptr)
创建对象的同时通过 QColor 对象设置默认颜色和父对象:QColorDialog(const QColor &initial, QWidget *parent = nullptr)
设置当前颜色对话框:void setCurrentColor(const QColor &color)
获取当前颜色对话框:QColor currentColor() const
打开颜色,选择对话框,并返回一个QColor对象:QColor getColor(const QColor &initial = Qt::white, QWidget *parent = nullptr, const QString &title = QString(), QColorDialog::ColorDialogOptions options = ColorDialogOptions())
参数说明:
- initial:设置默认颜色
- parent:设置父对象
- title:设置对话框标题
- options:设置选项
打开颜色对话框:
void open(QObject *receiver, const char *member)
修改窗口的背景色,操作示例:

效果如下:

2.4.3 文件对话框 QFileDialog
文件对话框用于应用程序中需要打开一个外部文件或需要将当前内容存储到指定的外部文件。
常用方法介绍:
打开文件(一次只能打开一个文件)
QString getOpenFileName (QWidget *parent = nullptr, const QString &caption = QString(), const QString &dir = QString(), const QString &filter = QString(), QString *selectedFilter = nullptr, QFileDialog::Options options = Options())
打开多个文件(一次可以打开多个文件)QStringList getOpenFileNames (QWidget *parent = nullptr, const QString &caption = QString(), const QString &dir = QString(), const QString &filter = QString(), QString *selectedFilter = nullptr, QFileDialog::Options options = Options())
保存文件QString getSaveFileName (QWidget *parent = nullptr, const QString &caption = QString(), const QString &dir = QString(), const QString &filter = QString(), QString *selectedFilter = nullptr, QFileDialog::Options options = Options())
参数说明:
- 参数 1:parent 父亲
- 参数 2:caption 对话框标题
- 参数 3:dir 默认打开的路径
- 参数 4:filter 文件过滤器
打开和保存文件,操作示例:
这里的打开 / 保存功能都是需要额外去实现的,并不是说按了打开 / 保存就真的打开 / 保存了。

运行效果:


2.4.4 字体对话框 QFontDialog
Qt 中提供了预定义的字体对话框类 QFontDialog,用于提供选择字体的对话框部件。
示例:

运行效果如下:

2.4.5 输入对话框 QInputDialog
Qt 中提供了预定义的输入对话框 类:QInputDialog,用于进行临时数据输入的场合。
常用方法介绍:
双精度浮点型输入数据对话框
double getDouble (QWidget *parent, const QString &title, const QString &label, double value = 0, double min = -2147483647, double max = 2147483647, int decimals = 1, bool *ok = nullptr, Qt::WindowFlags flags = Qt::WindowFlags());
整型输入数据对话框int getInt (QWidget *parent, const QString &title, const QString &label, int value = 0, int min = -2147483647, int max = 2147483647, int step = 1, bool *ok = nullptr, Qt::WindowFlags flags = Qt::WindowFlags());
选择条目型输入数据框QString getItem (QWidget *parent, const QString &title, const QString &label, const QStringList &items, int current = 0, bool editable = true, bool *ok = nullptr, Qt::WindowFlags flags = Qt::WindowFlags(), Qt::InputMethodHints inputMethodHints = Qt::ImhNone) ;
参数说明:
- parent:父亲
- title:对话框标题
- label:对话框标签
- items:可供选择的条目
整型数据输入对话框

运行效果:

浮点型数据输入对话框

运行效果:

打开选择条目对话框

运行效果:

本篇完。
下一篇是Qt开发⑨Qt的事件_事件处理_按键事件和鼠标事件。