交互式动画教程

《交互式动画教程》由会员分享，可在线阅读，更多相关《交互式动画教程（27页珍藏版）》请在金锄头文库上搜索。

1、动画制作教程交互式动画就是允许观众对影片进行控制， 而达到某种目的的动画。交互式动画在动画与观 众之间形成一种互动，使观众可以参与到动画中 来。例如前面介绍的按钮元件的制作，它可以通 过鼠标的移入或移出制作出不同的响应效果。而 除了简单的响应效果以外，还可以通过为按钮编 写脚本语言，使按钮具有控制影片的播放或者链 接到指定的网页中去的功能。 这是传统动画所不 具备的，在Flash中却能轻松实现 。动画制作教程 教学内容1 脚本语言基础 时间轴控制 3 on语句 5 利用getURL语句 6 利用Mouse.hide与startDrag语句制作 个性化鼠标指针 7 利用on、startDrag与

2、stopDrag语句制 作可以拖动的影片剪辑 8 本章小结 动画制作教程 1 脚本语言基础 所有脚本语言的编写均在动作面板中完成，执行“窗 口”“开发面板”“动作”命令或直接按F9快捷键， 即可打开动作面板，如下图所示 。 动作面板共有三个窗口组成，左上角为动作工具栏， 以树状结构显示Flash支持的所有脚本语言。左下角为信息 工具栏，显示当前的选择，也就是要附加脚本语言的对象 和已经附加脚本语言的对象的信息。右边为脚本编辑区， 编辑与显示脚本语言的窗口。动画制作教程交互式动画是由触发动作的事件、事件的目标和触发 事件的动作3个因素组成的，例如单击按钮后，影片开始播 放这一事件。其中，单击是触

3、发动作的事件，按钮是事件 的目标，影片开始播放是触发事件的动作。换句话说，事 件、目标和动作构成了一个交互式动画。在Flash中，事件包括鼠标事件、键盘事件和帧事件三 种。目标包括时间轴、按钮元件和影片剪辑元件三种。而 动作就是指控制影片的一系列脚本语言，所以说脚本语言 的编写也就是各种动作的编写 。1.1 交互式动画原理动画制作教程1.2 脚本编辑区的构成 1添加动作按钮：单击此按钮添加脚本语言。功能与动作 工具栏相同，可以将它理解为动作工具栏的快捷方式。 2查找替换按钮：单击此按钮，弹出“查找”对话框，用 于在脚本编辑区中查找指定的脚本语言,单击“替换”对话 框，用于在脚本编辑区中查找并替

4、换指定的脚本语言。 3指定目标路径按钮：单击此按钮，弹出“插入目标路径 ”对话框，用于设置影片剪辑实例和按钮实例的目标路径 。1 25 6 73 489动画制作教程4语法检查按钮：用于检查当前脚本语言中的错误。如果脚本 语言中有错误，错误报告将显示在“输出”窗口中。 5自动套用格式按钮：调整当前脚本语言的格式，使它标准化 。 6显示代码提示按钮：控制是否显示代码提示。通过显示代码 目录，快速查找到需要的脚本语言。 7调试选项弹出菜单：单击此按钮，弹出调试选项弹出菜单。 用于在脚本中设置和删除用于调试的断点。可以检查动作脚本 的语法错误。 8. 脚本助手：单击此按钮，可以在动作面板中显示出当前脚

5、本 命令的使用说明。 9. 帮助：单击此按钮，弹出帮助菜单。1 25 6 73 489动画制作教程1.3 语言的编写方式在编写脚本语言时，既可以通过直接在脚本编辑区中 输入字符进行编写，又可以通过在动作工具栏中选择项目 进行编写。单击动作工具栏中的项目文件夹，可展开或收缩文件 夹。在展开的项目文件夹中包含多个脚本项目，通过双击 进行选择。此外，还可以通过添加动作按钮，将新项目添 加到脚本中。 1.4 脚本元素根据元素性质和作用的不同，Flash将脚本元素分为12 大类，被分别归类整理于12个项目文件夹，如图1所示。“ 索引”元素则是所有脚本项目的集合，可按照字母顺序将 所有的脚本项目显示出来。

