Flash 二维动画设计

2023年4月19日星期三2023年4月19日星期三陇东学院信息工程学院陇东学院信息工程学院 11

Flash Flash 二维动画设计二维动画设计

教育技术学专业教育技术学专业


第第 88 单元交互式动画单元交互式动画

教学目的和要求教学目的和要求理解交互式动画理解交互式动画

掌握动作面板的组成与使用方法掌握动作面板的组成与使用方法

学会为帧、按钮和影片剪辑添加动作学会为帧、按钮和影片剪辑添加动作

掌握函数的使用方法掌握函数的使用方法



教学重点和难点教学重点和难点为帧、按钮和影片剪辑添加动作为帧、按钮和影片剪辑添加动作

函数的使用方法函数的使用方法



主要内容主要内容认识动作面板和交互式动画认识动作面板和交互式动画

设置按钮动作设置按钮动作

设置帧动作设置帧动作

设置影片剪辑动作设置影片剪辑动作

控制动画控制动画


FlashFlash 是一个功能强大的动画制作软件，用户不是一个功能强大的动画制作软件，用户不

仅可以利用它制作简单的逐帧动画和补间动画，仅可以利用它制作简单的逐帧动画和补间动画，

还可以使用其自带的动作脚本语言，创建复杂的还可以使用其自带的动作脚本语言，创建复杂的

交互式动画。交互式动画。

8.1 8.1 交互动画及动作面板概述交互动画及动作面板概述


FlashFlash 的交互动画是指在作品播放时支持事的交互动画是指在作品播放时支持事

件响应和交互功能的一种动画，也就是说，件响应和交互功能的一种动画，也就是说，

动画播放时能够受到某种控制，而不是像普动画播放时能够受到某种控制，而不是像普

通动画一样从头到尾进行播放。通动画一样从头到尾进行播放。

8.1.1 8.1.1 交互动画的概述交互动画的概述


在在 Flash 8 Flash 8 中，用户可以通过动作面板来创建与编辑中，用户可以通过动作面板来创建与编辑脚本。用户可以在标准模式和专家模式两种不同的编脚本。用户可以在标准模式和专家模式两种不同的编辑模式中创建和编辑对象或帧的动作。辑模式中创建和编辑对象或帧的动作。

用户可以使用以下两种方法打开动作面板：用户可以使用以下两种方法打开动作面板：（（ 11 ）在菜单“窗口）在菜单“窗口 -- 动作”命令，即可打开动作面板，如动作”命令，即可打开动作面板，如

图图 8.1.18.1.1 所示。所示。（（ 22 ）用鼠标右键在舞台中的按钮、影片剪辑实例或关键）用鼠标右键在舞台中的按钮、影片剪辑实例或关键

帧上单击，在弹出的快捷菜单中选择“动作”命令，也可帧上单击，在弹出的快捷菜单中选择“动作”命令，也可以打开动作面板。以打开动作面板。

8.1.2 8.1.2 认识“动作”面认识“动作”面版版


8.1.2 8.1.2 认识“动作”面认识“动作”面版版


使用“动作”面板添加动作的步骤如下：使用“动作”面板添加动作的步骤如下：（（ 11 ）单击“动作”工具箱中某个类别，显示该类别中）单击“动作”工具箱中某个类别，显示该类别中

的动作。的动作。（（ 22 ）双击选中的动作，或者将其拖放到脚本窗格中，）双击选中的动作，或者将其拖放到脚本窗格中，

即可在脚本窗格中添加该动作。如图即可在脚本窗格中添加该动作。如图 8.1.28.1.2 所示。所示。

8.1.3 8.1.3 使用动作面板使用动作面板


8.1.3 8.1.3 使用动作面板使用动作面板


在动作面板中，单击右上角的“”按钮，将打开在动作面板中，单击右上角的“”按钮，将打开“动作”面板，如图“动作”面板，如图 8.1.38.1.3 所示。其中有许多菜单选所示。其中有许多菜单选项。项。

8.1.4 8.1.4 使用“动作”面板选项菜单使用“动作”面板选项菜单


