C++学习（一四七）QML中的property

在QML文件中我们可自定义属性，语法如下：

property   [ :  ]  

类似于成员变量，不同的是可以初始化，并且没有public、private、protected等限制。

自定义属性完成后会自动为这个属性创建一个属性值改变的信号和相应的信号处理器on****Changed，首字母大写，如下所示：

Rectangle {  
    id: root  

    property string someText  
    onSomeTextChanged: console.log("The someText will be: " + someText)  

    width: 800; height: 480  
    color: "lightblue"  

    MouseArea {  
        anchors.fill: parent  
        onClicked: someText = "click"  
    }  
}  

properName以一个小写字母开头，只能包括字母、数字和下划线。propertyType可以是QML基本类型，enumeration以int来代替，也可以是QML对象类型，神奇的var类型是返型的，支持任何类型的属性值，如下所示：

Item {  
    property int theNumber  
    property string theString  
    property url theUrl  

    property Item someItem  
    property Rectangle someRectangle  

    property var someNumber: 1.5  
    property var someString: "abc"  
    property var someBool: true  
    property var someList: [1, 2, "three", "four"]  
    property var someObject: Rectangle { width: 100; height: 100; color: "red" }  
}  

属性值可以被初始化，也可以使用JavaScript表达式来赋值，通过这两种方式赋值时，可以是一个静态值，也可以是一个与其它属性绑定的值。 

Rectangle {  
    id: rootRect  

    property color theColor: "green"  
    property color previousColor: rootRect.color  
    property color nextColor  

    width: 100; height: 100  
    color: "red"  

    Component.onCompleted: {  
        rootRect.nextColor = rootRect.color  
        console.log(theColor, previousColor, nextColor, rootRect.color)  
    }  
} 

 

QtObject {
    id: root

    property QtObject viewer: MainView{}

}

属性分为以下几类：

1、自定义属性

property   [ :  ]  

2、列表属性

 

Item {  
    children: [  
        Text { text: "textOne" },  
        Text { text: "textTwo" },  
        Text { text: "textThree" }  
    ]  

    Component.onCompleted: {  
        for(var i = 0; i < children.length; i++)  
            console.log("text of lable", i, ":", children[i].text)  
    }  
}  

上面例子中的children属性就是一个列表属性，包含在一对方括号中，里面的元素必须是QML对象类型而不能是QML基本类型，并以逗号分隔。列表内的元素可通过数组下标[index]访问，元素个数由length属性提供。若列表内只有一个元素，方括号可省略。

自定义列表属性，代码如下：

Item {  
    property list siblingRects  
    property list childRects: [  
        Rectangle { color: "red" },  
        Rectangle { color: "green" },  
        Rectangle { color: "blue"}  
    ]  

    Component.onCompleted: {  
        for(var i = 0; i < childRects.length; i++)  
            console.log("color of lable", i, ":", childRects[i].color)  
    }  
}  

3、分组属性

在某些情况下，属性可以是由若干个子属性构成的一个逻辑组，我们可以用“.”符号或者分组符号对其进行赋值。

Text {  
        //dot notation  
        font.pixelSize: 12  
        font.bold: true  
    }  

    Text {  
        //group notation  
        font { pixelSize: 12; bold: true }  
    }  

4、属性别名

属性别名引用其它的属性，语法如下：

[default] property alias :   

5、默认属性

任何基于Item的类型都有一个data列表属性，这个属性就是该类型的默认属性，保存了所有的孩子对象，其中可视的孩子对象又保存在了children列表属性中，不可视的孩子对象保存在了resources列表属性中，在添加子对象时children、resources属性可写可不写，都会自动添加到对应的属性列表中。

6、只读属性

readonly property   : 

只读属性必须初始化，且不能修改，也不能是default属性和alias属性

7、附加属性

QML语言还包括了一些附加属性和信号处理器，由相应的附加类型提供，使用语法如下：

.  
.on