第10章 交互式动画.ppt

第10章 交互式动画 交互式动画 ActionScript可以使用Flash产生奇妙的动画效果，但这并不是ActionScript的全部，它更重要的作用是使动画具有交互性。这种交互性提供了用户控制动画播放的手段，使用户由被动的观众变为主动的操作者，可以根据徐奥播放声音、操作对象、获取信息等。 10.1 按钮事件及动态按钮 “交互”，就是用户利用各种方式，如按钮、菜单、按键、文字输入等，来控制和影响动画的播放。交互的目的就是使计算机与用户进行对话。 10.1.1 什么是动画的交互性 交互式动画是指在动画作品播放时支持事件响应和交互功能的一种动画，也就是说，动画播放时可以接受用户控制，而不是象普通动画一样从头播放到尾。 交互动画的实现，一般利用鼠标对按钮的操作来完成，此外也可以通过键盘事件来响应。 那么，这种交互动画是如何实现的呢？ 它们是通过一系列的ActionScript代码来实现。Flash的ActionScript可以在动画帧中调用，称为“帧动作脚本”。ActionScript代码可以通过对象进行调用，称为“对象动作脚本”。 “事件”，就是用户对动画的某种设定或交互。动画帧只要一个种事件，即被载入（播放）时，其中的动作脚本（如果有的话）能够得到执行。相对而言，对象（按钮或影片剪辑）的事件就丰富了许多。 按钮事件：press/release/release outside/roll over/roll out/drag over/drag out/key press up 10.1.2 动态按钮的制作 按钮式交互式动画常用控制方式。 Flash 8中的按钮式作为一个元件来制作的。 动作按钮的制作示例：P233 1、打开第4章制作的“按钮.fla”文件。 2、选择插入/新建元件命令，创建一个影片剪辑元件，将其命名为“光”。 3、在“光”原件中绘制一个金黄色的圆（无笔触颜色）。 4、在地20帧处插入一个关键帧，将舞台上的圆变形为“150%”. 5、选择第1帧，在属性面板中设置补间类型为 “形状”，如图。这样就创建了一个圆渐大的动画效果。 6、选择插入/新建元件命令，创建一个影片剪辑元件，将其命名为“发光”。 7、在“发光”元件编辑状态下，将元件“光”托人到舞台。 8、选择第20帧，按下F6键插入一个关键帧。选择舞台中的“光”实例对象，设置其颜色选项为“Alpha”, Alpha数量为“10%”。 9、再选择第1帧，然后在属性面板中设置补间类型为“动画”，以创建一个20帧的补间动画，如图。这样就创建一个透明度渐变的动画。 10、在库面板中双击“圆按钮”元件，进入其编辑状态，如图 11、选择指针经过帧，用文本工具在按钮上输入“开始”，设置文字样式和大小，如图。 12、单击 按钮，在时间轴上添加一个新层“图层 2”，并将其移动到“图层 1”的下方。 13、在指针经过和按下帧处分别添加关键帧，如图。 14、选择指针经过帧，从库面板中将“发光”元件拖到舞台上。调整元件实例的大小，使其基本与按钮大小相同。如图。 15、同时选择“发光”实例和按钮，使用对齐面板将他们重合并与舞台中心对齐。 16、单击场景1图标回到场景中，此时舞台上将会出现一个圆按钮实例。如图 17、选择控制/测试影片命令，用鼠标操作按钮，就可以看到一个动态按钮效果。 10.2 控制动画的播放 在Flash动画中，最常用的交互操作就是控制动画的播放和停止。可以使用“on()”和“onClipEvent()”事件处理函数来对舞台上的按钮或影片剪辑实例进行操作。“onClipEvent()”用于处理影片剪辑事件，而“on()”用于处理按钮事件。 （1）on()—事件处理函数，指定触发动作的鼠标事件或按键事件。用法如下： on(mouseEvent){ statement(s)//此处是事件语句 } “mouseEvent”称作“事件触发器”，当发生此事件时，执行事件后面大括号中的语句。 mouseEvent参数指定为前面说明的任何一种对象事件。 （2）stop()—停止当前正在播放的动画文件，并使播放指针停留在当前帧。 （3）play()—是动画从当前帧开始播放。 10.2.1 控制主时间轴动画 主时间轴动画，就是直接在动画的主时间轴上创建的补间动画或逐帧动画，利用“stop()”和“play()”语句可以直接控制这种动画。下面以第5章制作的“条形广告”动画为例，说明如何利用按钮控制动画的播放。 控制动画播放的示例：P236 1、打开第5章创建的“条形广告.fla”文件，如图，这是一个在住时间轴上实现的动画。 2、在时间轴窗口中单击 按钮，添加一个新层“图层 2”。 3、选择窗口/公用库/按钮命令，打开Flash 8提供的公用按钮库