（（ 11 ）从“动作”面板的选项菜单中选择“首选）从“动作”面板的选项菜单中选择“首选

参数”命令。或选择“编辑”菜单里的“首选参参数”命令。或选择“编辑”菜单里的“首选参

数”命令，然后单击“数”命令，然后单击“ ActionScript”ActionScript” 选项卡，选项卡，

如图如图 8.1.128.1.12 所示。所示。（（ 22 ）从弹出的“首选参数”对话框里设置任意）从弹出的“首选参数”对话框里设置任意

首选参数。首选参数。

8.1.5 8.1.5 设置“动作”面板的参数设置“动作”面板的参数


8.1.5 8.1.5 设置“动作”面板的参数设置“动作”面板的参数


（（ 11 ）从“动作”面板的右上角的选项菜单中选择）从“动作”面板的右上角的选项菜单中选择

“首选参数”，然后在““首选参数”，然后在“ ActionScript”ActionScript” 选项卡上，选项卡上，

选择“代码提示”。选择“代码提示”。

（（ 22 ）单击脚本窗格上方的“显示代码提示”按钮）单击脚本窗格上方的“显示代码提示”按钮

“”。“”。

（（ 33 ）从“动作”面板的选项菜单中选择“显示代）从“动作”面板的选项菜单中选择“显示代

码提示”。码提示”。

8.1.6 8.1.6 使用代码提示使用代码提示


8.2.1 8.2.1 为关键帧添加动作为关键帧添加动作

（（ 11 ）新建一个文件。）新建一个文件。

（（ 22 ）在层“图层）在层“图层 1”1” 的第的第 1010 帧和第帧和第 2020 帧处插帧处插

入关键帧，并在舞台上添加一些内容。入关键帧，并在舞台上添加一些内容。

（（ 33 ）将添加了动作的帧放在一个独立的层上是）将添加了动作的帧放在一个独立的层上是

一种很好的习惯。在层“图层一种很好的习惯。在层“图层 1”1”之上添加一个之上添加一个

层动作专门放置带有程序的帧。层动作专门放置带有程序的帧。


（（ 44 ）在层动作的第）在层动作的第 1010 帧和第帧和第 2020 帧处插入关键帧。帧处插入关键帧。

（（ 55 ）选中第）选中第 2020 帧，在菜单中选择“窗口帧，在菜单中选择“窗口 -- 动作”命令将弹动作”命令将弹

出动作面板。出动作面板。

（（ 66 ）将“动作”域展开，在单击“影片剪辑”将其展开。）将“动作”域展开，在单击“影片剪辑”将其展开。

（（ 77 ）双击语句）双击语句 gotogoto向动作编辑框中添加语句向动作编辑框中添加语句 gotoAndPlagotoAndPla

yy（（ 11 ）。）。

（（ 88 ）再将参数面板中）再将参数面板中 FrameFrame文本框的内容设为文本框的内容设为 1010 。。当为帧添加了一条语句后，包含有动作的帧上面会出现一个“当为帧添加了一条语句后，包含有动作的帧上面会出现一个“ a”a”字字

母。母。

8.2.1 8.2.1 为关键帧添加动作为关键帧添加动作


为按钮添加动作的方法与为帧添加动作的方法相同，为按钮添加动作的方法与为帧添加动作的方法相同，

但是，为按钮添加动作时，必须将动作套在但是，为按钮添加动作时，必须将动作套在 onon 处理处理

函数中，并添加触发该动作的鼠标或键盘事件。将函数中，并添加触发该动作的鼠标或键盘事件。将

““ on”on” 处理函数拖放到脚本窗格中后，在弹出的下处理函数拖放到脚本窗格中后，在弹出的下

拉列表里选择一个事件即可，如图拉列表里选择一个事件即可，如图 8.2.18.2.1 所示。所示。

8.2.2 8.2.2 为按钮添加动作为按钮添加动作


下面是用于下面是用于 FlashFlash 按钮的基于鼠标动作的事件处理按钮的基于鼠标动作的事件处理““ on”on” 处理函数具体解释：处理函数具体解释：按下按下 on(Press) on(Press) ：指在鼠标指针经过按钮时按下鼠标。：指在鼠标指针经过按钮时按下鼠标。释放释放 on(Release) on(Release) ：指在鼠标指针经过按钮时释放鼠标：指在鼠标指针经过按钮时释放鼠标

