QML代码解析

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/lengyuezuixue/article/details/82807281

QML代码：

import QtQuick 2.3

Rectangle {
    width: 300
    height: 300
    color: "lightgray"

    Text {
        anchors.centerIn: parent
        text: "Hello, QML!"
    }
}

Import：

    首先，导入Qt Quick模块，这让我们可以访问图形项，例如：Item、Rectangle、Text等

import QtQuick 2.3

Rectangle类型

Rectangle {
    width: 300
    height: 300
    color: "lightgray"

        声明一个类型为 Rectangle 的根对象，它是可以用来在 QML 中创建应用程序的基本构建单元之一。

        一般情况下，属性 width、height 几乎总需要设置。一旦设置了这两个属性，就会有一个正确大小的空窗口准备填充内容。为了突出样式，我们还为其设置了背景色为浅灰色。 注意： Rectangle 类型还包含许多其他属性（例如：x 、y），但这些属性均保留默认值。

Text类型

  Text {
        anchors.centerIn: parent
        text: "Hello, QML!"
    }
}

       添加一个 Text 类型作为 Rectangle 类型的子项，用来显示文本“Hello, QML!”。 Anchors 用于指定 Item 相对其它 Item 的关系。这里，我们使用 anchors.centerIn 将 Text 元素固定到 Rectangle 的中心。

       要查看已创建的内容，请运行 qmlscene 工具（位于 bin 目录中）。高手向来比较喜欢命令行，打开 CMD，运行 qmlscene，以文件名 .qml 作为参数。

qmlscene “Hello QML.qml”

      当然，更简单的办法是找到 qmlscene 工具，然后双击打开，选择要运行的 QML 文件。

     注意：以前的 Qt 版本中，提供了一个 qmlview 工具（qmlviewer.exe），也可用来运行单独的 QML/JavaScript 程序。 

---

---