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>

Flex动画效果的用法--Resize的更多相关文章

  1. Flex 动画效果

    1.使用自带效果 在Flex里面不像在Flash里面随意制作动画了,Flex更趋向于应用程序,而不是动画制作了,所以没有了时间轴的概念.在Flex中使用动画效果,可以用Flex自带的Effect,或者 ...

  2. paip.关于动画效果的原则 html js 框架总结

    paip.关于动画效果的原则 html js 框架总结 1. 动画框架的来源:flex,jqueryui 3 2. 特效的分类 3 2.1. Property effects 动态改变一个或多个目标对 ...

  3. jquery属性操作,应用,事件,扩展extend,动画效果(二)

    一.相关知识点总结1.CSS .css()      - .css("color")  -> 获取color css值 - .css("color", & ...

  4. CSS3中的动画效果记录

    今天要记录的是CSS3中的三种属性transform.transition以及animation,这三个属性大大提升了css处理动画的能力. 一.Transform 变形 CSS中transform ...

  5. 用js实现动画效果核心方式

    为了做好导航菜单,有时候需要在菜单下拉的时候实现动画效果,所以这几天就研究了研究如何用js实现动画效果,实现动画核心要用到两个函数,一个是setTimeOut,另一个是setInterval. 下边我 ...

  6. 深入学习jQuery的三种常见动画效果

    × 目录 [1]显隐效果 [2]高度变化 [3]淡入淡出 前面的话 动画效果是jQuery吸引人的地方.通过jQuery的动画方法,能够轻松地为网页添加视觉效果,给用户一种全新的体验.jQuery动画 ...

  7. jquery animate 动画效果使用解析

    animate的意思是:使有生气:驱动:使栩栩如生地动作:赋予…以生命作为形容词:有生命的:活的:有生气的:生气勃勃的 先看动画效果:http://keleyi.com/keleyi/phtml/jq ...

  8. 基于jquery fly插件实现加入购物车抛物线动画效果,jquery.fly.js

    在购物网站中,加入购物车的功能是必须的功能,有的网站在用户点击加入购物车按钮时,就会出现该商品从点击出以抛物线的动画相似加入购物车,这个功能看起来非常炫,对用户体验也有一定的提高.下面介绍基于jque ...

  9. jquery插件——点击交换元素位置(带动画效果)

    一.需求的诞生 在我们的网页或者web应用中,想要对列表中的元素进行位置调整(或者说排序)是一个常见的需求.实现方式大概就以下两种,一种是带有类似“上移”.“下移”的按钮,点击可与相邻元素交换位置,另 ...

随机推荐

  1. tp框架中的一些疑点知识-8

    NaN是Number对象的一个属性, 表示一个特殊值, 表示不是一个 数字, 引用/赋值时, 要使用: Number.NaN 判断 一个值是不是 NaN, 用 isNaN() 函数, 它是一个js的全 ...

  2. Docker 搭建Spark 依赖singularities/spark:2.2镜像

    singularities/spark:2.2版本中 Hadoop版本:2.8.2 Spark版本: 2.2.1 Scala版本:2.11.8 Java版本:1.8.0_151 拉取镜像: [root ...

  3. ActiveMQ安装使用

    入门: https://www.cnblogs.com/cyfonly/p/6380860.html http://www.uml.org.cn/zjjs/201802111.asp https:// ...

  4. java泛型的作用和好处

    转载于:https://blog.csdn.net/u012760183/article/details/52092692 之前参加面试的时候遇到面试官问泛型的作用,只是说了大概自己的理解, 在此转载 ...

  5. Ubuntu 14.04 上安装 Gurobi

    参考: Installing Gurobi 7 on Linux Ubuntu 14.04 上安装 Gurobi 1.在gurobi上创建一个账户,并登陆: 2.从gurobi optimizer上下 ...

  6. POJ 3087 Shuffle'm Up(洗牌)

    POJ 3087 Shuffle'm Up(洗牌) Time Limit: 1000MS    Memory Limit: 65536K Description - 题目描述 A common pas ...

  7. PS与PL协同设计

    https://blog.csdn.net/Fei_Yang_YF/article/details/79676172 什么是PS和PL ZYNQ-7000是Xilinx推出的一款全可编程片上系统(Al ...

  8. BOM - 浏览器API

     1,javascript   组成部分: 1.ECMAscript(核心标准):    定义了基本的语法,比如:if for 数组 字符串 ... 2.BOM  : 浏览器对象模型(Browser ...

  9. CSS深入

    块元素:div.h1.p等等. 列表的样式: /*使用系统提供的一些样式:例如无序.有序都可以使用circle*/ ul{ list-style-type: circle; } ol{ list-st ...

  10. Windows系统零开始前端开发环境配置

    1. 安装nodejs 国内下载页面(推荐) 官网下载页面 现在的nodejs自带NPM,只需点击下一步下一步安装即可. 为了加速国内NPM包下载,可配置淘宝NPM镜像 2. 安装git 国内下载页面 ...