按钮。按钮。外部释放外部释放 onon （（ Release OutsideRelease Outside）：指当鼠标指针在按）：指当鼠标指针在按

钮之内时按下按钮后，将鼠标指针移到按钮之外，此时释钮之内时按下按钮后，将鼠标指针移到按钮之外，此时释放鼠标。放鼠标。

滑过滑过 onon （（ Roll OverRoll Over ）：指鼠标指针滑过按钮。）：指鼠标指针滑过按钮。



外部释放外部释放 onon （（ Release OutsideRelease Outside）：指当鼠标指针）：指当鼠标指针在按钮之内时按下按钮后，将鼠标指针移到按钮之外，在按钮之内时按下按钮后，将鼠标指针移到按钮之外，此时释放鼠标。此时释放鼠标。

滑过滑过 onon （（ Roll OverRoll Over ）：指鼠标指针滑过按钮。）：指鼠标指针滑过按钮。滑离滑离 onon （（ Roll OutRoll Out ）：指鼠标指针移出按钮区域。）：指鼠标指针移出按钮区域。拖过拖过 onon （（ Drag OverDrag Over ）：指在鼠标指针移过按钮时）：指在鼠标指针移过按钮时

按下鼠标，然后移出此按钮，再移回此按钮拖离。按下鼠标，然后移出此按钮，再移回此按钮拖离。拖离拖离 onon （（ Drag OutDrag Out ）：指在鼠标指针滑过按钮时）：指在鼠标指针滑过按钮时

按下鼠标，然后滑出此按钮区域。按下鼠标，然后滑出此按钮区域。按键按键 on(Key Press) on(Key Press) ：指按下指定的：指按下指定的 keykey。。



（（ 11 ）选中按钮，选择“窗口”菜单里“动作”打开）选中按钮，选择“窗口”菜单里“动作”打开它。它。

（（ 22 ）要指定动作，请执行以下操作之一：）要指定动作，请执行以下操作之一：单击“动作”工具箱中的文件夹，双击某个动作将其单击“动作”工具箱中的文件夹，双击某个动作将其

添加到脚本窗格中。添加到脚本窗格中。把动作从“动作”工具箱拖到脚本窗格中。把动作从“动作”工具箱拖到脚本窗格中。单击按钮，然后从弹出的菜单中选择一项动作。单击按钮，然后从弹出的菜单中选择一项动作。（（ 33 ）在面板顶部的参数文本框中，输入动作的参数。）在面板顶部的参数文本框中，输入动作的参数。（（ 44 ）重复步骤）重复步骤 22 和步骤和步骤 33 ，根据需要指定其它动作。，根据需要指定其它动作。



在在 Flash 8Flash 8 中，用户可以使用为帧，按钮添加动中，用户可以使用为帧，按钮添加动

作的方法来为影片剪辑添加动作。此时必须将动作的方法来为影片剪辑添加动作。此时必须将动

作套在作套在 onClipEventonClipEvent 处理函数中，并添加触发动处理函数中，并添加触发动

作的剪辑事件，将作的剪辑事件，将 onClipEventonClipEvent 处理函数拖入脚处理函数拖入脚

本窗格之后，用户可以从弹出的下拉列表里选择本窗格之后，用户可以从弹出的下拉列表里选择

响应事件，如图响应事件，如图 8.2.28.2.2 所示。所示。

8.2.3 8.2.3 为影片剪辑添加动作为影片剪辑添加动作


在影片剪辑的“动作”面板中输入“在影片剪辑的“动作”面板中输入“ OnClipEvent”,OnClipEvent”,在随之出现的代在随之出现的代码提示列表中列出了影片剪辑能够响应的事件。这些事件如下表码提示列表中列出了影片剪辑能够响应的事件。这些事件如下表 8.2.18.2.1所示：所示：


表表 8.2.1 8.2.1 影片剪辑能够响应的事件影片剪辑能够响应的事件


