i made animations in transition. so if state change, so the transition is emitted. here is the sequential animation that i made.
SequentialAnimation{
PropertyAnimation{
properties: "width"
duration: 300
}
PropertyAnimation{
properties: "x"
duration: 500
}
Component.onCompleted: {
var idx = Math.ceil(Math.random()*2);
if(idx===0){
anim0.running = true
anim1.running = false
}
else {
anim1.running = true
anim0.running = false
}
console.log("haha");
}
}
SequentialAnimation{
id: anim0
running: false
NumberAnimation{
running: anim0.running
properties: "x"
to: 300
duration: 500
}
Component.onCompleted: console.log("anim0");
}
SequentialAnimation{
id: anim1
running: false
NumberAnimation{
running: anim1.running
properties: "x"
to: -300
duration: 500
}
Component.onCompleted: console.log("anim1");
}
Ignore the JavaScript first on Component.onCompleted signal.
SequencialAnimation with id: anim1 and anim0 keep running although i had already set running attribute to false…
Setting the
runningproperty of anAnimationitem to false, will not prevent the animation start. It will just stop it if it’s currently runnging.If you don’t want an animation to be started in a transition, then just don’t put it inside a transition.
You can always define your custom
AnimationItem outside theTransition, and trigger it when you want to by using theanimationId.start()function.For detailed informations see the documentation page.