1.state简介
changes(list<Change>):保存当前State下的多个Change对象,比如PropertyChanges、StateChangeScript、ParentChange等。
extend(string):表示该状态要在哪个State的基础上进行扩展,当一个状态要在另一个状态基础上进行扩展时,它将继承该另一个状态的所有changes。
name (string ):此属性保存状态的名称,每个状态在其项目内应具有唯一的名称。
when(bool ):该属性在应用状态成立时生效。应该将其设置为一个表达式,您希望何时应用状态时使该表达式的计算结果为true。
当一个对象的状态发生改变,那么该对象展示给用户的效果也会相应发生改变,所以state支持了多个不同change对象供我们使用,有如下几种:
- PropertyChanges: 改变对象的属性值
- StateChangeScript:运行脚本,比如function函数
- ParentChange: 改变对象的父类对象.并且改变对象在父类对象下的坐标xy,宽高等属性
- AnchorChanges: 改变对象的anchor值
2.示例
示例1:定义了两种状态,Rectangle中,鼠标按下时显示pressed状态,松开鼠标时显示released状态。
Window {
visible: true
width: 400
height: 400
title: qsTr("Hello World")
Rectangle {
id: rect
width: 100
height: 100
state: "pressed";
MouseArea {
id: mouseArea
anchors.fill: parent
onPressed: {
rect.state = "pressed";
}
onReleased: {
rect.state = "released";
}
}
states: [
State {
name: "pressed"
PropertyChanges {
target: rect;
color: "red"
}
},
State {
name: "released"
PropertyChanges {
target: rect;
color: "yellow"
}
}
]
}
}
示例2:鼠标按下的时候,rect隐藏。
Window {
visible: true
width: 400
height: 400
title: qsTr("Hello World")
Rectangle {
id: rect
width: 100
height: 100
color: "red"
MouseArea {
id: mouseArea
anchors.fill: parent
}
states:
State {
name: "hidden"
when: mouseArea.pressed
PropertyChanges {
target: rect
opacity: 0
}
}
}
}