ParallelAnimation with multiple items
-
I'd like to animate two distinct objects in parallel, but I'm unsure what's the best way to go about it.
I tried something like below
// ball is also an instance of Rectangle below, as is player.
@
function kick(ball) {
player.ball = ball
player.nX = player.x + 100
ball.nX = ball.x + 200
player.state = "moved"
}Rectangle {
id: player
property int nX: 0
property int nY: 0
property bool push: false
property variant ball // kicked ballcolor: "red" states: State { name: "moved"; PropertyChanges { target: ball; x: nX; y: nY; restoreEntryValues: false } } transitions: Transition { from: ""; to: "moved"; ParallelAnimation { NumberAnimation { properties: "x,y"; duration: 200; easing.type: Easing.InOutQuad} NumberAnimation { target: ball; property: "x"; to: ball.nX; duration: 200; easing.type: Easing.InOutQuad } } }
}
@And while both the player and ball moved, they did not move in parallel.
I'm tempted to just forget about ParallelAnimation and just roll my own, but is there a common idiom for this that I should follow?