Animation on changing anchor property [Solved]
-
Hi all,
I have this situation:
@
Rectangle {id: window width: 800 height: 600 property string statoattuale: "statologin" FrecciaSx { id: frecciasx anchors { left: window.left verticalCenter: window.verticalCenter } } FrecciaDx { id: frecciadx anchors { right: window.right verticalCenter: window.verticalCenter } } PagePanel { id: panelpage state: statoattuale anchors { //left: window.left leftMargin: frecciasx.width //right: window.right rightMargin: frecciadx.width //top: window.top //bottom: window.bottom fill: window } }
}
@Now I'd like to hide in some situations the items FrecciaSx and FrecciaDx behind the PagePanel.
To do that I'm trying with:
@
states: [
State {
name: "statologin"PropertyChanges { target: frecciasx anchors.left: panelpage.left restoreEntryValues: true } PropertyChanges { target: frecciadx anchors.right: panelpage.right restoreEntryValues: true } } ]
@
It works but I don't know how to animate the movements when hiding the two items.
Is there a solution?
-
you can try
@transitions:
Transition{
from:*
to:"statologin"
NumberAnimation{target: frecciadx;duration:100;easing.type:Easing.outExpo}
}
@
and i guess, Behavior should also work on anchors
Add the following to frecciadx and frecciasx
@Behaviour on anchors{
NumberAnimation{easing.type:Easing.OutExpo;duration:1000}
}@ -
Thanks but the solutions doesn't seems to works.
The first one do nothing without warning or error messages.
With the second one my application stops and I get this message:
@
Invalid property assignment: "anchors" is a read-only property
Behavior on anchors{
^
@ -
I know I should position the FrecciaSx and FrecciaDx and set their x propery to move behind the PagePanel but I'd like to position the items with anchor property because I want keep scaling when moving main windows dimensions...
-
you must use AnchorChanges in states and AnchorAnimation to animate the changes in transitions
-
[quote author="deimos" date="1322998581"]you must use AnchorChanges in states and AnchorAnimation to animate the changes in transitions[/quote]
Thanks deimos, it works!
This is the code I used:
@
states: [
State {
name: "statologin"AnchorChanges { target: frecciasx anchors.left: panelpage.left } AnchorChanges { target: frecciadx anchors.right: panelpage.right } }, State { name: "statoriepilogo" } ] transitions: Transition{ AnchorAnimation{ duration:1000 } }
@