Qt模块化笔记之Qt_Quick——引入

首先，分清QML与qtquick， QML是一种格式类似css、混杂javaScript的“语言”，是一种工具，它属于qtquick。qtquick是一些“工具集”。

在qt的模块列表中，http://qt-project.org/doc/qt-5.1/qtdoc/qtmodules.html

qt qml与qt quick是两个分开的模块，我感觉不正确，因为在使用时，我们引入模块的语句为

import QtQuick 2.0，所以Qt_Quick才是模块……

好了，以上这些现在分不清也没关系，会用了，以后总能分清的。

先来看一段典型的qml语言写的代码（来自http://zh.wikipedia.org/wiki/QML）：

import QtQuick 2.0
 
 Rectangle {
     id: canvas
     width: 200
     height: 200
     color: "blue"
 
     Image {
         id: logo
         source: "qt_logo.jpg"
         anchors.centerIn: parent
     }
 }

这段代码开头引入了模块QtQuick 2.0 (模块名与版本号)，这个模块主要用于描述界面（使用元素组合成可视界面）

使用了Rectangle与Image两个QtQuick 模块中的元素，Image内嵌在Rectangle中，Rectangle是最顶层的，所以这个程序运行后，长与宽与这个Rectangle的长宽相同，都是200px。

Rectangle有唯一标识的ID号，还给了长宽，并将它颜色设为蓝色，而Image图片元素，则载入一张图片，并将它用“锚”，钉在了rectangle的中央部位，parent 即指“上一层”的rectangle，称为父对象

在qt中新建个工程，注意应选择新建qt quick application。将上面代码拷贝到main.qml覆盖,这个文件是默认的入口，结果如下：

qml语言也有继承关系，但关系都不复杂，以上两个元素都继承自Item元素。

除了这个主要模块外，还有一些子模块，以提供除描述界面外的其它功能。

从这个网页可比较清楚看它们关系：http://qt-project.org/doc/qt-5.1/qtquick/qtquick-qmltypereference.html

在网页中找到，子模块有以下这些：

Submodules列表

XML List Model - 处理XML相关
Local Storage - 一个本地SQLite数据库
Particles - 粒子系统（粒子即是发光的点组合）

Window - 创建顶层窗口contains types for creating top-level windows and accessing screen information
Dialogs - 对话框contains types for creating and interacting with system dialogs
Controls - qml实现的与widgets相同的控件集。provides a set of reusable UI components
Layouts - 布局contains types that are used to arrange items in the user interface

当需要使用它们中的功能时，可分别引入相应模块，比如要处理XML。

import QtQuick.XmlListModel 2.0

这样就可以使用它所包含的

XmlRole与XmlListModel了