Question

我有一个按钮，其中包含使用皮肤文件渲染显示的各种状态（向上/向上/向下等）。我想在各州之间实现动画。例如，在从'up'到'over'的变化之间，我希望淡化颜色和边框。

我现在这样做的方法是使用转换和mx：AnimateProperty在它们之间使用视图状态和动画。但是，使用此方法我只能为每个视图状态设置一个属性的动画。因此，只有边框或颜色可以动画。

有谁知道如何在程序化按钮皮肤的多个属性上实现多个动画？提前谢谢！

注意：我已经研究过使用tweener但看不出它会如何帮助我的情况

Answer 1

http://www.degrafa.org/

http://www.degrafa.org/source/AdvancedSkins/Skins.html

Answer 2

~~由于您使用皮肤文件，我认为您使用的是Flex4。~~

在Flex4中，您可以使用包含在s：Sequence或s：Parallel节点中的多个mx：AnimatePropery声明。

<s:transitions>
  <s:Transition>
    <s:Parallel>
      <mx:AnimateProperty
        target="{button}"
        property="property1"
        fromValue="property1StartValue"
        toValue="property1EndValue" />
      <mx:AnimateProperty
        target="{button}"
        property="property2"
        fromValue="property2StartValue"
        toValue="property2EndValue" />
    </s:Parallel>
  </s:Transition>
</s:transitions>

Answer 3

刘易斯，

您将无法在Flex 3中为ProgammaticSkin的任何属性设置动画，因为UIComponent执行外观的方式是实例化整个新的皮肤实例，然后设置其name属性。然后，当组件需要显示新状态时，它会生成另一个新实例，将其name属性设置为不同的属性，使旧皮肤不可见并使新皮肤可见。通过这种方式，它“缓存”皮肤，而不是在UpdateDisplayList中切换状态和重绘。

既然如此，你不能轻易地为皮肤本身的任何绘图制作动画，但是，虽然它并不完全优雅，但仍然有一个解决方案。

ProgammaticSkin扩展了FlexShape，因此您不能在皮肤上添加任何子项，但是UIComponent会查找实现IProgrammaticSkin的内容，因此您可以创建自己的ProgrammaticSkin来扩展FlexSprite而不是FlexShape。这允许你addChild到你的皮肤。如果你足够聪明，可以在各种缓存的皮肤之间同步转换，使它们具有动画效果。

希望有所帮助，

Jonathan

如何在程序化皮肤中的状态之间设置动画？ [柔性]

3 个答案: