Qt Quick 之 Hello World 图文详解

在上一篇文章，《QML 语言基础》中，我们介绍了 QML 语言的语法，在最后我们遗留了一些问题没有展开，这篇呢，我们就正式开始撰写 Qt Quick 程序，而那些问题，随着本系列文章的展开也会一一被干掉。

在开始介绍 Qt Quick 应用的基本元素之前，我们先来创建一个 HelloQtQuickApp 项目，就是经典的 Hello World 了。

版权所有 foruok，转载请注明出处：http://blog.csdn.net/foruok

HelloQtQuickApp

从零开始。

创建项目

打开 Qt Creator ，点击文 "件(F)" 菜单，在弹出的菜单列表中选择 "新建文件或项目(N)" 。如下图所示：

如上操作后， Qt Creator 会弹出新建项目界面，让我们选择应用模板。如下面的所示：

这里我们选择 "应用程序" 项目， "Qt Quick Application" 模板。可以看到最右侧的实时提示，说这模板支持 QML 和 C++ 混合编程，这正是我们需要的，因为笔者最终提供的有使用价值的实例就是混合了 QML 和 C++ ，而且我的观点也正是这样：复杂的应用，使用 QML 快速构建界面，使用 C++ 完成关键算法和逻辑。另外还看到支持 Destop 和 Android 两个平台。
点击 "选择(C)..." 按钮，新建项目向导会指引我们进入下一环节 "项目介绍和位置" 。参考下图：

请参考上图，将项目名称设置为 HelloQtQuickApp 。

点击 "下一步" 按钮，跟随向导进入组件选择环节，如图：

请参考图示，选择 Qt Quick 2.0 。

点击 "下一步" 按钮，跟随向导进入构建套件选择("Kit Selection")环节。
我选择了两个套件，"Android for armeabi-v7a (GCC 4.7, Qt 5.2.0)" 和 "Desktop Qt 5.2.0 MinGW 32bit" 。请对照下图检查你的配置。

点击 "下一步" 按钮，跟随向导进入 "项目管理" 环节。在这里你可以选择是否将项目加入版本控制系统（如 svn 之类），还可以看到即将添加到我们的 "HelloQtQuickApp" 项目中的文件。如下图所示：

终于看到 "完成(F)" 按钮了，赶紧点击它！你会看到下面的项目编辑界面（我展开了项目视图以便看到项目中的所有文件）：

虽然是一个简单的 Hello World ，向导还是很热情地给我们添加了很多文件，比如 qtquick2applicationviewer.h /qtquick2applicationviewer.cpp / main.cpp / main.qml 。接下来我们做点儿小改动。

运行项目

请把 main.qml 文件中的 "Hello World" 替换为 "Hello Qt Quick App" ，然后直接运行项目，（在电脑上）即可看到下面的效果：

好啦，我们的 HelloQtQuickApp 项目就这么完成了。

在手机上运行

接下来让我们做一些改动以便 HelloQtQuickApp 能够在 Android 手机上运行。

看下图：

首先我们需要点击标号为 1 的标签进入项目属性配置界面；然后点击标号为 2 的按钮，切换到 Android 运行选项；第三步呢，标号 3 的详情按钮点一下，展开部署详情；然后呢，参考标号 4 ，选择 Qt 部署策略为 Use Ministro service to install Qt ；最后一步，就是标号 5 所示按钮，创建 Android 应用需要的 AndroidManifest.xml 文件，点击后看到下面的界面：

直接点击 "完成(F)" 按钮即可。然后就进入了 AndroidManifest.xml 编辑界面：

你可以按照图示，修改应用的包名，笔者修改为 an.qt.helloQtQuickApp ，然后关闭 AndroidManifest 编辑界面时会提示你保存，选择保存所有就行了。

新的项目视图如下：

注意我标注的区域。

现在我们的项目终于完善了，可以在 Android sh上运行了。如对 Qt on Android 项目设置有不明之处，请移步我另外一篇文章——《Qt on Android：图文详解Hello World全过程》，如果你还没搭建好 Qt on Android 开发环境，请参考《Windows下Qt 5.2 for Android开发入门》。

运行项目，会让你选择目标设备，我连接的真机，选择了真机。具体请参考《Qt on Android：图文详解Hello World全过程》。下面是运行效果截图：

看起来没什么吸引人的？不错，确实如此。不过呢，这只是开始，刚刚开始。随着深入学习，你可以自己制作出精美的应用和炫酷的游戏。如果你已经迫不及待了，请把 Qt SDK 中的 Qt Quick 的示例程序找几个出来跑跑看。

版权所有 foruok，转载请注明出处：http://blog.csdn.net/foruok

哎呀，看起来，对于 Qt Quick 基本元素的介绍——《Qt Quick 简单教程》——只能放到下一次了……