一、语法基础
1、导入语句(import)
代码中的import语句导入了QtQuick模块,它包含各种QML类型,import中导入的模块可以限制生成代码所用的版本,以及一些其他文件,譬如js文件,
2、对象(object)和属性(property)
QML文档就是一个QML对象树。QML对象由它们的类型(type)指定,以大写字母开头后面跟一个大括号。
括号中包含了对象的特殊定义,比如这个对象的属性值或者子对象。
属性可以分行写,所以每行可以不用分号分隔,如果使用分号也不碍事
例如:
Rectangle{
width: 100
height: 100
}
3、布局
常见布局,有绝对位置,以及相对位置锚定位:anchors,指定xy,
4、注释
QML中注释和c++相同
单行注释: //
多行注释: /* .... */
5、表达式
表达式可以设置属性值:
例如:
Item{
width: 100 *3
}
表达式可以包含其他对象或属性的应用,这样做便创建了一个绑定;当表达式中的值改变时,以该表达式为值的属性会自动更新为新的值
例如:
Item{
width : 300
height: 300
Rectangle{
width: parent.width -50
height: 100
color: "red"
}
}
6、调试输出
在QML代码中使用可以console.log()和console.debug()来调出调试信息
例如:
Rectangle{
......
MouseArea{
anchors.fill: parent
onclicked: console.log("矩形颜色:", color);
}
}
二、import导入语句
导入语句可以告知引擎在QML文档中使用了哪些模块、javaScript资源和组件目录。QML文档必须导入必要的模块或者类型的命名空间,以便QML引擎加载文档中使用到的对象类型。默认,qml文档可以访问到该.qml文件同目录下的对象类型。除此之外,如果QML文档还需要其他对象类型,也必须使用import导入该类型的命名空间。
import语句不是预处理语句,不会将其他代码复制到当前文档,而是向QML引擎说明要如何处理文档中引用的对象类型
import 语句的分类如下
(一)模块(命名空间)导入语句
模块导入语句,用于将注册了QML对象类型或Javascript资源的QML模块导入到一个指定的命名空间。
语法如下:
import [as]
: 是使用点分割的URI标识符。用于确定对象类型命名空间
:“主版本号.子版本”,用于指明导入可以的对象类型和JavaScript资源的集合;
:可选的限定符,用于给导入的对象类型和JavaScript资源一个文档内部的命名空间。如果不给出这个限定符,那么导入的对象类型和JavaScript资源会导入到全局命名空间
例如:
import QtQuick 2.2 as Quick
Quick.Rectangle{
width:100
height:100
}
导入限定符的作用是当出现多个模块中存在相同的类型时,就需要此类限定符例如:
import QtQuick2.0 as CoreItems
import "../textwidgets" as MyModule
CoreItems.Ractangle{
width:100; height: 100
MyModule.Text{
text:"Hello"
}
CoreItems.Text{text:"Hi"}
}
(二)目录导入语句
语法:
import "" [as]
既可以是本地目录,也可以是远程目录
和前面介绍的模块导入语句完全一致
1、导入本地目录
例如:
目录结构如下图所示:
myapp
|-mycomponents
|- CheckBox.qml
|- DialogBox.qml
|-main
|-application.qml
mycomponents中包含了两个UI组建,现在要在main下的application.qml文件中使用mycomponents中的对象类型,可以使用相对路径
使用方法如下:
import "../mycomponents"
DialogBox{
CheckBox {
......
}
}
也可以使用限定符,这样使用目录中的任何类型时都需要指定限定符,如下所示:
import "../mycomponents" as MyComponents
MyComponents.DialogBox{
//.......
}
2、导入远程目录
如果要导入远程的目录,该目录中需要包含一个qmldirwenjian 。qmldir文件中罗列了目录中的文件列表。例如之前的myapp目录在远程的http://www.myspace.com上,而在mycomponents目录中包含了一个qmldir文件,其内容如下
CheckBox.qml
DialogBox.qml
这样便可以使用URL来导入远程mycomponents目录,代码如下所示:
import "http://www.myspace.com/myapp/mycomponents"
DialogBox{
CheckBox{
//....
}
}
注意:当导入了网络上的目录时,只能访问该目录qmldir文件中指定的QML文件和Javascript文件
qmldir文件没有后缀
(三)Java资源导入语句
语法:
import "" as ""
每一个导入的JavaScript文件 都要指定一个标识符,以便能够在QML文档中访问。该标识符必须在整个QML文档中唯一。