Flash MX动画制作实例教程Word文档格式.docx

Flash MX动画制作实例教程Word文档格式.docx

《Flash MX动画制作实例教程Word文档格式.docx》由会员分享，可在线阅读，更多相关《Flash MX动画制作实例教程Word文档格式.docx（38页珍藏版）》请在冰豆网上搜索。

按钮符号

●Graphic（图形）符号

Graphic符号通常由在电影中使用多次的静态（或不具有动画效果的）图形组成。

例如，用户可以通过在场景中加入一朵鲜花符号的多个实例来创建一束花，这样每朵不具有动画效果的花便是图形符号的很好例子，如图2-3所示。

图2-3 

创建一束花

2.3 

符号的创建与编辑

在FlashMX中，符号可以包含的功能非常广泛，用户在使用Flash创建的一切功能，都可以通过某个或多个符号来实现。

所以在制作FlashMX动画的第一步，就是要创建符号。

至于具体要创建什么类型的符号，则需根据具体的情况而定。

2.3.1 

创建新符号

用户在动画或电影的编辑过程中，创建符号的方法有两种，一种是创建一个空符号，另一种是从舞台中选定某个对象来创建符号，然后在符号编辑模式下为其添加内容。

创建一个空符号的操作步骤如下：

（1）如果用户需要在FlashMX中创建一个空符号，可以在菜单栏中选择Insert→NewSymbol命令，在打开的CreateNewSymbol对话框中选择好符号类型后，单击OK按钮将切换到符号编辑模式，符号名将出现在舞台的左上角。

编辑面板中还包含一个十字准星，代表符号的定位点，如图2-4所示。

图2-4 

FlashMX的符号编辑模式

（2）在创建符号内容时，用户可以使用时间轴和绘图工具来绘制，也可以通过选择File→Import（导入）命令，打开如图2-5所示的Import对话框，并中从选择要导入媒体文件、图片文件或其他符号。

图2-5 

Import对话框

（3）在打开的Import对话框中选择好需要的文件，单击“打开”按钮将文件导入到FlashMX中，如图2-6所示。

图2-6 

导入的文件

要使用选定的元素创建一个符号的操作步骤如下：

（1）在舞台中使用箭头工具选择需要用的元素，选择Insert→ConverttoSymbol命令或按F8功能键，打开ConvettoSymbol对话框，如图2-7所示。

图2-7 

创建选定元素的符号

（2）在ConvettoSymbol对话框的Name文本框中输入符号名称，然后从Behavior选项区域中选择符号类型，并单击OK按钮即可创建符号。

2.3.2 

编辑符号

在编辑符号时，Flash将自动更新电影或动画中所有运用该符号的实例。

我们可以在符号编辑模式下进行编辑，也可以在菜单栏中选择Edit→EditinPlace命令在舞台上直接编辑该符号。

此时舞台上的其他对象将以浅色显示，表示和当前编辑的符号的区别，如图2-8所示。

（a）正常模式

（b）编辑模式

图2-8 

符号的正常模式和编辑模式

要在舞台上直接编辑符号，必须先选中该符号。

在符号上单击右键，在弹出的快捷菜单中选择EditinPlace命令，如图2-9所示；

或者以直接双击Library面板中的符号图标对符号进行编辑。

另外，如果需要将该符号单独提出并在符号编辑状态对其进行编辑，可在该符号上单击右键，并从弹出的快捷菜单中选择Edit命令。

图2-9 

符号编辑快捷菜单

2.3.3 

复制符号

如果要将一个符号复制一个新的符号，使用复制符号功能就可以很方便地完成该操作。

复制符号的操作步骤如下：

（1）选择Window→Library命令或按Ctrl+L组合键，打开Library面板。

（2）选中Library面板所需要复制的符号并单击右键，从弹出的快捷菜单中选择Duplicate命令即可，如图2-10所示。

在FlashMX默认的情况下，已复制的符号会在原文件名后加上Copy字样，如图2-11所示。

如果用户需要识别原符号，可以保留此名称。

