QML3-QML语法

QML语法（QML Syntax）

QML是一种描述用户界面的声明式语言。它将用户界面分解成一些更小的元素，这些元素能够结合成一个组件。QML语言描述了用户界面元素的形状和行为。用户界面能够使用JavaScript来提供修饰，或者增加更加复杂的逻辑。从这个角度来看它遵循HTML-JavaScript模式，但QML是被设计用来描述用户界面的，而不是文本文档。

从QML元素的层次结构来理解是最简单的学习方式。子元素从父元素上继承了坐标系统，它的x,y坐标总是相对应于它的父元素坐标系统。

让我们开始用一个简单的QML文件例子来解释这个语法。

// rectangle.qml
import QtQuick 2.0

// The root element is the Rectangle
Rectangle {
// name this element root
id: root

// properties: <name>: <value>
width: 120; height: 240

// color property
color: "#D8D8D8"

// Declare a nested element (child of root)
Image {
id: rocket

// reference the parent
x: (parent.width - width)/2; y: 40

source: 'assets/rocket.png'
}

// Another child of root
Text {
// un-nam