Qt编程进阶（42）：QML文档结构（画线奇兵）

QML程序的源文件又叫“QML文档”，以.qml为文件名后缀，例如，一般项目的“main.qml”就是一个QML文档。每个QML文档都由两部分构成：import和对象声明。

1. import 部分

此部分导入需要使用的QtQuick库，这些库由Qt5提供，包含了用户界面最通用的类和功能，如文件开头的两句：

import QtQuick 2.12 //导入 Qt Quick 2.12 库 import QtQuick.Window 2.12 //导入 Qt Quick 窗体库

导入这些库后，用户就可以在自己编写的程序中访问QtQuick所有的QML类型、接口和功能。

2. 对象声明

这是一个QML程序代码的主体部分，它以层次化的结构定义了可视场景中将要显示的元素，如矩形、图像、文本及获取用户输入的对象……它们都是Qt Quick为用户界面开发提供的基本构件。例如，对象声明部分：

Window { //根对象 width: 640 height: 480 visible: true title: qsTr ("Hello World") Rectangle { //对象 …… } }

QML规定了一个Window对象作为根对象，程序中声明的其他所有对象都必须位于根对象的内部。

3. 对象和属性

对象可以嵌套，即一个QML对象可以没有、也可以有一个或多个子对象，比如如下代码：

Rectangle { //对象：Rectangle …… mouseArea { //子对象 1: MouseArea …… } TextEdit { //子对象 2: TextEdit …… Rectangle { //子对象2的子对象：Rectangle …… } } }

上面声明的Rectangle (矩形）对象就有两个子对象（MouseArea和TextEdit),而子对象TextEdit本身又拥有一个子对象Rectangle。

对象由它们的类型指定，以大写字母开头，后面跟一对大括号{}，{}之中是该对象的属性，属性以键值对“属性名:值”的形式给出，比如在代码中：

Rectangle { width: 360 //属性（宽度） height: 360 //属性（高度） }

定义了一个宽度和高度都是360像素的矩形。QML允许将多个属性写在一行，但它们之间必须用分号隔开，所以以上代码也可以写为：

Rectangle { width: 360; height: 360 //属性（宽度和高度） …… }

对象MouseArea是可以响应鼠标事件的区域：

MouseArea { id: mouseArea anchors.fill: parent onClicked: { console.log(qsTr(textEdit.text)) } }

作为子对象，它可以使用parent关键字访问其父对象Rectangle。其属性anchors.fill起到布局作用，它会使MouseArea充满一个对象的内部，这里设值为parent表示MouseArea充满整个矩形，即整个窗口内部都是鼠标响应区。

TextEdit是一个文本编辑对象：

TextEdit { id: textEdit text: qsTr("Enter some text***") verticalAlignment: Text.AlignVCenter anchors.top: parent.top anchors.horizontalCenter: parent.horizontalCenter anchors.topMargin: 20 Rectangle { anchors.fill: parent anchors.margins: -10 color: "transparent" border.width: 1 } }

属性text是其默认要输出显示的文本（Enter some text...)，属性anchors.top、anchors.horizontalCenter和anchors.topMargin都是布局用的，这里设为使TextEdit处于矩形窗口的上部水平居中的位置，距窗口顶部有20个像素的边距。

QML文档中的各种对象及其子对象以这种层次结构组织在一起，共同描述一个可显示的用户界面。

4. 对象标识符

每个对象都可以指定一个唯一的id值，这样便可以在其他对象中识别并引用该对象。例如,

MouseArea { id: mouseArea …… }

就给MouseArea指定了id为mouseArea。可以在一个对象所在的QML文档中的任何地方，通过使用该对象的id来引用该对象。因此，id值在一个QML文档中必须是唯一的。对于一个QML对象而言，id值是一个特殊的值，不要把它看成一个普通的属性，例如，无法使用mouseArea.id来进行访问。一旦一个对象被创建，它的id就无法被改变了。

id必须以小写字母或下画线开头，并且不能使用除字母、数字和下画线外的字符。

5. 注释

QML文档的注释同C/C 、JavaScript代码的注释一样: