Reusable SequentialAnimation

jknick

I'm trying to make a reusable animation and it's not working.
Why would I not be able to do something like this?

I'm defining an animation in file "ZoomAnim.qml" :

@
import QtQuick 2.1

SequentialAnimation on scale {
PropertyAnimation { property: "scale"; to: 2.0; duration: 500 }
PropertyAnimation { property: "scale"; to: 1.0; duration: 500 }
}
@

And in another file trying to do something like this:

@
Rectangle {
id: rect
ZoomAnim { id: myZoom }

MouseArea {
    anchors.fill: parent
    onClicked: {
        myZoom.running = true
    }
}

}
@

Which results in no animation. Presumably the PropertyAnimations are not getting good targets.

Or is there another preferred way to reuse an animation like this across a collection of widgets?

Thanks,
Jake

stevenceuppens

Hi,

example below should work,

you have indeed to set proper targets,

"on scale" works as a shortcut, and only inside the target, not from a different component.

main.qml
@
import QtQuick 2.0

Rectangle {
width: 360
height: 360

ZoomAnimation { 
    id: myZoomAnimation

    myTarget: myRect 
}

Rectangle {
    id: myRect

    color: "red"

    width: 100
    height: 100

    anchors.centerIn: parent

    MouseArea {
        anchors.fill: parent
        onClicked: {
            myZoomAnimation.running = true;
        }
    }
}

}
@

ZoomAnimation.qml
@
import QtQuick 2.0

SequentialAnimation {

property variant myTarget;

PropertyAnimation { 
    target: myTarget
    property: "scale"
    to: 2.0
    duration: 500 
}
PropertyAnimation { 
    target: myTarget
    property: "scale"
    to: 1.0
    duration: 500 
}

}
@

jknick

And it's so obvious is retrospect.

Thanks!