QML animations based on states

Hi,

I have created Sample.qml file and have

Code:

---

import QtQuick 2.0
import QtQuick.Window 2.0
 
Rectangle {
    id: root
    width: Screen.width
    height: Screen.height
 
    Rectangle{
        id: r1
        width: 100
        height: 100
        x: 200
        y: 200
        color: "green"
    }
 
    Rectangle{
        id: r2
        width: 100
        height: 100
        x: 400
        y: 200
        color: "cyan"
        visible: false
    }
}

---

Here rectangle r1 is visible and r2 is non-visible. I want PropertyAnimation on r1 and change its opacity to 0.01. Then once this animation is ended I want r2 to become visible and separate animation to start on r2 once it is visible.
Can somebody please add necessary code to this. I know this has to be achieved through states and transitions.


Thanks

Manish

It does not have to be achieved by states and transitions, though of course it is possible to use states to do the job.

I want to manage from single qml file so still do you think states are not required. Can you pl. suggest some way out.

States are not required. You can define a SequentialAnimation object and trigger the animation whenever you want. Of course you can do the same as a state transition.

Thanks. Done using SequentialAnimation