一 | Qt简介(Build your world with Qt) |
二 | Qt5.7.0的安装 |
三 | Qt系统构造库及常用类 |
四 | 信号(signal)与槽(slot)通信机制 |
五 | QtDesigner开发工具的使用 |
六 | 登录对话框程序的编写 |
七 | 文件、文本的基本操作 |
八 | 字体、颜色对话框的使用 |
九 | 停靠/堆栈/分割窗口的介绍 |
十 | QWebEngineWidgets的介绍 |
十一 | 图表程序的开发 |
十二 | 记事本程序的开发 |
十三 | 基于QWebEngineView实现一个简易的浏览器 |
一.Qt简介
Qt是一个跨平台的C++图形用户界面应用程序框架。它为应用程序开发者提供建立艺术级图形用户界面所需的所有功能。它是完全面向对象的,很容易扩展,并且允许真正的组件编程。
Qt按照不同的版本发行,分为商业版和开源版。Qt商业版为商业软件提供开发,它们提供传统商业软件发行版并且提供在协议有效期内的免费升级和技术支持服务。而Qt开源版是为了开发自由而设计的开放源码软件,它提供了和商业版本同样的功能,在GNU通用公共许可证下,它是免费的。
Qt支持的主流平台有:
MS/Windows------95、98、NT4.0、windows7/8/10/XP;
UNIX/X11------Linux、Sun Solaris、HP-UX、CompaqTru64 UNIX、IBM AIX、SGI IRIX和其他很多X11平台;
Macintosh------Mac OS X;
Embedded------有帧缓冲(framebuffer)支持的Linux平台、Windows CE。
二、Qt5.7.0的安装
本文主要介绍Qt5.7.0 for windows 64-bit(VS2013,904MB)开发工具在Windows 10 Professional OS环境下的安装。下载网址:https://www.qt.io/download-open-source/#section-2。需要下载的安装包如下图1和图2所示。
安装步骤:
step1:首先安装Qt5.7.0 for windows 64-bit(VS2013,904MB);
step2:其次安装Visual Studio Add-in 1.2.5 for Qt5插件;
step3:系统环境变量配置;
step4:建立Qt工程验证安装成功。
安装图解:
须申请注册一个Qt Account,方可进入安装界面如图3-图6所示;
图3
安装完成后,配置系统环境变量,如下图7所示;
打开VS2013后,会在菜单栏显示Qt5,依次点击Qt5->Qt Options->Add,然后按下图8红色区域填写相应内容;
配置成功后,会有如下图9和图10所示内容。
建立Qt工程
建立工程(QHello)图解如下图11所示:
图11
图12
图13
图14
工程建立好以后,双击解决方案列表中的Form Files->qhello.ui进入Qt Designer设计师界面,然后从Qt designer 布局界面的左侧部件编辑区域中(Widget Box)中拖拽一个PushButton 到主界面上,单击右键更改其显示文本为Hello Qt以及对象名称为helloQtBtn。当然你还可以通过更改样式表改变控件的颜色、字体、大小,背景图片等元素。,这里我给主窗口加了一副Border imag图片,目的是为了适应窗口大小的改变,界面布局如下图15所示。
图15
主界面布局完成后,再在Qt Designer设计师界面中新建一个qtdlg.ui的对话框,然后从Widget Box中拖拽一个Label控件,更改其文本显示为:Build your world with Qt,同样的可以更改其样式表修改或添加你喜爱的风格。这里布局的界面如下图16所示。
qtdlg.ui布局完成后,将它添加到解决方案中Form files目录下与qhello.ui并列,然后编译,编译完成后会在解决方案中的Generated Files 目录下生成一个ui_qtdlg.h的文件。此时,分别添加一个qtdlg.h头文件和一个qtdlg.cpp源文件。
然后添加相应的内容,这里面有一个技巧:qtdlg.h里的内容可以从qhello.h里复制,然后做对应的更改(只要学过C++的应该都会,默认大家都会了),同理qtdlg.cpp里的内容也可以参照qhello.cpp文件里的内容修改,其实也就是一个构造函数和一个析构函数的添加,基类改成QDialog,相关头文件也要做相应更改。再次编译成功后,需要在qhello.h文件中包含头文件#include”qtdlg.h”,在下面的QHello类中定义一个私有槽[ private slots:void helloQtBtnSlot();]用来与Hello Qt这个pushbutton进行通信。代码:
void QHello::helloQtBtnSlot()
{
Qtdlg *dlg=new Qtdlg;//非模态对话框
dlg ->show();
}
然后需要在QHello构造函数中用connect函数做一个连接,代码:
QObject::connect(ui.helloQtBtn,SIGNAL(clicked()),this,SLOT(helloQtBtnSlot()));
最后按F5调试运行,点击Hello Qt,弹出一个带有Build your world with Qt字样的对话框。如上图15和16所示。
三、Qt系统构造库及类
Qt系统主要有以下模块构成,如下表一所示:
表1:Qt系统构造
ActiveQt | Qt中活动控件类模块,包含ActiveX和COM |
Qt3DCore | Qt3D仿真框架的基础类模块 |
Qt3DInput | Qt3D输入类模块 |
Qt3DLogic | Qt帧同步类模块 |
Qt3DQuick | 使用QML处理3D内容,基于OpenGL |
Qt3DQuickInput | Qt3DQuick输入类模块 |
Qt3DQuickRender | Qt3DQuick渲染类模块 |
Qt3DRender | Qt3D渲染类模块 |
QtANGLE | 提供OpenGL驱动或Directx驱动的类模块 |
QtBluetooth | Qt蓝牙通信类模块 |
QtCharts | Qt 图表组件库类模块 |
QtCLucene | Qt文本搜索引擎类模块 |
QtConcurrent | Qt高层次API类模块 |
QtCore | Qt核心非GUI类模块 |
QtDataVisualization | Qt可视化编程类模块 |
QtDBus | Qt高级进程间通信机制类模块 |
QtDesigner | Qt设计师类模块 |
QtDesignerComponents | Qt设计师组件类模块 |
QtGamepad | Qt游戏手柄类模块 |
QtGui | Qt核心GUI类模块 |
QtHelp | Qt帮助类模块 |
QtLocation | Qt地图场景类模块 |
QtMultimedia | Qt多媒体类模块 |
QtMultimediaWidgets | Qt多媒体控件类模块 |
QtNetwork | Qt网络类模块 |
QtNfc | Qt近场通信类模块 |
QtOpenGL | Qt开源图形库类模块 |
QtOpenGLExtensions | Qt开源图形库拓展类模块 |
QtPacketProtocol | Qt网络驱动协议类模块 |
QtPlatformHeaders | Qt平台标题类模块 |
QtPlatformSupport | Qt平台支持类模块 |
QtPositioning | Qt定位类模块 |
QtPrintSupport | Qt打印支持类模块 |
QtPurchasing | Qt采购类模块 |
QtQml | QtQml主要实现与JavaScript集成 |
QtQmlDebug | Qml调试类模块 |
QtQmlDevTools | Qml开发支持类模块 |
QtQuick | 编写Qml应用标准类库 |
QtQuickControls2 | QtQuick控件模块 |
QtQuickParticles | QtQuick粒子类模块 |
QtQuickTemplates2 | QtQuick模板类库模块 |
QtQuickTest | QtQuick测试类模块 |
QtQuickWidgets | QtQuick部件类模块 |
QtScript | Qt脚本类模块 |
QtScriptTools | Qt脚本工具类模块 |
QtScxml | Qt脚本可扩展编程语言类模块 |
QtSensors | Qt传感器类模块 |
QtSerialBus | Qt串行总线类模块 |
QtSerialPort | Qt串口类模块 |
QtSql | Qt数据库类模块 |
QtSvg | Qt透视图类模块 |
QtTest | Qt测试类模块 |
QtUiPlugin | QtUi插件类模块 |
QtUiTools | QtUi工具类模块 |
QtWebChannel | Qt网络通信类模块 |
QtWebEngine | Qt网络引擎类模块 |
QtWebEngineCore | Qt网络引擎核心非Gui类模块 |
QtWebEngineWidgets | Qt网络引擎核心Gui类模块 |
QtWebSockets | Qt网络套接字类模块 |
QtWebView | Qt网络视图类模块 |
QtWidgets | Qt部件编程类模块 |
QtXml | Qt可扩展标记语言模块 |
QtXmlPatterns | QtXml模式类模块 |
QtZlib | Qt压缩/解压类模块 |
常用到的类如下表2所示:
表2:Qt编程常用类
主要的类 | 描述 |
抽象窗口部件类 | 抽象窗口部件类是通过子类来使用的 |
高级窗口部件类 | 高级的GUI窗口部件,比如列表视图、进度条等 |
基本窗口部件类 | 基本的GUI窗口部件,比如按钮、组合框、滚动条 |
数据库类 | 与数据库相关的类,比如与SQL数据库相关的类 |
日期与时间类 | 处理日期与时间的类 |
事件类 | 用来生成和处理事件的类 |
环境类 | 提供了多样全面的服务,比如事件处理,系统设置等 |
布局管理类 | 调整窗口部件大小的位置,能够构成复杂对话框的类 |
共享类 | 为了快速复制而引用计数的类 |
帮助系统类 | 用来给应用程序提供在线帮助的类 |
多媒体、图形、打印类 | 处理图形(2D,3D、OpenGL)和图像的编码和解码以及提供声音,动画、打印等服务 |
四、信号(signal)与槽(slot)通信机制
Qt提供了一种信号和槽的通信机制用于完成界面操作的响应,通过connect函数完成任意两个Qt对象之间的通信。其中,信号会在某个特定的情况或动作下被触发,槽是等同于接收并处理信号的函数。如下图17所示Qt中信号与槽的通信机制示意图
观上图可知信号与槽的通信方式:
1. 同一个信号可以与多个槽相连
2.同一个槽可以响应多个信号
五、QtDesigner开发工具的使用
熟悉Qtdesigner界面开发环境,如图18所示。
图18
六、登录对话框程序的编写
界面如下图19所示。(代码就补贴了( ̄▽ ̄)")
图19
主要代码:
//登录到主界面
void Dialog::on_signInBtn_clicked()
{
if (ui->userlineEdit->text() == "hello"&&ui->passwordlineEdit->text() == "qt2016")
{
logindlg = new MainWindow;
logindlg->show();
this->close();
}
else
{
QMessageBox::information(this, "登录失败", "用户名或密码错误请重新登录");
return;
}
}
主界面
如下图20所示。
未完待续~