时间轴控制语句是最基本的动作语句时间轴控制语句是最基本的动作语句 ,,用于控制播放用于控制播放头所在的位置。该语句位于“动作”窗口的全局函头所在的位置。该语句位于“动作”窗口的全局函数数 \\时间轴控制目录下。时间轴控制目录下。11．． gotoAndPlaygotoAndPlay：用于将播放头转到场景中指：用于将播放头转到场景中指定的帧定的帧 ,,并从该帧开始播放。并从该帧开始播放。

22．． gotoAndStopgotoAndStop ：用于将播放头转到场景中指：用于将播放头转到场景中指定的位置帧并停止播放。使用方法与定的位置帧并停止播放。使用方法与 gotoAndPlagotoAndPlayy命令基本相同。命令基本相同。

8.3.1 8.3.1 时间轴控制语句时间轴控制语句


33．． nextFrame/prevFramenextFrame/prevFrame：将播放头跳转到下：将播放头跳转到下 //上一帧并上一帧并停止。停止。

44．． nextScene/prevScenenextScene/prevScene：将播放头跳转到下：将播放头跳转到下 //上一个场上一个场景并停止。景并停止。

55．． stopstop ：停止当前正在播放的：停止当前正在播放的 SWFSWF 文件。文件。 66．． playplay：在时间轴中向前移动播放头。：在时间轴中向前移动播放头。 77．． stopAllSoundsstopAllSounds ：在不停止播放头的情况下停止：在不停止播放头的情况下停止 SWFSWF 文文

件中当前正在播放的所有声音。但是对于同步方式不同的声件中当前正在播放的所有声音。但是对于同步方式不同的声音来说，当播放头移动过所在的帧时，可能会恢复播放。音来说，当播放头移动过所在的帧时，可能会恢复播放。

8.3.1 8.3.1 时间轴控制语句时间轴控制语句


11．． fscommandfscommand：该函数用于使：该函数用于使 SWFSWF 文件与文件与 Flash PlayerFlash Player或或 WedWed 浏览器进行通信。还可以将消息传递给浏览器进行通信。还可以将消息传递给 Macromedia Macromedia DirectorDirector 、、 VBVB、、 VC++VC++和其他可承载和其他可承载 ActivexActivex 空件的程序。空件的程序。

22．． getURLgetURL：用于将特定：用于将特定 URLURL 的文档加载到窗口中，或将的文档加载到窗口中，或将变量传递到位于所定义变量传递到位于所定义 URLURL 的另一个应用程序。的另一个应用程序。

33．． loadMovieloadMovie：该函数用于在播放原始：该函数用于在播放原始 SWFSWF 文件的同时将文件的同时将SWFSWF 文件或文件或 JPEGJPEG文件加载到文件加载到 Flash Player Flash Player 中。中。

8.3.2 8.3.2 浏览器浏览器 // 网络语句网络语句


44．． unloadMovieunloadMovie：该函数用于删除用：该函数用于删除用 loadMovieloadMovie函数调函数调

用的用的 SWFSWF 文件。文件。

55．． loadMovieNnmloadMovieNnm：该函数用于在播放原来加载的：该函数用于在播放原来加载的 SWFSWF

文件的同时，将文件的同时，将 SWFSWF 文件或文件或 JPFGJPFG文件加载到文件加载到 Flash PlayerFlash Player

中的某个级别。中的某个级别。

66．． loadVariablesNumloadVariablesNum：该函数用于从外部文件中读取数：该函数用于从外部文件中读取数

据，并设置据，并设置 Flash PlayerFlash Player级别中变量的值。例如文本文件、级别中变量的值。例如文本文件、

CGICGI 脚本、脚本、 ASPASP、、 PHPPHP或或 PerlPerl 脚本生成的文本中读取数据，脚本生成的文本中读取数据，

并设置并设置 Flash PlayerFlash Player级别中变量的值。级别中变量的值。

8.3.2 8.3.2 浏览器浏览器 // 网络语句网络语句


11．． onon ：用于当发生“鼠标事件”或者“按键事件”：用于当发生“鼠标事件”或者“按键事件”时，执行事件后面大括号的语句。时，执行事件后面大括号的语句。

