Flex动画效果的用法--Resize

时间:2021-07-19 18:49:50
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
  3. xmlns:s="library://ns.adobe.com/flex/spark"
  4. xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">
  5. <s:layout>
  6. <s:BasicLayout/>
  7. </s:layout>
  8. <fx:Declarations>
  9. <!-- 将非可视元素(例如服务、值对象)放在此处 -->
  10. <mx:Resize id="expand" target="{img}" widthTo="200" heightTo="200"
  11. duration="10000" effectEnd="endEffectHandler();"/>
  12. </fx:Declarations>
  13. <mx:Image id="img" width="30" height="60"
  14. source="@Embed(source='source/img1.jpg')"/>
  15. <mx:Button id="button1" label="启动" click="expand.play();" x="103" y="197"/>
  16. <mx:Button label="暂停" click="expand.pause();" x="188" y="197"/>
  17. <mx:Button label="继续播放" click="expand.resume();" x="269" y="198"/>
  18. <mx:Button label="逆序播放" click="expand.reverse();" x="355" y="198"/>
  19. <mx:Button label="结束" click="expand.end();" x="434" y="197"/>
  20. <fx:Script>
  21. <![CDATA[
  22. import mx.controls.Alert;
  23. private function endEffectHandler():void {
  24. Alert.show("Effect 结束!");
  25. }
  26. /*
  27. Resize 效果在指定的时间间隔更改组件的宽度或高度,或同时更改这两者。
  28. 属性
  29. Resize:效果的持续时间(以毫秒为单位)。
  30. 事件
  31. effectEnd:mx.events.EffectEvent.EFFECT_END
  32. 方法
  33. play():
  34. 开始播放效果。通常在调用 play() 方法之前先调用 end() 方法,以确保在开始播放新效果前已结束先前效果的所有实例。
  35. 所有子类都必须实现此方法。
  36. pause():
  37. 暂停效果,直到调用 resume() 方法。
  38. resume():
  39. 在效果由 pause() 方法暂停后继续播放效果。
  40. reverse():
  41. 逆序播放效果;如果当前正在播放效果,则从该效果的当前位置开始逆序播放。
  42. end():
  43. 断当前正在播放的效果,立即跳转到该效果的末尾。调用此方法将调用 EffectInstance.end() 方法。
  44. 如果调用此方法来结束播放效果,效果实例将分派 effectEnd 事件。
  45. 如果将效果实例作为参数传递,则会中断此实例。如果没有传入参数,则该效果当前生成的所有效果实例都将中断。
  46. */
  47. ]]>
  48. </fx:Script>
  49. </s:Application>