1、第13章 动画编程,Flash由设计之初即以表现动画见长。其早期版本以关键帧间的渐变动画为主，展示了极大魅力。随着ActionScript脚本语言的发展，越来越多的动画表现开始使用程序来控制。 动画的关键因素在于时间和画面变化。如果没有时间的流逝，呈现的将只是一幅不会变化的静止画面；而如果没有画面变化，时间的流逝也将失去意义。,第13章 动画编程,在ActionScript中，描述时间变化的对象主要是播放头和计时器。例如一个设置了帧频为24fps的Flash动画，将以每秒24帧的速度在屏幕上刷新画面。而一个定义了delay属性为50的计时器（Timer实例）则会间隔50毫秒刷新画面。另一方面，
2、描述画面变化的形式则多种多样。一个显示对象的坐标值发生变化时（x、y属性），可以产生对象移动的动画；透明度（alpha属性）的减小则会形成显示对象逐渐隐去的动画；transform属性的变化则会使对象在形状、颜色上发生变化等。 本章将把握动画是在时间和画面上的变化这一本质，介绍使用ActionScript编写动画程序的方法。,13.1 播放头动画,播放头动画是利用Event.ENTER_FRAME播放头事件来描述时间变化的动画方式。Flash按帧频每隔一段时间刷新一次画面，如果画面中的元素发生变化，便会形成动画效果。由于人的视觉特性，一般24fps以上的帧频会使人感觉流畅，一般情况下要表现流畅
3、动画效果会将帧频设置为24fps、30fps或60fps。,13.2 计时器动画,Timer类是Flash Player计时器的接口。在创建Timer对象后，可以按指定的时间顺序运行代码。播放头动画在设定帧频之后，程序即按照一定的时间间隔执行代码。而Timer类则需要使用start方法来启动计时器，也可以通过stop方法停止。控制上要比播放头动画更方便。 注意Timer类在计算时间上也并不准确，不能使用它来计算精确的时间。 使用计时器时，须先声明一个计时器对象。其语法如下。 var timer:Timer = new Timer(延迟时间,重复次数);,13.2 计时器动画,之后为timer实
4、例注册相应的计时器事件，如下列代码。 timer.addEventListener(TimerEvent.TIMER,count); function count(e:TimerEvent):void trace(e.target.currentCount); 最后启动计时器即可开始执行。 timer.start();,13.3 面向对象动画编程,在前两节的例子中，我们从头至尾控制着整个动画的过程。这种面向过程的处理方式非常直观，便于学习和理解。但是当场景中显示的对象越来越多，不同对象间的行为模式也原来越定于个性时，面向过程的编程方式往往使问题变得复杂、缺乏层次。此时正是面向对象编程大显身手的
5、时候,13.3.1 多个类的结合,上例中对小球的控制是面向对象的基础。我们已经开始使用类文件来描述对象的运动的动画了。接下来我们将使用多个类，来构造更便于控制的小球，这也为我们今后不断更新Ball这个类创造较好的测试环境。 首先我们描述一下编程的目的。 在Ball类中，我们留下了公共接口：两个公共变量xSpeed和ySpeed，以及update方法。新任务是要在场景中以鼠标按下时的坐标为起始点，抬起时的坐标为终点，绘制一个黑色的箭头。小球将根据这个箭头的起始点来确定初始位置，以箭头的长度来确定初始速度，以箭头的方向来确定运行的方向。,13.3.1 多个类的结合,程序执行时的假想图如下。,13.
6、3.2 类动画效果的继承,在Ball类中，我们已经可以设置小球的移动速度，并且小球也可以通过调用update方法来更新其位置。接下来，我们将使用一个新的类Ball_g继承Ball类，为Ball类增加重力属性。具体代码如下。,13.3.2 类动画效果的继承,13.3.2 类动画效果的继承,注意：构造函数中可以使用super方法调用父类的构造函数，这样就不需要重复父类已经有了的代码。而update方法则需要使用override关键字对其进行覆盖，这样才能使关于重力的运算也被加入到update方法中。,13.4 Tween类动画编程,Tween类是一个动画控制类。它可以通过ActionScript代
7、码指定目标影片剪辑的属性在若干帧数或秒数中具有动画效果，从而实现诸如移动、调整大小和淡入淡出等操作。,13.4.1 设置Tween动画,要使用Tween类，须先导入必要的类包。 import fl.transitions.Tween; import fl.transitions.easing.*; 其中，导入的fl.transitions.Tween类即为Tween，而fl.transitions.easing包则是一组用于指定动画效果的缓动函数。这些缓动函数描述的是不同的运动规律。,13.4.1 设置Tween动画,导入类包之后，还需要将Tween类实例化，其语法如下。 var t:Twee
8、n = new Tween(对象,属性,缓动函数,初始值,终止值,动画时间,是否使用秒为单位); 对象：Tween实例作用的对象，通常是一个显示对象。 属性：一个字符串，是Tween实例作用对象的属性名称。Tween实例通过改变这一属性实现动画效果。 缓动函数：一组描述动画效果的数学模型，可根据它设置动画特点。生成Tween动画时，通过缓函数采样取值。,13.4.1 设置Tween动画,初始值：指属性在动画开始时的值。 终止值：指属性在动画结束时的值。 动画时间：指Tween动画的持续时间，可以支持按秒计算或按帧计算。 是否使用秒为单位：这是一个布尔值变量，当设置为true时使用秒来计算动画时
9、间，设置为false时则会按帧数计算。,13.4.2 缓动函数简介,fl.transitions.easing包中包含了用来创建缓动效果的类。这些类可以按照数学模型进行采样，使动画过程更加逼真生动。fl.transitions.easing包中包括6个类，分别如下。 Back类：用于表现对象与目标先拉远，再逼迫的缓动动画。例如上一个例子中使用的Back.easeIn，是先后退再向目标点前进；Back.easeOut则是运动对象超过目标，再退回来的动画效果。Back.easeInOut则是easeIn和easeOut的综合效果，先从起点后退后前进，冲过终点后再退回。,13.4.3 Tween动画
10、的设置,Tween类提供了一些属性和方法用于控制动画的播放。通过与Tween类专有的事件TweenEvent结合，可以很方便地控制动画的播放。以下提示几种较常用的情况。 循环播放Tween动画： 控制Tween动画循环播放时，只须设置Tween对象的looping属性即可。,13.5 TransitionManager类调用预设动画,ActionScript 3.0中还提供了TransitionManager调用预设动画。这些动画效果比Tween类动画更复杂，更具实用性。是制作影片剪辑和换灯片常用的动画效果。下面分别通过实例来了解这些预设动画的特性。,13.5.1 百叶窗过渡效果,百叶窗过渡效
11、果使用fl.transitions包中的Blinds类实现。设置TransitionManager类动画的推荐方式是使用静态方法，语法如下。 TransitionManager.start(动画对象, 参数对象)； 其中动画对象要求为MovieClip实例，参数对象为一个关联数组，以下是一个常见的参数对象。 (type:Blinds, direction:Transition.IN, duration:1, easing:Bounce.easeOut 它描述了TransitionManager动画使用了百叶窗效果，方向为由无到有，持续时间1秒钟，缓动函数为Bounce.easeOut。,13.
12、5.2 淡入淡出效果,淡入淡出效果使用fl.transitions包中的Fade类实现。其它各项设置与Blinds相同。,13.5.3 飞入飞出效果,飞入飞出效果使用fl.transitions包中的Fly类实现。设置该效果后，影片编辑将由屏幕外飞入原坐标，形成动画效果。下面使用飞入飞出效果制作一个鼠标位置感应弹出的菜单。,13.5.4 遮罩渐变效果,遮罩渐变效果通过fl.transitions包中的Iris类实现，它为影片剪辑设置一个圆形或矩形的遮罩，过渡变化形成动画效果。其参数对象可以接受两个键值。 一个是shape，设置为“CIRCLE”时使用圆形遮罩，设置为“SQUARE”时使用矩形遮
13、罩。 另一个键值是startPoint，它可以接受19共九个整数。其中1表示动画从左上角开始，2为中上，3为右上，4为左中，5为中心，6为右中，7为左下，8为中下，9为右下。直观的看，可以对应图13.28，便于记忆动画方向。,13.5.5 照片渐变效果,照片渐变效果通过fl.transitions包中的Photo类实现，可以令影片剪辑象放映照片一样出现或消失。其设置与其他几种动画效果相似。,13.5.6 像素融解效果,像素融解效果是通过fl.transitions包中的PixelDissolve类实现的。它可以令影片剪辑以矩形块为单位逐渐显示或消失。 PixelDissolve效果可以指定两个
14、参数以设置效果，xSections指定横向上矩形块的个数，最大为50；ySections指定纵向上的矩形块的个数，最大为50。也就是说，像素融解最大可以支持到分2500个块来融解图像。,13.5.7 旋转过渡效果,旋转过渡效果是通过fl.transitions包中的Rotate类实现的。它可以令影片剪辑旋转着接近原始位置。 旋转过渡效果可以指定两个参数，ccw用于设置旋转方向，当其为true时为逆时针方向旋转，为false时是顺时针方向旋转。degrees参数用于设置旋转的角度，如设置为360时即表示旋转一周。,13.5.8 挤压渐变效果,挤压过渡效果是通过fl.transitions包中的Squeeze类实现的。它可以令影片剪辑在垂直或水平方向发生挤压变形，形成动画效果。 挤压过渡效果可以指定1个dimension参数，当其为0时为水平挤压，为1时为垂直挤压。,13.5.9 划入划出渐变效果,划入划出效果是通过fl.transitions包中的Wipe类实现的。它可以通过一个遮罩运动逐渐显示或隐藏影片剪辑，形成动画效果。 划入划出效果可以指定1个startPoint参数，以确定动画开始的方向。,13.5.10 缩放渐变效果,缩放渐变效果是通过fl.transitions包中的Zoom类实现的。它可以通过比例变化将影片辑剪由小到大或由大到小显示，形成动画效果。,