6、 动画制作教程各项目文件夹的特点如下：l 全局函数：该文件夹中包括了制作影片时根据不同用途 使用的各种函数，动作语句等，共有时间轴控制（控制影片 播放的函数）、浏览器/网络（控制Web浏览器和网络的函数 ）、影片剪辑控制（控制影片剪辑的函数）等7种函数，如 图2所示。图3 图2l 全局属性。包含全局属性和标识符，用于设置生成影片 对象的各种具体参数，例如影片的显示质量等，如图3所示 。图1动画制作教程l 语句。包含动作脚本语句的关键字。包括变量（修改和 访问变量的动作）、类构造（用于创建类的构造）、条件/ 循环（条件语句和循环构造）等5种类别。l 运算符。包含可在语句中使用的运算符。用于各种对

7、象 间的运算。 l ActionScript2.0类。动作脚本提供的预定义类。由于 Flash脚本语言是面向对象的开发工具，所以该类别可以说 是Flash脚本语言中最重要的类别。它包含了可在脚本中使 用的对象及其属性、事件和方法的项目列表。利用对象可 以得到或设置特殊的类型信息。l 常数。在脚本语言中使用的全局常量。它包含了如false 、null、true和undefined等固定值的函数。l 编辑器指令。该文件夹中包括了开始一个组件初始化块 ，结束一个组件初始化块和包括来自文件的脚本选项。 动画制作教程l 否决的。该文件夹中包括了动作、函数、运算符与属性 中应避免在新内容中出现的功能。l

8、数据组件。该文件夹中的内容是各种行为数据的集合， 是以前需要通过复杂的脚本语言编写才能实现的功能的集 合 。 l 屏幕。可以使用行为为屏幕创建控件和过渡，例如制作 出屏幕的淡入或淡出效果等 。l 组件。用于设置组件的各种参数及属性 。 1.5 脚本的应用位置脚本的应用位置就是脚本语言的目标，它包括时间轴 、按钮元件和影片剪辑。也就是说，脚本语言的对象既可 以是各关键帧，又可以是按钮或影片剪辑实例。 动画制作教程 2 时间轴控制 时间轴控制中包括了几种最常用的动作，用于控制 影片或影片剪辑元件中的时间轴。理解这些语言的意义 ，掌握它们的编写与操作，可以轻松实现交互式影片中 最为常见的效果。实例如

9、控制影片的播放，停止和重新 播放等。时间轴控制命令位于全局函数的子文件夹中， 所有项目如下图所示 。 动画制作教程2.1 stop、play语句 stop动作就是让影片停止播放。它既可以应用于影片 中的时间轴，达到控制影片的目的。又可以应用于影片剪 辑元件中的时间轴，达到控制影片剪辑元件的目的。play动作就是让影片从当前位置开始播放。Stop与play语句没有参数。 2.2 goto语句goto动作使电影跳转到时间轴上指定的帧或场景。分 为gotoandplay和gotoandstop两种，用于设置在跳转到该 帧或场景之后是否继续播放影片。goto语句的参数为帧或场景。假如当前有一个鼠标事

10、件，当释放鼠标时，当前影片将跳转到场景2的第5帧继续 播放，脚本语言如图1所示；假如当前有一个鼠标事件，当动画制作教程释放鼠标时，影片将跳转到当前影片的第15帧后停止播放 ，脚本语言如图2所示。 图1图22.3 nextFrame和prevFrame语句nextFrame动作就是让影片播放到下一帧并停止。prevFrame动作就是让影片返回到上一帧并停止。nextFrame与prevFrame语句没有参数。它们一般应用 于鼠标事件中，控制影片的前进或后退。 动画制作教程2.4 nextScene和prevScene语句 nextScene动作就是让影片播放到下一场景的第 1 帧 并停止。pre

