QML --》动画分组
1、平行动画
关键字(ParallelAnimation):当开始时,平行元素的所有子动画都会平行运行,它允许你在同一时间使用不同的属性来播放动画。
import QtQuick 2.0 Rectangle{ id:root width: 1000; height: 1000; property int duration:3000; Clickable{ id:rocket; x:20;y:520; source: "./1.png"; onClicked: anim.restart(); } ParallelAnimation{ id:anim; NumberAnimation{ target: rocket; properties: "y"; to:20; duration: root.duration; } NumberAnimation{ target: rocket; properties: "x"; to:500; duration: root.duration; } } }
从(20,520)移动到(500, 20);
2、连续动画
关键字:(SequentailAnimation)
Rectangle{ id:root width: 1000; height: 1000; property int duration:3000; Clickable{ id:rocket; x:20;y:520; source: "./1.png"; onClicked: anim.restart(); } SequentialAnimation{ id:anim; NumberAnimation{ target: rocket; properties: "y"; to:20; duration: root.duration*0.6; } NumberAnimation{ target: rocket; properties: "x"; to:500; duration: root.duration*0.4; } } }
运行方式:(20, 520) ---->(20, 20) ---->(500, 20)