QT6学习第五天 第一个QT Quick程序

概述

如果将程序的用户界面成为前端，程序的数据存储和逻辑业务成为后端，那么传统QT Widgets程序的前后端都是用C++完成的。对于现代软件开发而言，前端演化速度远快于后端。当要改变界面或重新开发界面时，很难快速只针对前端来开发。
而QT Quick提供了一个适合于开发用户界面的声明式环境。在这里，可以向HTML代码一样声明界面，后端依然使用C++代码。这种设计使得程序的前后端分离，可以分别演化。
QT Quick程序可以同时包含QML和C++代码。可以部署到移动或桌面平台。
在Qt Creator 中，这种项目叫Qt Quick Application。

创建Qt Quick程序

• 新建项目，命名helloworld，这里它默认构建系统为CMake，我也没看见哪里能改。
  
  CMake是一组可以进行构建、测试和打包程序的工具集，它可以在所有主要开发平台上使用，并被多中IDE支持，可以很好的简化跨平台项目的构建过程。QT6中CMake得到了很好的支持，可以自己学习下CMake知识。

因为我看的这本书里用的qmake，所以还得从创建空项目开始，烦死了！

• 我们创建一个空项目，命名helloworld，然后在pro文件中添加 QT += quick

• 添加 main.qml 文件。
  

• 修改 main.qml 文件
  QML代码文件以 .qml 作为后缀，QML是代码语言。

import QtQuick 2.15//window对象用来创建一个顶层窗口
Window{//设置宽高width:640height:480//设置可显示，默认不显示visible:true//设置标题，qsTr() 转换字符，使各种字符都可显示title:qsTr("Hello World!")//Text对象，显示一个字符串Text{id:text1text:qsTr("Hello World! 你好哈哈哈！")//位置放到窗口中心anchors.centerIn:parent}
}

• 添加 main.cpp 文件，并添加代码

#include <QGuiApplication>
#include <QQmlApplicationEngine>//此次主要功能是加载 QML 文件
int main(int argc,char *argv[]){//创建 QGui 应用，和Qwidget应用一样QGuiApplication app(argc,argv);//创建 QQmlApplicationEngine 对象，可加载 QML 文件QQmlApplicationEngine engine;//load() 加载 QML 文件engine.load(QUrl::fromLocalFile("../../main.qml"));return app.exec();
}

运行看看吧

使用Qt资源文件

QT中的资源系统（The Qt Resource System）是一个独立于平台的机制，可以将资源文件打包到应用程序可执行文件中，并且使用特定的路径来访问它们。如果在应用程序中经常使用一些文件，例如图标、翻译文件、图片等，而且不想使用系统特定的方式来打包和定位这些资源，那么就可以将它们放入资源文件中。

在前面的源码目录中新建文件夹，命名images，向其中放入一张图片，随便放一个png图片。然后进入Qt Creator 编辑模式中，添加新文件，模板选Qt分类下的 Qt Resource File，命名resource.qrc。然后打开 resource.qrc 文件，点击添加前缀，设置为“/”，再点击添加文件，把 png 图片添加进去，保存。

在 main.qml 中Window对象最后边添加代码来使用资源文件。

//Image 对象用来显示一张图片
Image{id:logo//大小width:100;height:100//路径 以 qrc 开头source:"qrc:/images/logo.png"//anchors.horizontalCenter:text1.horizontalCenteranchors.top:text.bottomanchors.topMargin:10
}

然后我们右击 resource.qrc 文件，选择“用…打开 -> 普通文本编辑器“，能够看到 qrc 文件其实是个 XML 文件。
我们会发现添加资源文件后会自动在 pro 文件中生成一些代码

RESOURCE += \resource.qrc

以后自己手动添加已有的资源文件时，就在这里手动添加代码。
另外，编译时会对加入的资源文件自动压缩，这些内容可在 QT 帮助中通过 The Qt Resource System中查看。

接下来，我们再添加一个 qml 文件，命名 MyText.qml ，“添加到项目”选项会默认选择 resource.qrc 。
在 MyText.qml 中写代码

import QtQuickText{text:qsTr("欢迎关注！)color:"green"
}

在 main.qml 中的Window对象最后边添加代码

MyText{anchors.top:log.bottomanchors.horizontalCenter:logo.horizontalCenter
}

这样会在 logo 图片下面显示一行文字，现在运行一下吧

实际项目中会把所有的 qml 文件都放到一起，你可以右键 qrc 文件，选择“用…打开”，选择资源管理器，把 main.qml 添加进去。再把 main.cpp 中的加载QML文件路径改为 "qrc:/../../main.qml"

程序发布

与之前讲的 Qt Widgets 程序发布类似，要想发布 Qt Quick 程序，首先要使用 Release 方式编译程序，然后生成 exe 文件再把需要的库文件拿过那放一起打包好最后发布。
确定需要哪些 dll 文件，也就是库文件，笨方法是，运行 exe 文件，提示缺少哪个 dll ，你就复制哪个过来。
还有一个方法是使用 windeployqt.exe 工具，先编译出 release 版本的 exe ，把 exe 复制到要发布的路径下。然后打开 Qt 6.8.0（MinGW）命令行，输入 windeployqt --qmldir E: 项目路径 D:/要发布的路径