否则可以在弹出的SymbolProperties对话框中重新命名该符号。

图2-10 

Library面板快捷菜单 

图2-11 

2.3.4 

创建电影剪辑符号

当在电影剪辑中需要重复使用一个已经创建的动画，或者要将该动画作为一个实例来操作时，最简单的方法就是将该动画转换为电影剪辑符号。

将舞台中的一个动画转换为电影剪辑的操作步骤如下：

（1）选中要转换的动画所有层上的所有帧并单击右键，在弹出的快捷菜单中选择CopyFrames（复制帧）命令，如图2-12所示。

图2-12 

复制动画上所有的帧

（2）选择Insert→NewSymbol命令，打开CreateNewSymbol对话框，在Name文本框中输入该符号的名称，并选择MovieClip单选按钮，单击OK按钮将创建一个新的符号并进入该符号的编辑模式下。

（3）单击时间轴中的第1帧，选择Edit→PasteFrames命令，粘贴所选择的帧。

经过上述步骤的操作，就可以将该动画转换为一个电影剪辑符号。

当创建电影剪辑符号后，还可以减小动画文件体积，用户可将原文件中的该段动画删除，然后从Library面板中拖入一个电影剪辑符号即可。

2.4 

实例的创建与编辑

用户在Flash中创建了一个符号，但是这个符号并不能直接应用到场景中，还需要创建实例。

实例就是把符号拖动到舞台上，它是符号在舞台上的具体体现。

如果符号中有一个按钮，将这个按钮拖动到舞台上，那么，舞台上的这个按钮就不再称作“符号”，而是一个“实例”。

2.4.1 

创建实例

用户根据电影剧情的要求将符号创建完成之后，就可以在Flash动画中创建该符号的实例，也可以在其他符号内创建该实例。

电影剪辑实例的创建和图形实例的创建是不同的。

电影剪辑只需要一个单独的关键帧去播放，而图形实例则必须在每一个用户希望出现的帧都要放置。

创建符号实例的操作步骤是首先在时间轴上选取一个图层，然后选择Window→Library命令，打开Library面板，选择所要使用的符号，将其拖拽到舞台中，如图2-13所示。

图2-13 

符号拖拽到舞台

实例创建完成后，可以打开实例属性对话框来指定颜色效果、指定Actions、设置图形显示模式以及改变实例的类型。

实例的类型同符号的类型是一致的，除非用户为实例指定了另外的类型。

除此以外，这些修改只影响到实例，不会影响到符号。

2.4.2 

改变实例样式

一个符号的每个实例都可以有自己的颜色效果。

当改变某一帧的实例颜色和透明度时，Flash会在显示该帧时做出变化。

如果想得到颜色的渐变效果，就必须对颜色进行运动变化处理。

当对颜色进行运动变化时，需要在实例的开始帧和结束帧输入不同的效果，然后设定运动，实例的颜色将会随时间发生变化。

改变实例样式的操作步骤如下：

（1）在舞台中选择要编辑的实例，在Properties面板中，单击Color下拉列表框后面的三角按钮，打开Color下拉列表，如图2-14所示。

图2-14 

Color下拉列表

（2）在Color下拉列表中选择Brightness选项，并拖动右侧的滑动条，可以改变当前选中实例的亮度，例如：

把它的值设为–60%，则实例的效果如图2-15所示。

Birghtness值为100％时，实例亮度为最大，0％为正常，–100％为最黑。

图2-15 

改变实例亮度

（3）在Color下拉列表中选择Tint选项，可以在打开的面板中选择一种颜色，也可以从RGB列表框中输入数值来调整颜色，即可改变该实例的颜色偏差，如图2-16所示。

（4）在Color下拉列表中选择Alpha选项。

在列表框右侧的文本框中输入所需的Alpha数值或者拖动滑动条，即可改变该实例的透明度。

其中当Alpha值为100％时，实例为完全不透明，当Alpha值为0％时，该实例完全不可见。

把它设置为40％时的效果如图2-17所示。

图2-16 

