[SOLVED]Wait for animation change in State change
-
Hi there,
I have the following code:
@import QtQuick 1.1
Rectangle {
id: containerwidth: 200; height: 200 Column{ anchors.centerIn: parent Rectangle{ id: rect1 color: "red" width: 50 height: 50 } Rectangle{ id: rect2 color: "green" width: 50 height: 0 } } MouseArea { anchors.fill: parent onClicked: { if(container.state === "") container.state = "moving"; else container.state = ""; } } states: State{ name: "moving" PropertyChanges { target: rect1 color: "yellow" } PropertyChanges { target: rect2 height: 50 } } transitions: Transition { reversible: true to: "moving" NumberAnimation{properties: "height"; duration: 400} }
}@
Just click two times to see the animation.
And I want the top rectangle becomes red only after green rectangle disappears(or slide in as it seems so). How can I accomplish that? -
Use "SequentialAnimation {}":http://developer.qt.nokia.com/doc/qt-4.8/qml-sequentialanimation.html in your transition.
-
sierdzio, good point, thanks!
But if we don't have an access to the Transition element, for example rect2 with its animation live in another QML file which knows nothing about the place it will be on?
Is there a way to accomplish it? -
Still works, as height is still a valid property when Rect2 becomes a separate file. Column and Row elements also have handy "add" and "move" properties that can be used here.
You may mean something a bit different though: that Rect2 becomes a new file with all States and Transitions info migrated there. This may indeed change things, but it depends on how you make the transition. And you can always do some magic with ScriptAction and Animation::onRunningChanged. For example, you can add this:
@
NumberAnimation {
// ... code here
onRunningChanged: {
if (!running) {
rect1.color = "yellow";
// or send a signal from within Rect2 file,
// that will trigger parent
// to change the colour
}
}
}
@ -
Thanks one more time, I think it is better to rethink my solution a bit instead of generating some workarounds. So I'll use the solution with sequential animation.