第四章 QML語法

4.1 語法基礎

import QtQuick 2.6
import QtQuick.Window 2.2

Rectangle {
    width: 400
    height: 400
    color: "blue"
    Image {
        source: "pics/logo.png"
        anchors.centerIn: parent
    }
}

示例

4.1.1 導入語句import

import語句能夠導入QtQuick模塊，能夠支持不一樣的類型。

4.1.2 對象和屬性

示例中對象通常以大寫字母開頭，後面跟一對大括號。

括號中包括了對象的特性定義，不如對象的屬性值或者它的子對象。例如：Rectangle { width: 100; height: 100 }

當多個"屬性：值"寫在一塊兒時，用分號分隔

4.1.3 佈局

anchors.centerIn起到佈局的做用，除它之外還有不少佈局屬性

4.1.4註釋

• 單行註釋使用「//」開始，直到好末尾
• 多行註釋使用「/*」開始，以「*/」結尾

4.1.5 表達式

Item {
    width: 100 * 3
    height: 50 + 22
}
//屬性值能夠包含表達式

Item {
    width: 300
    height: 300
    Rectangle {
        width: parent.width - 50
        height: 100
        color: "yellow"
    }
}
//能夠和其餘的值綁定，此時若是值改變，會自動更新

表達式例子

 

4.1.6 調試輸出

使用console.log()和console.debug()來輸出調試信息，相似與qDebug()。

4.2 import導入語句

須要使用的模塊必須在文件開頭使用import導入。

4.2.1 模塊導入語句

常見的import語法是：

import<ModuleIdentifier><Version.Number>[as<Qualifier>]

• <ModuleIdentifier>是使用點分割的URI標識符，該掉師傅惟一去頂模塊對象類型命名空間
• <Version.Number>是「主版本號.子版本號」形式的版本信息
• <Qualifier>是可選的限定符，用於給導入的對象類型和JavaScript資源一個文檔內部的命名空間。

 

4.3 QML類型系統

 

4.4 對象特性

 

4.5 集成JavaScript表達式

 

4.6 QML文檔

 

4.7 QML模塊