Qt中的动画包含以下内容
动画用户实现属性值缓慢变化到目标值,可以应用各种类型的缓动曲线。状态时一个对象的各种属性的配置的一个集合。过渡用来定义从一个状态切换到另一个状态时如何过渡,可以在过渡中包含动画来实现过渡。
Animation是一个抽象类,下面定义了一些具体类用于各种情况。
包含以下几个:
4. SequentialAnimation:动画组,里面定义一系列的动画,按定义先后次序执行
5. ParallelAnimation:动画组,里面定义一系列动画,所有动画并行执行
6. AnchorAnimation:针对Anchor属性改变的动画,与State配合时,和AnchorChanges一起配合用
7. ColorAnimation:针对颜色的动画
8. NumberAnimation:针对数值类改变的动画
9. ParentAnimation:针对改变父对象的动画,与State配合时,和ParentChange一起配合用
10. PathAnimation: 创建动画是对象沿着Path对象定义的路径运动
11. PropertyAnimation:通用的属性改变的动画,与State配合时,和PropertyChanges一起配合用,(优先使用针对特定属性的动画)
12. RotationAnimation : 针对旋转的动画
13. Vector3dAnimation:针对 QVector3d数值改变的动画
14. PropertyAction:立即改变属性值到目标值,不应用动画效果
15. PauseAnimation:暂停一段时间
16. SmoothedAnimation:平滑动画,使用ease in/out quad缓动曲线
17. SpringAnimation:弹簧效果的动画
18. ScriptAction:在动画效果中执行脚本
Rectangle {
id: rect
width: 100; height: 100
color: "red"
states: State {
name: "moved"
PropertyChanges { target: rect; x: 50 }
}
transitions: Transition {
PropertyAnimation { properties: "x,y"; easing.type: Easing.InOutQuad }
}
}
Rectangle {
width: 100; height: 100
color: "red"
Behavior on x { PropertyAnimation {} }
MouseArea { anchors.fill: parent; onClicked: parent.x = 50 }
}
Rectangle {
width: 100; height: 100
color: "red"
SequentialAnimation on x {
loops: Animation.Infinite
PropertyAnimation { to: 50 }
PropertyAnimation { to: 0 }
}
}
MouseArea {
anchors.fill: theObject
onClicked: PropertyAnimation { target: theObject; property: "opacity"; to: 0 }
}
Rectangle {
id: theRect
width: 100; height: 100
color: "red"
// this is a standalone animation, it's not running by default
PropertyAnimation { id: animation;
target: theRect;
property: "width";
to: 30;
duration: 500 }
MouseArea { anchors.fill: parent; onClicked: animation.running = true }
}
用来定义过渡动画
属性配置集合:StateGroup可以支持非Item类型,State只能用于Item类型
Rectangle {
id: signal
width: 200; height: 200
state: "NORMAL"
states: [
State {
name: "NORMAL"
PropertyChanges { target: signal; color: "green"}
PropertyChanges { target: flag; state: "FLAG_DOWN"}
},
State {
name: "CRITICAL"
PropertyChanges { target: signal; color: "red"}
PropertyChanges { target: flag; state: "FLAG_UP"}
}
]
}