[SOLVED] Object rotating twice on Transition
-
Hi,
I've been having problems with animating an object's rotation.
I have a component which has a State with a rotation change using a random value inside a PropertyChange and whenever I try to use a transition to animate the rotation, it somehow applies two values to the rotation: one before the animation starts and one after. This is annoying because when the animation finishes for the first rotation values, it "jerks" to the value of the second rotation value.I recreated the problem "here.":https://gist.github.com/valorcurse/f688baf5e6dcfd714e69
Any idea what I'm doing wrong?
-
Hi,
I suspect mouse.pressed is causing the problem. Use onClicked handler in MouseArea and there change the state.
-
I'm afraid it still sets the rotation value twice.
I updated "it.":https://gist.github.com/valorcurse/f688baf5e6dcfd714e69 -
Remove the when binding
-
I believe I did, it's commented out. "I deleted the comment just to be sure.":https://gist.github.com/valorcurse/f688baf5e6dcfd714e69
Any other idea about what might be the problem?
-
"this":http://qt-project.org/doc/qt-5/qml-qtquick-propertychanges.html#explicit-prop should help you.
-
That's exactly it, works perfectly now. Thank you.
I added the code below in case someone has the same problem:
@import QtQuick 2.2
import QtQuick.Window 2.1Window {
visible: true
width: 360
height: 360MouseArea { id: mouseArea anchors.fill: parent onClicked: { rect.state = rect.state === "clicked" ? "" : "clicked"; } } Rectangle { id: rect width: 50 height: 50 color: "blue" anchors.centerIn: parent function getRandom() { var rand = Math.floor(Math.random() * 360) + 1; console.log("Random: " + rand); return rand; } states: [ State { name: "clicked" PropertyChanges { target: rect explicit: true rotation: getRandom() } } ] transitions: Transition { to: "clicked" RotationAnimation { target: rect duration: 500 } } }
}
@