22．． duplicateMovieClipduplicateMovieClip ：用于在动画播放时创建影：用于在动画播放时创建影片剪辑实例。应用该语句示例如下：片剪辑实例。应用该语句示例如下：

33．． getProperty:getProperty:用于返回实例的指定属性值。用于返回实例的指定属性值。 44．． onClipEventonClipEvent ：事件处理函数；触发为特定影片：事件处理函数；触发为特定影片

剪辑实例定义的动作。剪辑实例定义的动作。 55．． removeMovieClipremoveMovieClip ：删除原来使用：删除原来使用 duplicateModuplicateMovieClip() vieClip() 创建的指定影片剪辑。创建的指定影片剪辑。

8.3.3 8.3.3 影片剪辑控制语句影片剪辑控制语句


66．． setPropertysetProperty：用于更改影片剪辑的透明度、：用于更改影片剪辑的透明度、 X/YX/Y 坐坐

标等属性值。标等属性值。

77．． StartDragStartDrag：用于拖动动画的影片剪辑或按钮，移动：用于拖动动画的影片剪辑或按钮，移动

时，影片剪辑或按钮会随着鼠标光标的位置移动。时，影片剪辑或按钮会随着鼠标光标的位置移动。

88．． stopDragstopDrag ：用于释放当前鼠标拖动的对象。：用于释放当前鼠标拖动的对象。

99．． targetPathtargetPath ：用于返回包含指定影片剪辑的目标路径：用于返回包含指定影片剪辑的目标路径

的字符串。的字符串。 1010．． updateAfterEventupdateAfterEvent ：用于在完成指定的：用于在完成指定的

影片剪辑后，更新显示内容。影片剪辑后，更新显示内容。

8.3.3 8.3.3 影片剪辑控制语句影片剪辑控制语句


子程序是任何一组为特定的任务保留的代码，子程序子程序是任何一组为特定的任务保留的代码，子程序

有益于代码在多个事件处理器中的重复使用，有益于代码在多个事件处理器中的重复使用， FlashFlash

动作脚本中，子程序被称为函数。动作脚本中，子程序被称为函数。

函数一般使用在表达式中，所有的函数都必须在函数函数一般使用在表达式中，所有的函数都必须在函数

名之后跟一对小括号。函数可以没有参数，也可以有名之后跟一对小括号。函数可以没有参数，也可以有

一个或多个参数。一个或多个参数。

在在 FlashFlash 中，用户不仅可以调用系统自带的内置函数，中，用户不仅可以调用系统自带的内置函数，

还可以自已定义函数。还可以自已定义函数。

8.4.1 8.4.1 认识函数认识函数


内置函数也称预定义函数，是内置函数也称预定义函数，是 ActionScriptActionScript 在内部集成的在内部集成的

函数，用户可以直接调用这些函数。如果要调用在函数，用户可以直接调用这些函数。如果要调用在 MovieClMovieCl

ipip 中定义的函数，则必须要写明函数的路径。中定义的函数，则必须要写明函数的路径。

在“动作”面板的动作编辑区被直接输入函数时，只要写在“动作”面板的动作编辑区被直接输入函数时，只要写

出正确的函数名称并给予响应的参数即可。此时如果写如出正确的函数名称并给予响应的参数即可。此时如果写如

了正确的函数名，就会有代码提示功能，提示用户该函数了正确的函数名，就会有代码提示功能，提示用户该函数

后面的参数类型。如图后面的参数类型。如图 8.4.18.4.1 所示所示

我们平常所说的动作工具箱中的就是我们平常所说的动作工具箱中的就是 FlashFlash 自带的预定义函自带的预定义函

数。如图数。如图 8.4.28.4.2 所示所示

8.4.2 8.4.2 内置函数的使用内置函数的使用


8.4.2 8.4.2 内置函数的使用内置函数的使用


11．定义和调用函数．定义和调用函数

用户可以在任何位置定义所需的函数，显而易用户可以在任何位置定义所需的函数，显而易

见，自定义函数都必须要先定义后调用。定义见，自定义函数都必须要先定义后调用。定义