改变实例色彩偏差

图2-17 

改变实例透明度

（5）在Color下拉列表中选择Advanced选项，则在列表框的右侧出现一个Settings按钮，如图2-18所示。

图2-18 

选择Advanced命令

（6）单击按钮

，将打开AdvancedEffect对话框，在该对话框中，可以更改实例的RGB颜色值和Alpha值，如图2-19所示。

图2-19 

在高级模式中改变实例

2.4.3 

改变实例属性

在制作动画的过程中，用户可以根据实例的需要，改变实例的类型，用来重新定义它在动画或电影中的表现方式。

下面结合把一个影片剪辑的实例转换为图片的实例来详细说明。

改变实例类型的操作步骤如下：

（1）在舞台中选择需要改变类型的实例，打开Properties面板，如图2-20所示。

图2-20 

实例的Properties面板

（2）单击符号的下拉列表框，并从MovieClip、Button和Graphic三个选择中选择用户将要改变的实例类型。

（3）单击按钮

，将打开SwapSymbol对话框，如图2-21所示。

双击符号列表框中的其他任意符号，即可将当前选中的符号替换。

图2-21 

SwapSymbol对话框

（4）单击SwapSymbol对话框的

按钮，将弹出如图2-22所示的SymbolName对话框。

通过此对话框可以对当前选中的符号进行复制操作。

图2-22 

SymbolName对话框

2.5 

制作按钮

按钮也是一类图符，当用鼠标与按钮交互时，根据不同的状态，它会显示不同的外观。

可以在时间轴窗口中指定按钮在各种状态下的外观。

要使一个按钮在电影中具有交互性，需要从按钮图符创建实例，并为它分配动作。

由于按钮图符的创建方法比较特殊，因此，我们专门用一节来介绍按钮的制作方法。

2.5.1 

按钮工作状态

在Flash中，按钮工作时有4个状态，它们分别是：

●Up（弹起）状态：

鼠标没有接触按钮时，按钮处于一般状态。

●Over（结束）状态：

鼠标移动到按钮上面，但没有按下时，按钮处于被触摸状态。

●Down（按下）状态：

鼠标左键按下时，按钮处于被按下状态（鼠标右键按下时会弹出菜单）。

●Hit（单击）状态：

与前3种状态不同，但这个区域不会显示在电影中。

在这种状态下可以定义响应鼠标事件的区域范围，但这个区域不会显示在电影中。

一个按钮符号在时间轴窗口中的每一帧都有特定的功能，并且每一帧有固定的名称，分别与上面的4种状态相对应，如图2-23所示。

这时Flash自动切换到图符编辑模式，时间轴窗口中的第一行显示4个连续的帧分别表示为Up，Over，Down和Hit，第1帧（Up帧）是一个空白的关键帧。

图2-23 

编辑按钮图符时的时间轴

2.5.2 

创建一个按钮符号

用户可以根据制作中的不同需要在Flash中创建按钮符号，操作步骤如下：

（1）进入Flash操作界面，选择File→New命令，新建一个文件。

（2）选择Insert→NewSymbol命令，在CreateNewSymbol对话框的Name文本框中输入名称，并选择Button单选按钮，如图2-24所示。

图2-24 

SymbolProperties对话框

（3）单击OK按钮，关闭该对话框并进入该按钮的编辑状态。

在时间轴窗口中单击第1帧，使用绘图工具、导入图形或创建其他图符的实例来制作好Up帧的按钮外观，如图2-25所示。

图2-25 

第1帧上的图形

注意：

在按钮中，可以使用电影剪辑图符或图形图符，但是不能在一个按钮中再使用按钮。

如果要制作动画按钮，需要使用电影剪辑。

（4）单击第2帧（Over帧），并在菜单栏中并选择Insert→Keyframe命令，插入一个关键帧。

此时，第1帧的按钮图像仍出现在场景中，然后使用填充工具将该按钮图案填充为其他颜色，如图2-26所示。

图2-26 

第2帧上的图形

