QT開發（五十二）———QML語言

QT開發（五十二）———QML語言

    QML是一種聲明語言，用於描述程序界面。QML將用戶界面分解成一塊塊小的元素，每一元素都由不少組件構成。QML定義了用戶界面元素的外觀和行爲；更復雜的邏輯則能夠結合JavaScript腳本實現。

1、QML基礎語法

1、Import語句

    QML代碼中，import語句通常寫在頭幾行，主要用途以下： 
    A、包含類型的全名空間
    B、包含QML代碼文件的目錄
    C、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代碼都定義一個對象樹。全部的QtQuick元素都是繼承於QQuickItem（QML中的Item類型），包括Rectangle、Text等。 對象類型以大寫字母開頭。
在定義對象的同時，對象的屬性也會被賦初值。每一個對象均可在其內部再聲明子對象。每一個對象的內容都由大括號包圍。

Rectangle

{

    width: 100

    height: 100

    color: "red"

}

等價於：Rectangle { width: 100; height: 100; color: "red" }

三、子對象

    每一個QML對象內可聲明無限個子對象。

import QtQuick 2.0

 

Rectangle

{

    width: 200

    height: 200

    color: "red"

    Text

    {

        anchors.centerIn: parent

        text: "Hello, QML!"

    }

}

四、註釋

    QML的註釋相似於C++、Java和Javasript等，有兩種：

    A、單行註釋時使用雙斜槓//

    B、多行註釋使用 /* … */

五、模塊聲明

    QML每一個類都單獨存放一個文件，每一個文件都是一個模塊，但不能單獨聲明一個函數，函數必須寫在類內，或者用Javascript代碼。
    引用時以模塊名使用。若是不考慮C++擴展的話，全部的QML代碼都是使用已有的QML元素類型完成的。

六、表達式

    表達式能夠包含其它的對象與屬性的引用，會創建約束關聯。

Item

{

     Text

     {

         id: text1

         x:2;y:2

         text: "Hello World"

     }

     Text

     {

         id: text2

         x:2;y:20

         text: text1.text

     }

 }

七、信號處理器

    信號處理器容許響應事件時處理動做。例如，MouseArea元素有信號處理器來處理鼠標按下，釋放以及單擊。

MouseArea 

{

    acceptedButtons: Qt.LeftButton | Qt.RightButton

    onPressed: 

    {

        if (mouse.button == Qt.RightButton) 

            console.log("Right mouse button pressed")

    }   

}