动画子元素中的Flex 4 [英] Animating child elements in Flex 4

问题描述

任何人都知道如何在Flex 4的动画的布局子元素的大小/位置？

Anyone know how to animate the size/position of child elements of a layout in Flex 4 ?

例如：

我有一个列表组件与自定义布局。我想，当我改变我希望他们能够制作动画的移动到新位置的子元素的位置。

I have a list component with a custom layout. I want when I change the positions of the child elements I want them to animate their move to the new positions.

推荐答案

目前还没有内置的方法，也没有计划，使动画布局中的Flex 4：/

There is currently no built in way, nor plans, to make animated layouts in Flex 4 :/.

我已经做了什么要做到这一点是动画setLayoutBoundsPosition和setLayoutBoundsSize在布局的设置。因此，而不是创造一个移动和调整的效果在布局中的每个项目，这实际上将设置宽度和高度明确的，设置的矩阵。然后确保布局不会再次失效（如果直接设置宽度/高度将发生），否则你可能会开始得到一个无限循环。您可能需要做一些技巧来得到这个工作的权利（我还没有得到它的使用Spark效果很正确的工作，但它真的很容易做中间人/ Tweenmax，因为他们有插件，而这种用setActualSize 或setLayoutBoundsSize，等）。

What I've done to make this happen is to animate the setting of "setLayoutBoundsPosition" and "setLayoutBoundsSize" in the layout. So instead of creating a "Move" and "Resize" effect for each item in the layout, which would actually set the width and height explicitly, set the matrix. Then make sure the layout isn't invalidated again (which will happen if you set the width/height directly), or you might start getting an infinite loop. You might have to do some tricks to get this to work right (I haven't got it to work quite right with the Spark Effects, but it's really easy to do with Tweener/Tweenmax, since they have plugins and such to use "setActualSize" or "setLayoutBoundsSize", etc.).

我用TweenMax动画布局，而且他们有一些插件来使这个容易。 TweenMax明显看起来像快3倍（20 FPS VS 7FPS）比星火效果也一样，所以我与该走了。它看起来是这样的，在布局的的updateDisplayList 方法。

I use TweenMax to animate layouts, and they have a few plugins to make this easy. TweenMax visibly looks like 3x faster (20 fps vs 7fps) than Spark Effects, too, so I'd go with that. It looks something like this, in the updateDisplayList method of your layout.

TweenMax.to（儿童，持续时间，{setLayoutBoundsPosition：{X：childX * I，Y：childY * I}}）;

这篇关于动画子元素中的Flex 4的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！