（5）单击第3帧（Down帧），并在菜单栏中并选择Insert→Keyframe命令，插入一个关键帧。

然后使用填充工具，将该按钮图案填充为其他颜色，如图2-27所示。

图2-27 

第3帧上的图形

（6）单击第4帧（Hit帧）后在菜单栏中并选择Insert→Keyframe命令插入一个关键帧。

使用箭头工具将按钮符号选中，然后使用填充工具将该按钮填充为黑色，如图2-28所示。

图2-28 

第4帧上的图形

（7）完成以上步骤后单击舞台左上方的Scene按钮，退出图符编辑模式。

（8）在菜单栏中选择Window→Library命令打开Library面板，然后从符号库中把做好的按钮符号拖到场景中任意位置，便可创建按钮符号的一个实例，如图2-29所示。

图2-29 

调入符号库中按钮

（9）完成创建按钮的一个实例后，选择Control→TestMovie命令，这时就可以对按钮进行测试了，如图2-30所示。

图2-30 

测试按钮

2.6 

综合实例

上一节中我们在这4帧中分别放入不同类型的静止图形符号，这样生成的按钮就成为静态按钮效果。

相反，如果在其中某些关键帧中放入的是动态电影片断，当特定鼠标事件产生时，就会表现为动态的效果。

这个道理是很容易理解，下面通过一个综合实例来给大家介绍。

该动画的播放效果是当鼠标停留在按钮上时，会出现一排连续向右侧闪动的三角形动画，用鼠标单击该按钮时将会出现一个连续奔跑的小人。

具体操作步骤如下：

（2）选择Insert→NewSymbol命令，在CreateNewSymbol对话框的Name文本框中输入“三角形按钮1”，并选择Graphic作为符号类型，单击OK按钮。

如图2-31所示。

图2-31 

新建一个Graphic符号

（3）进入符号编辑模式后，在绘图工具栏中选择矩形工具绘制出一个正方形图案，并且使用调色板工具将正方形图案填充为红色，如图2-32所示。

图2-32 

制作一个正方形图案

（4）使用箭头工具把正方形图案移动到如图2-33所示位置，让十字中心点位于正方形图案右边的中心。

当箭头移到正方形图案右上角时，形状变成如图2-34所示。

图2-33 

调整图案1 

图2-34 

调整图案2

（5）分别把正方形的右上角和右下角拉到右边的中心点位置，如图2-35所示。

这样，用作按钮Up帧的三角形图案就做好了，如图2-36所示。

做这个三角形的方法很多，大家也可以使用钢笔或直线工具试一下。

图2-35 

调整图案3 

图2-36 

制作完成

（6）单击

按钮返回到场景中，选择Insert→NewSymbol命令，在CreateNewSymbol对话框的Name文本框中输入“三角形按钮2”，并选择MovieClip作为符号类型，单击OK按钮。

如图2-37所示。

图2-37 

新建一个MovieClip符号

（7）返回到场景中单击时间轴第1帧，在菜单栏中选择Window→Library命令，在弹出的Library面板中将“三角形按钮1”符号拖放到舞台中央，如图2-38所示。

图2-38 

拖动符号到舞台中央

（8）单击时间轴第2帧并在菜单栏中选择Insert→Keyframe命令，插入一个关键帧。

然后将Library面板中的“三角形按钮1”符号再次拖放到舞台中，放在第一个三角形的右边，这样就有两个并排放置的三角形，如图2-39所示。

图2-39 

插入第2帧图像

（9）在时间轴第2帧处使用箭头工具选中右边的三角形，单击Properties面板中的Color下拉列表框，选择下拉列表中的Alpha命令，将Alpha值设为80%，如图2-40所示，使得右边三角形稍透明一些。

图2-40 

设定Alpha值

（10）同样，在第3帧插入一个关键帧，与上帧的操作一样，再拖一个三角形并排放在右边，然后将最右边的三角形Alpha值设为60%。

第4帧也是如此，只不过最右边的三角形的Alpha值设为40%，完成后的效果如图2-41所示。

图2-41 