11、vFrame动作就是让影片返回到上一场景的第 1 帧并 停止。nextScene与prevScene语句没有参数。用法与 nextFrame和prevFrame语句类似。 2.5 stopAllSounds语句stopAllSounds动作停止当前影片中所有的声音效果， 而不影响影片的视觉效果，没有参数。通常用于制作静音 按钮。 动画制作教程 3 on语句 on语句位于全局函数的子文件夹影片剪辑控制中，如 图1所示。on语句用于设置鼠标的各种事件，实际上是事件 而不是动作。3.1 on事件双击on语句，在脚本编辑区出现on事件提示列表，如 图2所示。在提示列表中包含了应用于按钮实例的各种事件

12、，共计22个，下面将逐一进行描述。图1图2动画制作教程事件描述事件描述 press单击keypress”单击Insert键release释放鼠标keypress”单击Delete键releaseOutside外部解释keypress”单击Backspace键roollover滑过keypress”单击回车键 roollout滑离keypress”单击Up键 dragover拖过keypress”单击Down键 dragout拖离keypress”单击PageUp键keypress”单击键keypress”单击PageDown键keypress”单击键keypress”单击Tab键keypres

13、s”单击Home键keypress”单击Esc键keypress”单击End键keypress”单击空格键3.2 将脚本语言的应用于按钮元件本节将制作一个使用按钮控制影片播放的动画。也就 是说，动画在开始时是停止的，只有在单击按钮以后，动 画才能播放。动画制作教程本节将通过为按钮设置不同的语句，达到控制影片播 放、停止、前进一帧和后退一帧的目的。通过本例制作， 掌握通过按钮控制影片的方法。 3.3 利用Play、Stop、nextFrame、prevFrame语句结合on 语句控制影片播放动画制作教程 4 利用getURL语句 getURL动作主要从事两项工作。其一，将指定的URL 加载到浏览

14、器窗口。其二，将变量数据发送到指定的URL 。也就是常用的超链接和发送E-mail功能，用户通过单击 被附加动作的按钮完成上述两种操作。在动作面板中，双击“全局函数”“浏览器/网络 ”“getURL”选项，即可添加该动作。 getURL语句的参数为URL、Window或Variables。 格式为：getURL(“URL“, “Window“,“Variables“); l URL：用户在此处定义getURL动作的URL。URL可以是一个 相对路径，例如index.html。也可以是一个绝对的URL，例 如http:/。动画制作教程l Window（窗口）：用户在此处设置窗口的打开方式。共 有

15、以下四种方式： 1_self：在当前窗口的当前框架中打开网页。 2_blank：在新窗口中打开网页。 3_parent: 在当前框架的父框架中打开网页。 4_top: 在当前窗口的顶层框架中打开网页。 l Variables（变量）：用户在此处定义处理变量的方式 。共有以下三种方式： 1Dont send（不发送）：不发送变量，是打开URL的最 佳方法，也是默认选项。 2send use GET（用GET方式发送）：发送少量变量，并 附在指定的URL后面。 3send use POST（用POST方式发送）: 发送大量变量， 并以独立的形式发送。动画制作教程3确定URL。在getURL后面的括

16、号“（）”中输入绝对URL 以及其他参数，接着单击自动套用格式按钮，得到如下图 所示的效果。此时单击该按钮，即在新窗口中打开指定的 网页文件。 通常用于建立与浏览者联系，以便及时得到浏览者的 反馈信息，当浏览者单击按钮时，即可为指定的地址发送 电子邮件。具体操所步骤如下： 4.2 利用getURL语句发送电子邮件动画制作教程1重复上述第一、二步。 2确定URL。在getURL后面的括号“（）”中输入mailto ：以及电子邮件地址，不发送变量，接着单击自动套用格 式按钮，得到如下图所示的效果。此时单击该按钮，即在 向指定的地址发送电子邮件。 动画制作教程5 利用Mouse.hide与startDrag语 句制作个性化鼠标指针startDrag语句可以使被定义的对象跟随鼠标运动。在 动作面板中，双击“全局函数”“影片剪辑控制” “startDrag”选项，即可添加该动作。 startDrag