第4讲 基本动画制作(二)Flash高级商务动画设计(PPT全)(袁野版)

FLASH商务应用

四、音频、影片剪辑、补间动画上节课回顾掌握逐帧动画制作方法和技巧。掌握传统补间动画和形状补间动画的方法和技巧。一、【目的】学会不同元件在不同图层设计传统补间动画。掌握为动画添加音频的技巧和方法，掌握声音参数设置的各个含义。掌握影片剪辑（MovieClip）的创作方法以及在动画创作中的意义二、【重点】

【重点】1．动画中音频的添加方法及参数的设置。2．影片剪辑的含义及创建方法。3．彩蝶习舞动画制作4.补间动画【难点】影片剪辑动画与场景中动画在时间轴上的协调。

实例4.1—拍皮球-音频的添加【实例说明】【实例说明】本例制作拍皮球的动画，同时添加声音效果。【技术要点】使用补间动画创建小球落下与弹起的动画效果；使用压缩变形创建小球落地时的碰撞效果；导入声音文件为小球落地添加音效。课堂示例1:关键步骤启动FlashCS4，菜单上，文件

另存为，在“另存为”的对话框上，先选择保存文件的文件夹的位置，在文件名后输入：拍皮球.fla，点击“保存”按钮。菜单上，插入

新建元件，打开“创建元新件”对话框，在名称后输入“皮球”，行为后选择“图形”，单击“确定”按钮，打开“皮球”元件编辑窗口。用工具箱中的绘图工具，按图1所示绘制皮球。菜单上，文件

导入库,打开“导入到库”对话框。在该对话框中选择准备好的皮球落地的声音文件pa.wav，然后按“打开”按钮，将其导入到库面板中，如图2所示课堂示例1:关键步骤在库面板中双击声音对象的图标，打开“声音属性”对话框，如图1所示。在该对话框中可以查看声音文件的属性，从属性中可以了解到声音长度为1.1秒。单击“确定”按钮关闭该对话框。从库面板中将“皮球”元件拖动到舞台上，调整其位置和大小课堂示例1:关键步骤用鼠标右键单击第6帧

插入关键帧，用鼠标右键中间的任意1帧

创建传统补间动画单击“图层1”的第6帧的皮球，按SHIFT键，在舞台上将皮球向下移动。右键单击第8帧

插入关键帧，在舞台上调整皮球位置与第6帧中的相同，选择工具箱中的任意变形工具，然后单击第8帧舞台上的皮球，调整句柄将皮球稍微压扁。用鼠标右键单击第12帧

插入关键帧，用鼠标右键中间的任意1帧

创建传统补间动画。此时，时间轴窗口如图1所示课堂示例1:关键步骤单击第12帧，将该帧对应舞台上的皮球稍微向下移动，使得皮球反弹高度小于初始高度在“图层1”之上新建“图层2”，将“图层2”更名为“音效”，如图1所示。用鼠标右键单击“音效”图层第6帧

插入空白关键帧，如图2所示单击“音效”图层第6帧，从库面板中将声音文件pa.wav拖动到舞台上。在“音效”层从第6帧开始有声音的波形线，主要声音在第6帧到第10帧，而实际上，应该到第12帧，因为该音效的长度是1.1秒，即有声音的帧应该是7秒（因为本文档的帧频是6fps）。按【Ctrl+Enter】键播放文档，在皮球落地时可以听到“啪”的一声响。菜单上，文件

保存。

六、实例3—【创作步骤】创建“蝴蝶”振翅的影片剪辑元件在舞台上创建影片剪辑动作动画“影片剪辑”步骤菜单上，插入

新建元件，打开“创建新元件”对话框。在名称后输入影片剪辑名称，行为选择“影片剪辑”，按“确定”按钮，打开影片剪辑编辑窗口,做动画。实例4.2—蝴蝶飞舞实例4.2—【实例说明】一只蝴蝶在花丛中自由飞翔。【技术要点】本例主要利用影片剪辑元件来创建蝴蝶挥动翅膀的动画效果，然后在主场景中使用影片剪辑创建移动动画效果。课堂示例2:关键步骤双击彩蝶飞舞.fla，库中有彩蝶1，彩蝶2两个元件。创建“影片剪辑”：菜单上，插入

新建元件，打开“创建新元件”对话框。在名称后输入“蝴蝶飞舞剪辑”，行为后选择“影片剪辑”，按“确定”按钮，打开影片剪辑编辑窗口,这个窗口与以前的元件编辑窗口是一样的。菜单上，窗口

库，打开库面板。鼠标点击第1帧，然后，将库中元件“蝴蝶1”拖动到舞台上；鼠标右键单击第3帧

插入空白关键帧，再将库中元件“蝴蝶2”拖动到舞台上，调整元件“蝴蝶-2”的位置（窗口/对齐/相对于舞台/水平中齐，垂直中齐），使其身体（不是翅膀）与第一帧中元件“蝴蝶-1”的身体位置相同。“蝴蝶飞舞剪辑”制作完成。单击时间轴窗口左下方的“场景1”按钮切换到场景编辑窗口。菜单上，修改