函数的格式如下：函数的格式如下：

function function 函数名（参数，函数名（参数，············））

8.4.3 8.4.3 创建自定义函数创建自定义函数


函数的命名规则如下：函数的命名规则如下：函数名必须以英文字母开头，而不能以数字或者其他特殊的符函数名必须以英文字母开头，而不能以数字或者其他特殊的符

号开头。号开头。

定义函数时应根据实际需要混合使用大小写字母和数字。定义函数时应根据实际需要混合使用大小写字母和数字。

不能使用不能使用 ActionScriptActionScript 中的关键字对象或者属性作为函数名，中的关键字对象或者属性作为函数名，

如果名称相同则可能造成冲突。如果名称相同则可能造成冲突。

每个函数名都以两个或者每个函数名都以两个或者 33 个字母的缩写开始。个字母的缩写开始。

函数名不能包含控制或者据点，但是名称中间可用下划线。函数名不能包含控制或者据点，但是名称中间可用下划线。



22．向函数传递值．向函数传递值来看下面的一段代码：来看下面的一段代码：

function myAction(frameNamefunction myAction(frameName，， movieName) {movieName) {

gotoAndplay(frameName);gotoAndplay(frameName);

stopAllSoundsstopAllSounds （）（） ;;

loadMovie(movieNameloadMovie(movieName，， myMovieClip);myMovieClip);

}}



22．向函数传递值．向函数传递值在这段函数中在这段函数中 myActionmyAction 后面的括号内增加了两个后面的括号内增加了两个

参数，相互之间用逗号隔开，代表函数调用时接收参数，相互之间用逗号隔开，代表函数调用时接收实际值的位置，而调用函数的代码如下：实际值的位置，而调用函数的代码如下：

on (release){on (release){myAction ("myFrame"myAction ("myFrame"，， "" 夜曲夜曲 .swf";).swf";)在在 myActionmyAction 后面的括号内输入一个帧的名称，一后面的括号内输入一个帧的名称，一

个外部影片的路径。那么这两个就是向函数传递的个外部影片的路径。那么这两个就是向函数传递的值，这样函数就可以基于这两个值来完成用户指定值，这样函数就可以基于这两个值来完成用户指定的任务。的任务。



变量的作用域是指识别（定义）变量的区域和可变量的作用域是指识别（定义）变量的区域和可

以引用变量的区域。而类似的，函数也有一个作以引用变量的区域。而类似的，函数也有一个作

用域，即在多大的范围内该函数是可以调用的，用域，即在多大的范围内该函数是可以调用的，

一般来说，局部函数（在函数中定义的函数）只一般来说，局部函数（在函数中定义的函数）只

有在定义它的函数体内才能被调用。有在定义它的函数体内才能被调用。

8.4.4 8.4.4 函数的作用域函数的作用域


8.5 8.5 交互式动画应用实例交互式动画应用实例

8.5.1 8.5.1 实例一：鼠标跟随实例一：鼠标跟随 11．创建电影文件。．创建电影文件。

22．创建影片剪辑元件。．创建影片剪辑元件。

33．为．为 99 个影片剪辑实例添加代码。个影片剪辑实例添加代码。

44．保存并测试电影文件。．保存并测试电影文件。


8.5.2 8.5.2 实例二：飞舞的随机数实例二：飞舞的随机数 11．创建电影文件。．创建电影文件。

22．创建影片剪辑元件“．创建影片剪辑元件“ ball”ball” 。。

3 3 ．创建影片剪辑元“．创建影片剪辑元“ move”move” 。。

44．编辑主场景。．编辑主场景。




8.5.3 8.5.3 实例三：可爱的时钟实例三：可爱的时钟 11．创建电影文件。．创建电影文件。

22．创建“背景”图形元件。．创建“背景”图形元件。

33．创建“秒针”、“分针”、“时针”影片剪．创建“秒针”、“分针”、“时针”影片剪

辑元件。辑元件。

44．编辑主场景。．编辑主场景。

55．添加动作语句。．添加动作语句。



Flash 二维动画设计

Documents

Transcript of Flash 二维动画设计