QML中的动画处理.doc

文档介绍：QML中的动画处理
QML是一个写界面非常不错的工具，只要你有合适的UI界面，就可以非常快速的编写完UI界面

QML也内置了许多动画效果，动画效果一般都是在属性值上的变化，这些变化的方式，就构成了不同的动画效果。从一个点到另一个点的，走法有n多种，采用哪种方法走法，会比较好看，QML内置了一些数学上的走路方式，用Easing来描述，不知道中文没关系，记住对应图关系即可，大部分以In，Out，InOut，OutIn为前缀，即有Quad，Cubic，Quart，Quint，Sine，Expo，Circ，Elastic，Back，Bounce。点击此处查看详细。

当元素有一些属性需要修改时，QML定义了一些默认的属性类型动画处理
PropertyAnimation
NumberAnimation
Vector3dAnimation
ColorAnimation
RotationAnimation
ParentAnimation
AnchorAnimation
对于指定的属性，使用指定的属性Animation，效率会更好一些。

属性的变化，在做成动画时一般和状态变化关联在一起，而状态变化的时候，属性变化状态，又可以通过tranistions这个特殊的属性，进行更加复杂的动画处理效果。如下面的例子，在pressed的时候，修改状态为PRESSED，在released的时候，修改RELEASED，states属性将依据修改的状态变化进行属性值修改，而transition则监控状态的切换时属性值是否修改，如果修改则应用该属性值的Animation，从而形成动画。
（ ColorAnimation用在Transition中时，将监控target的color属性，当属性变化时，会应用该ColorAnimation。）
Rectangle {
width: 75; height: 75
id: button
state: "RELEASED"
MouseArea {
: parent
onPressed: = "PRESSED"
onReleased: = "RELEASED"
}
states: [
State {
name: "PRESSED"
PropertyChanges { target: button; color: "lightblue"}
},
State {
name: "RELEASED"
PropertyChanges { target: button; color: "lightsteelblue"}
}
]
transitions: [
Transition {
from: "PRESSED"