文档，打开“文档属性”对话框，设置文档尺寸为500×300,背景颜色为白色，帧频为12fps，单击“确定”按钮。将“图层1”改名为“蝴蝶”鼠标单击第1帧，将库中的元件“蝴蝶飞舞剪辑”拖动到舞台上，点击舞台左下方的“属性”按钮，打开“属性”面板，设置对象的大小和位置为：宽39.2,高38.1；X:512.2,Y:0.8。课堂示例2:关键步骤鼠标右键单击第30帧

插入关键帧，将舞台上的“蝴蝶飞舞剪辑”拖动到舞台左侧外边。鼠标右键单击第31帧

插入关键帧，菜单上，修改

变形

水平翻转。鼠标右键单击第60帧

插入关键帧，将舞台上的“蝴蝶飞舞剪辑”拖动到舞台右下角外。鼠标右键单击第61帧

插入关键帧，菜单上，修改

变形

水平翻转右键单击第90帧

插入关键帧，将舞台上的“蝴蝶飞舞剪辑”拖动到舞台内部(X:84.3,Y:39.7，注意：此处有一朵花，蝴蝶正是停在此花上)，如图4-21所示。鼠标右键单击第120帧

插入帧鼠标右键分别在第5、35、65帧上单击

创建传统补间动画。菜单上，文件

导入到库，打开“导入到库”对话框，在此对话框中找到

“蝴蝶飞舞背景.jpg”文件，点击“打开”按钮，此文件进行库中。在“蝴蝶”图层上插入一个新的图层，改名为“背景”，将“背景”图层拖动到“蝴蝶”图层之下。课堂示例2:关键步骤点击“背景”图层第1帧，将库中元件“蝴蝶飞舞背景”拖动到舞台上，对齐面板，匹配宽高，单击“背景”图层第120帧

插入帧，时间轴如图按【Ctrl+Enter】键播放文档。菜单上，文件

保存。

实例4-3镜像跳动的字母镜像跳动的字母【实例说明】字母“Flash”上下跳动的同时，它的镜像字母也随之跳动。【技术要点】主要使用对象的Alpha颜色属性设置和翻转操作创建倒影效果，然后利用影片剪辑元件来创建跳动动画效果。课堂示例3:关键步骤启动Flash，菜单上，文件

另存为，在“另存为”的对话框上，先选择保存文件的文件夹的位置，在文件名后输入：镜像跳动的字母.fla，点击“保存”按钮。菜单上，修改

文档，打开“文档属性”对话框，设置文档尺寸为300px×400px，背景颜色为蓝色（#3399FF），帧频为12fps，点击“确定”按钮。菜单上，插入

新建元件，打开“创建新元件”对话框，在名称后输入：F，行为选择“影片剪辑”，单击“确定”按钮，打开元件“F”影片剪辑编辑窗口。鼠标选择工具箱中“文本工具”，点击“属性”按钮，打开“属性”面板，设置字体为ArialBlack，字体颜色为白色，大小为70，粗体显示，选静态文字，在舞台上添加文字“F”

。选择工具箱中的箭头工具，单击选中舞台上的字母F，点击舞台左下方的“属性”按钮，在打开的“属性”面板上，设置字母F的坐标为X:0，Y:0。菜单上，修改

转换为元件，打开“转换为元件”对话框，在名称后输入：字母F，在行为后选择“图形”。单击“确定”按钮完成转换并返回“F”影片剪辑编辑窗口。课堂示例3:关键步骤鼠标右键单击“图层1”的第10帧

插入关键帧，鼠标右键单击第20帧

插入关键帧；然后鼠标右键在第1帧上单击

创建传统补间动画；鼠标右键在第10帧上单击

创建传统补间动画。在第10帧上，鼠标单击舞台左下方“属性”按钮，打开“属性”面板，单击舞台上的字母F，在属性面板上，将字母F的Y坐标由0更改为-100（将字母F向上移动100个象素。单击舞台左上方的“场景1”按钮，切换到场景编辑窗口。选择工具箱中的矩形工具，设置描绘颜色为无，填充颜色为深蓝色（#3100CE），在舞台下方绘制一个矩形，如图1所示。库面板中拖动两次F影片剪辑元件到舞台上，创建F影片剪辑的两个实例，用鼠标选中其中一个，菜单上，修改

变形

垂直翻转。点击舞台左下方的“属性”按钮，打开“属性”面板，在“颜色”后面的列表框中选择“Alpha”，再将它的值设置为45%，调整舞台上两个字母F元件对象的位置，如图2所示。

实例4-4-1下大雨下大雨

【实例说明】雨点纷纷落下。【技术要点】首先做一个雨点的影片剪辑，然后再用另一个影片剪辑做很多雨点的落下效果。加黑色的图层做背景。课堂示例4-1:关键步骤启动Flash，菜单上，文件

另存为，在“另存为”的对话框上，先选择保存文件的文件夹的位置，在文件名后输入：下大雨.fla，点击“保存”按钮。菜单上，修改

