[Qt-qml] How to animate an item moving between layouts

Artem Marchenko artem.marchenko at gmail.com
Sun Dec 11 01:27:51 CET 2011


Hi Harald

There is ParentAnimation for it - http://doc.qt.nokia.com/latest/qml-parentanimation.html

However, I tried it with your example and parent change is not animated. Interestingly mixing the docs example with your code results in the immediate parent change and then slow move by 10x10 pixels:
states: State {
             name: "reparented"
             ParentChange { target: blueRect; parent: redRect; x: 10; y: 10 }
         }

         transitions: Transition {
             ParentAnimation {
                 NumberAnimation { properties: "x,y"; duration: 1000 }
             }
         }
Maybe it doesn't work with repeaters?

A brute force solution would be to reparent your box temporarily to the higher level item, calculate source and target coords in this higher level item, animate and reparent to the target layout once animation is finished. Could, however, be problematic if you want to insert the item into a middle of a row.

Best regards,
Artem.

On Dec 10, 2011, at 12:49 PM, Harald Hvaal wrote:

> Hi, I am hoping that someone could help me solve this seemingly simple problem:
> How do I animate an item moving from one layout two another?
> 
> I have attached a small example of what I am trying to do, but even
> more summarized the problem goes like this:
> 
> Row { id: top;    Box{id: box} }
> Row { id: bottom; }
> Button { onClicked: { box.parent = bottom; }
> 
> How do I animate this parentchange?
> 
> I have tried add/move-transitions on the rows, I have tried
> ParentChange in states, ParentAnimations used on behaviors, nothing
> seems to solve this problem. Any help would be greatly appreciated!
> 
> Thanks,
> 
> Harald Hvaal
> harald.hvaal at gmail.com
> <layoutAnimation.qml>_______________________________________________
> Qt-qml mailing list
> Qt-qml at qt.nokia.com
> http://lists.qt.nokia.com/mailman/listinfo/qt-qml

-------------- next part --------------
An HTML attachment was scrubbed...
URL: http://lists.qt.nokia.com/pipermail/qt-qml/attachments/20111211/654d5fd8/attachment.html 


More information about the Qt-qml mailing list