QML语法基础

QML 语法基础知识

QML是一种多范式语言,它允许根据对象的属性以及它们如何关联和响应其他对象中的更改来定义对象。与纯粹的命令式代码相比,在纯粹的命令式代码中,属性和行为的更改是通过一系列逐步处理的语句来表达的,而QML的声明性语法将属性和行为更改直接集成到单个对象的定义中。然后,在需要复杂的自定义应用程序行为的情况下,这些属性定义可以包含命令性代码。

QML源代码一般由引擎通过QML文档加载,QML文档是QML代码的独立文档。这些可用于定义QML 对象类型,然后可以在整个应用程序中重用这些对象类型。请注意,类型名称必须以大写字母开头,才能在 QML 文件中声明为 QML 对象类型。

导入模块

QML 文档在文件顶部可能有一个或多个导入。导入可以是以下任一项:

  • 已注册类型的版本化命名空间(例如,通过插件,可以理解为打包好的库)
  • 包含作为 QML 文档的类型定义的相对目录(就是本地QML文档所在目录)
  • 一个 JavaScript 文件

导入 JavaScript 文件导入时必须限定,以便可以访问它们提供的属性和方法。

各种导入的通用形式如下:

import Namespace VersionMajor.VersionMinor
import Namespace VersionMajor.VersionMinor as SingletonTypeIdentifier
import “directory”
import “file.js” as ScriptIdentifier

例子:

import QtQuick 2.0
import QtQuick.LocalStorage 2.0 as Database
import "../privateComponents"
import "somefile.js" as Script

对象声明

从语法上讲,QML 代码块定义了要创建的 QML 对象树。对象是使用对象声明定义的,这些对象声明描述要创建的对象的类型以及要赋予对象的属性。每个对象还可以使用嵌套对象声明来声明子对象。

对象声明由其对象类型的名称后跟一组大括号组成。然后,所有属性和子对象都将在这些大括号中声明。

下面是一个简单的对象声明:

Rectangle {
    width: 100
    height: 100
    color: "red"
}

这将声明一个类型为Rectangle的对象,后跟一组包含为该对象定义的属性的大括号。Rectangle类型是模块提供的类型,在本例中定义的属性是矩形的值和属性。(这些是矩形类型提供的属性,如矩形文档中所述。QtQuickwidthheightcolor

如果上述对象是QML 文档的一部分,则引擎可以加载该对象。也就是说,如果源代码由导入模块的import语句进行补充(以使矩形类型可用),如下所示:QtQuick

import QtQuick 2.0

Rectangle {
    width: 100
    height: 100
    color: "red"
}

当放入文件中并由 QML 引擎加载时,上面的代码将使用模块提供的矩形类型创建一个矩形对象:.qmlQtQuick
在这里插入图片描述
注意:如果对象定义只有少量属性,则可以将其写在一行上,如下所示,属性用分号分隔:

Rectangle { width: 100; height: 100; color: "red" }

显然,此示例中声明的Rectangle对象确实非常简单,因为它只定义了几个属性值。为了创建更有用的对象,对象声明可以定义许多其他类型的属性:这些属性在QML 对象属性文档中进行了讨论。此外,对象声明可以定义子对象,如下所述。

子对象

任何对象声明都可以通过嵌套对象声明定义子对象。通过这种方式,任何对象声明都会隐式声明一个对象树,该对象树可能包含任意数量的子对象。

例如,下面的Rectangle对象声明包括一个渐变对象声明,该声明又包含两个GradientStop声明:

import QtQuick 2.0

Rectangle {
    width: 100
    height: 100

    gradient: Gradient {
        GradientStop { position: 0.0; color: "yellow" }
        GradientStop { position: 1.0; color: "green" }
    }
}

当引擎加载此代码时,它会创建一个对象树,其根部有一个矩形对象;此对象具有一个渐变子对象,而该子对象又具有两个渐变停止子对象。

但请注意,这是 QML 对象树上下文中的父子关系,而不是可视场景上下文中的父子关系。可视场景中父子关系的概念由模块中的Item类型提供,该类型是大多数 QML 类型的基类型,因为大多数 QML 对象都旨在以可视方式呈现。例如,"矩形"和"文本"都是基于项的类型,在下面,Text对象已声明为矩形对象的可视子对象:QtQuick

import QtQuick 2.0

Rectangle {
    width: 200
    height: 200
    color: "red"

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

当Text对象在上面的代码中引用其父值时,它指的是其可视父级,而不是对象树中的父级。在本例中,它们是同一个对象:Rectangle对象是Text对象在 QML 对象树的上下文和可视场景的上下文中的父级。但是,虽然可以修改父属性以更改可视父属性,但不能从 QML 更改对象树上下文中对象的父级。

(此外,请注意,声明Text对象时,没有将其分配给矩形的属性,这与前面的示例不同,该示例将Gradient对象分配给矩形的属性。这是因为Item的子属性已设置为类型的默认属性,以启用此更方便的语法。

  • 2
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

我是唐

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值