文档，打开“文档属性”对话框，设置文档尺寸为550px×400px，背景颜色为蓝色（#3399FF），帧频为12fps，点击“确定”按钮。菜单上，插入

新建元件，打开“创建新元件”对话框，在名称后输入：一个雨点，行为选择“影片剪辑”，单击“确定”按钮，打开元件“一个雨点”影片剪辑编辑窗口。鼠标选择工具箱中“椭圆工具”，笔触颜色为无填充，填充颜色为白色，在舞台上第一帧画白色椭圆。任意变形工具，使之稍微倾斜如图。右键转换为元件，打开“转换为元件”对话框，在名称后输入：雨滴，在行为后选择“图形”，单击“确定”按钮完成转换。课堂示例4-1:关键步骤鼠标右键单击“图层1”的第6帧

插入关键帧，按方向移动雨滴到舞台下方。然后鼠标右键中间任意帧上单击

创建传统补间动画。单击舞台左上方的“场景1”按钮，切换到场景编辑窗口。菜单上，插入

新建元件，打开“创建新元件”对话框，在名称后输入：大雨，行为选择“影片剪辑”，单击“确定”按钮，打开元件“大雨”影片剪辑编辑窗口。在图层1的第一帧舞台上，及其舞台上方从库面板中拖动很多的“一个雨点”影片剪辑。增加图层2放在图层1下面，在第一帧，选择工具箱中的矩形工具，设置笔触颜色为无，填充颜色为黑色，在舞台上绘制一个大矩形做背景。单击舞台左上方的“场景1”按钮，切换到场景编辑窗口。从库面板中拖动“大雨”影片剪辑到舞台上。

26补间动画Flashcs4中的全新补间动画方式，能更灵活控制每帧的属性，而且可以看到每个帧上的动画轨迹，这样可创作出更加完美的补间动画。能够创建补间动画的对象包括按钮、文字、图形元件、影片剪辑。传统补间动画是由关键帧组成的，而补间动画则是由属性关键帧组成的，属性关键帧是以小菱形图标表示的。但是补间动画的第一帧例外，还是以关键帧的形式表示，以黑圆点显示。27添加属性关键帧手动添加创建补间动画，选择添加属性关键帧的位置，右击鼠标，在快捷菜单中选择“插入关键帧”子菜单中的命令。子菜单中的命令都代表了对动画对象的一种属性控制，其具体设置可以在“属性”面板中完成。自动添加当鼠标选择所在位置没有属性关键帧的情况下，如果选中舞台中的补间动画对象，并设置其属性（如移动位置、设置Alpha值及色调等），就可以自动在当前位置添加一个属性关键帧。删除选择属性关键帧，右击鼠标，在快捷菜单中选择“清除关键帧”子菜单中的命令。实例4-4-2下大雪下大雪【实例说明】雪花飘飘洒洒落下。【技术要点】首先做一个雪的影片剪辑，然后再用另一个影片剪辑做很多雪花的缓缓落下效果。加黑色的图层做背景。因为动画是曲线，用补间动画来实现。课堂示例4-1:关键步骤启动Flash，菜单上，文件

另存为，在“另存为”的对话框上，先选择保存文件的文件夹的位置，在文件名后输入：下大雪.fla，点击“保存”按钮。菜单上，修改

文档，打开“文档属性”对话框，设置文档尺寸为550px×400px，背景颜色为蓝色（#3399FF），帧频为12fps，点击“确定”按钮。菜单上，插入

新建元件，打开“创建新元件”对话框，在名称后输入：一个雨点，行为选择“影片剪辑”，单击“确定”按钮，打开元件“一个雪”影片剪辑编辑窗口。鼠标选择工具箱中“椭圆工具”，笔触颜色为无填充，填充颜色为最后一行第2个黑白渐变色，按shift画圆，用颜料桶点中心。如图。右键转换为图形元件，单击“确定”按钮完成转换。课堂示例4-1:关键步骤选中第1帧，创建补间动画，分别在第25、50帧插入属性关键帧，选全部，改变雪花的位置，将轨迹用箭头改成弧形。单击舞台左上方的“场景1”按钮，切换到场景编辑窗口。菜单上，插入

新建元件，打开“创建新元件”对话框，在名称后输入：大雪，行为选择“影片剪辑”，单击“确定”按钮，打开元件“大雪”影片剪辑编辑窗口。在图层1的第一帧舞台上，及其舞台上方从库面板中拖动很多的“一个雪”影片剪辑。增加图层2放在图层1下面，在第一帧，选择工具箱中的矩形工具，设置笔触颜色为无，填充颜色为黑色，在舞台上绘制一个大矩形做背景。单击舞台左上方的“场景1”按钮，切换到场景编辑窗口。从库面板中拖动“大雪”影片剪辑到舞台上。

如何将一个舞台上的动画转变成为影片剪辑？在主时间轴上，选择您想使用的舞台上动画的每一层中的每一帧。按Shift+所有帧，选中所有帧，然后，