QML笔记整理——QtQuick核心特征

1、QML文件

1）简单的QML代码包含了QML元素，它是以.qml为后缀名的文件或者文本，其编码方式为UTF-8。一个QML文件总是以至少一个import语句开始。Nothing is imported by default，其并没有包含什么代码，仅仅只是为了在运行时解释器寻找元素的定义

2）一个QML文件要定义唯一的顶层QML组件

3）Self-contained：A）在执行之前并没有预处理机制；B）在运行时解释执行

示例：创建一个简单的HelloWorld的QML程序，需要将程序放入QML文件里，比如存放到HelloWorld.qml文件

import QtQuick 2.0//Import existing QML types to be used in this

                  //application, such as Rectangle and Text

Rectangle {

    id: page

    width: 100

    height: 62

    color: "lightgray"

    Text {

        id: helloText

        text: "Hello world!"

        font.pointSize: 24;

        font.bold: true

        y: 30;

        anchors.horizontalCenter: page.horizontalCenter

    }

}

2、QML组件

1）如前所述，QML文档定义了一个单一的，顶级QML组件。元素对象是根据对应的某个C++的原型而创建的-i.e.  component是在在运行时创建的。例如，一个“button”component会用不同的按键字符串被初始化多次

2）组件是有QML基本元素构成的。所以，创建自己的组件是非常容易的。在创建组件的时候，起名字要以大写字母开始，如MyButton.qml

3）一个组件可以声明为内联组件。使用关键字Component声明，可以使用parent的属性或者是导入列表中的元素。该组件可以多次在一个QML文件中根据需要被使用（从逻辑上来说，这个组件也只属于这个QML文件）

3、QML模块

1）多个QML组件可以组合到一个QML模块中。最简单的方法就是创建一个子文件夹，然后把所有的控件放置进去。这些控件可以使用import语句导入到QML的文档中，如：import  “path_to_mymodule”。导入路径是和导入控件的QML文件之间的相对路径。

2）也可以使用命令的导入。

3）用于区分不同的模块，也可以使代码更具有可读性

4）QML组件也可以在工程外的文件定义，这种情况下会用到URI（

在电脑术语中，统一资源标识符（Uniform Resource Identifier，或URI)是一个用于标识某一互联网资源名称的字符串。 该种标识允许用户对网络中（一般指万维网）的资源通过特定的协议进行交互操作。URI由包括确定语法和相关协议的方案所定义）：import com.nokia.SomeStuff 1.0。通过导入，就可以访问到放在系统其他地方的com/nokia/SomStuff/下的控件了。这个路径可以通过下面的方法设置：A）在C++中，使用QmlEngine::addImportPath()；B）在执行qml.exe的时候使用选项-L指定路径

5）另外的导入方法：import "http://myserver.com/.../..." 1.0。这种情况下，一个叫qmldir的文件描述了目录的内容：

# <Comment>

<TypeName><InitialVersion><File>

4、网络透明

1）简单的说，就是QML代码中使用的其他内容都用URLs表示，对于本地的或者网络上的内容都适用，支持相对或绝对路径。如：

// Test1.qml containing a reference to an absolute URL

Image { source: "http://www.example.com/images/logo.png" }

// Test2.qml with a relative URL

Image { source: "images/logo.png" }

2）相对的URLs会自动转换成绝对路径（Absolute URLs always stay as they are）

例1：Test2.qml是从下面网址加载的

http://www.example.com/mystuff/Test2.qml

那么image的路径就自动被解析为http://www.example.com/mystuff/images/logo.png

例2：Test2.qml从本地文件加载

C:/temp/mystuff/Test2.qml

那么image的路径就自动被解析为C:/temp/mystuff/images/logo.png

5、渐进载入

当QML的某个对象引用网络资源的时候，那么它将会提供整个加载过程的进度状态（访问网络是一步的操作）。比如，image有一些如下的特殊属性

status( Null, Ready, Loading, Error)

progress(0.0 - 1.0)

width and height also changes as the image is loaded

应用程序能够绑定这些属性，比如：在合适的时候显示一个进度条。

而对于本地图片状态已经准备好了。

In the future versions this might change.

If you wish to remian network transparent, do not rely on this!