完成MovieClip符号制作

（11）单击

按钮返回到场景中，选择Insert→NewSymbol命令，在CreateNewSymbol对话框的Name文本框中输入“三角形按钮3”，并选择Button作为符号类型，单击OK按钮。

如图2-42所示。

图2-42 

新建一个Button符号

（12）返回到舞台后，在Library面板中将“三角形按钮2”符号拖放到舞台中央，该符号就被放置在UP帧上，如图2-43所示。

这样，一个具有动画效果的按钮就制作好了。

当用户将鼠标放在该按钮上时，就会看见一排连续向右侧闪动的三角形动画。

图2-43 

创建UP帧图像

（13）单击

按钮返回到场景中，选择Insert→NewSymbol命令，在CreateNewSymbol对话框的Name文本框中输入“运动的小人”，并选择MovieClip作为符号类型，单击OK按钮。

如图2-44所示。

图2-44 

创建“运动的小人”符号

（14）返回到舞台后，选择绘图工具栏中的椭圆工具、贝塞尔工具以及自由变换工具等进行配合，制作出一个小人的动画图案，具体方法如下：

●首先使用绘图工具栏的椭圆工具在舞台中绘制一个小人的头像，如图2-45所示。

图2-45 

绘制小人的头像

●选择绘图工具栏的直线工具，在Properties面板中将直线类型设置为Solid，并把直线的宽度设置为10，如图2-46所示。

图2-46 

设置直线工具的属性

●返回到舞台中，选择直线工具绘制小人的身体以及四肢，如图2-47所示。

●完成小人的身体以及四肢绘制后，选择绘图工具栏的自由变换工具调整小人头像的大小及位置，如图2-48所示。

图2-47 

绘制小人的身体以及四肢 

图2-48 

使用自由变换工具调整

●这样做出的小人不够逼真，用户可以选择绘图工具栏的贝塞尔工具对小人进行细化处理，如图2-49所示。

注释：

调整小人身体的关节运动是重要的一步，小人关节运动的好坏直接影响到奔跑动画的效果。

用户在细化处理时可以选择贝塞尔工具单击小人的某个关节，再使用上、下、左、右键对其进行微处理。

需要注意的是：

在这里必须用鼠标单击某个节点，使其变为实心色才可以进行编辑，如图2-50所示。

图2-49 

细化处理小人图案 

图2-50 

对关节进行微处理

（15）第一个模板小人制作成功后，用户就可以对其进行编辑。

首先在时间轴1～4帧上分别绘制4个不同的小人形象，如图2-51所示。

这是小人奔跑的最基本动作，如果用户对小人奔跑的效果不满意，可以在其中加入某些动作细化的关键帧。

图2-51 

奔跑的基本动作

（16）以上两组动画制作好之后，就可以将它们合并到场景中了。

首先将三角形按钮符号从Library面板中拖入到场景，然后右击时间轴第1帧，在弹出的快捷菜单中选择Actions命令。

在打开的Actions-Frame面板中选择Actions→MovieControl→Stop命令，如图2-52所示。

图2-52 

设置三角形时间轴Stop命令

（17）返回到舞台中鼠标右键单击三角形按钮，在弹出的快捷菜单中选择Actions命令。

在打开的Actions-Frame面板中双击选择Actions→MovieControl→goto命令，另外在面板中将Frame文本框内的数值改为2即可，如图2-53所示。

（18）单击时间轴第2帧，在菜单栏中选择Insert→Keyframe命令，插入一个关键帧。

然后将Library面板中的“运动的小人”符号拖放到舞台中。

（19）右击时间轴第2帧，在弹出的快捷菜单中选择CopyFrames命令，如图2-54所示。

图2-53 

设置舞台三角形goto命令

图2-54 

选择CopyFrames命令

（20）右击时间轴第3帧，在弹出的快捷菜单中选择PasteFrames命令，将第2帧的动画复制到第3帧中。

然后右击时间轴第3帧，在弹出的快捷菜单中选择Actions命令。

在打开的Actions-Frame面板中选