1、计算机基础与实训教材系列,中文版FlashCS3实训教程,第6章,特殊动画制作,学 习 目 标,在创作作品时，我们会把不同的运动物体放到不同的图层上，同一帧上各图层效果的叠加就是最终的制作效果。图层中有两类特殊层：引导层和遮罩层。引导层引导的是动画补间，在制作引导动画时要注意最后关键帧位置的调整，一定要调整到运动路径上。遮罩层经常用来做一些镜头效果和特殊效果，在使用遮罩层的时候要注意被遮罩层的内容是通过遮罩层的填充部分显示出来的。滤镜可以为文本、按钮和影片剪辑增添有趣的视觉效果。注意只能对文本、按钮和影片剪辑对象应用滤镜。 本章主要介绍了引导动画、遮罩动画和滤镜动画的制作过程及技巧。,本 章
2、重 点,引导层和遮罩层概念 引导动画的制作 遮罩动画的制作 滤镜动画的制作,6.1 引导动画,6.1.1 引导层 直接创建的动画补间都是沿直线运动。如果要做曲线运动需要添加引导层。运动引导层使您可以绘制路径，补间实例、组或文本块可以沿着这些路径运动。也可以将多个层链接到一个运动引导层，使多个对象沿同一条路径运动。链接到运动引导层的常规层就成为被引导层。,创建引导层有以下几种方法： 1选择包含动画的图层，然后选择【插入】|【时间轴】|【运动引导层】。 2右键单击包含动画的图层，然后选择“添加引导层”。 3在“时间轴”面板上单击“添加引导层”按钮。 Flash 会在所选图层之上创建一个新图层，该图
3、层名称的左侧有一个运动引导层图标，如图所示，引导层下面的图层自动转化为被引导层。在运动引导层上使用“钢笔”、“铅笔”、“直线”、“圆形”、“矩形”或“刷子”工具绘制所需的路径。,将图层和引导层链接起来有如下几种方法： 1将现有图层拖到运动引导层的下面。 该图层在运动引导层下面以缩进形式显示。 该图层上的所有对象自动与运动路径对齐。 2在运动引导层下面创建一个新图层。 在该图层上补间的对象自动沿着运动路径补间。 3在运动引导层下面选择一个图层。 选择【修改】|【时间轴】|【图层属性】，然后选择“被引导层”，如图6-1所示。,图6-1 图层属性对话框 层,断开图层和引导层链接有如下几种方法： 1拖
4、动运动引导层上面的图层。 2选择【修改】|【时间轴】|【图层属性】，然后选择“一般”作为图层类型。 3选择图层，在右键菜单选择“属性”打开“图层属性”，然后选择“一般”。,6.1.2 创建引导动画,【例6-1】飘动的雪花。本实例制作雪花飘荡的动画，学习引导动画的制作方法和技巧。 操作步骤： (1) 新建一空的Flash文档，并以文件名“雪花飘飘”保存。修改文档背景为蓝黑色。 (2) 新建“雪花”元件，类型为图形。 (3) 在“图层1”第1帧拖入“雪花”元件到舞台上方，在第30帧插入关键帧，将实例移动到舞台下方。在第1帧和第30帧之间创建补间动画，在“属性”面板上设置如图6-2所示。选择“调整到
5、路径”，补间元素的基线就会调整到运动路径。 选择“贴紧”，补间元素的注册点将会与运动路径对齐。,图6-2 “属性”面板设置,(4) 在“图层1”上方新建一个引导层，“图层1”会自动转变为被引导层。在引导层上用“铅笔工具”绘制雪花的运动轨迹如图6-3所示。 (5) 将实例注册中心点与线条在第一帧中的起点和最后一帧中的终点对齐。第一帧一般都会自动对齐，最后一帧的位置要手动调整使注册点位于运动路径上，如图6-4所示。 (6) 选择【控制】|【测试影片】命令测试影片。,图6-3 引导层绘制的图形,图6-4 最后一帧对齐到路径,【例6-2】地球旋转。本实例制作一个旋转的地球，进一步加深对引导动画的学习。
6、实例效果如图6-5所示。,图6-5 实例效果,操作步骤： (1) 新建一空的Flash文档，并以文件名“地球旋转”保存。 (2) 导入素材图片“星空”到舞台“图层1”做背景，为了保持和舞台大小一致，在属性面板中将位图大小改为550*400。在“图层1”的第30帧插入帧。 (3) 导入素材图片“星球”到库中。,(4) 创建新元件“地球”，类型为图形。用椭圆工具画正圆，填充选择星球图片的“位图”，设置如图6-6所示。 填充位图之后的“地球”会有白边效果，如图6-7所示。用“渐变变形工具”将填充区域放大，如图6-8所示，得到合适的显示效果。,图6-6 位图填充制作“地球”元件 层,图6-8 最终的地
7、球效果 层,图6-7 填充位图后带白边 层,(5) 创建“图层2”，在第1帧将“地球”元件拖入舞台，在第30帧插入关键帧。创建由第1帧到第30帧的动画补间。 (6) 在“图层2”上创建引导层，绘制一椭圆形状如图6-9所示。运动路线不能用封闭的曲线，所以在曲线上用“橡皮擦工具”稍檫除一部分，最终路径如图6-10所示。,图6-9 绘制椭圆 层,图6-10 运动路线 层,(7) 在图层2的第30帧，拖动实例调整到运动路径上去。 (8) 选择【控制】|【测试影片】命令测试影片。,【例6-3】环绕的卫星。本实例制作环绕卫星动画，进一步掌握引导动画的制作。实例效果如图6-11所示。,图6-11 多层引导,
8、操作步骤： (1) 新建一空的Flash文档，并以文件名“环绕的卫星”保存。修改文档背景为深蓝色。 (2) 创建新元件“地球”，类型为图形。用椭圆工具画正圆，填充为黑白线性渐变。选中圆，选择【修改】|【形状】|【柔化填充边缘】命令，在打开的对话框中设置如图6-12所示。,图6-12 柔化设置,(3) 导入素材图片“卫星1”和 “卫星2”到库中。 (4) 将“地球”放在“图层1”，在第30帧插入帧。 (5) 将位图“卫星1”放在“图层2”，在“属性”面板按下锁定长宽比，宽度设为75。按“F8”键将其转化为图形类元件“卫星1”。在“图层2”第30帧插入关键帧，创建从第1帧到第30帧的动画补间，在“
9、属性”面板选择“调整到路径”，如图6-13所示。,图6-13 创建补间,(6) 将位图“卫星2”放在“图层3”，在“属性”面板按下锁定长宽比，宽度设为75。按“F8”键将其转化为图形类元件“卫星2”。在“图层3”第30帧插入关键帧，创建从第1帧到第30帧的动画补间，在“属性”面板选择“调整到路径”。 (7) 创建“引导层”，绘制运动轨迹为绕地球的椭圆，并用“橡皮擦工具”擦开一小的缺口。 (8) “图层3”自动被引导，调整第1帧和第30帧到合适位置。 (9) 将“图层2”属性改为被引导，调整第1帧和第30帧到合适的位置。 (10) 选择【控制】|【测试影片】命令测试影片。,6.2 遮罩动画,6.
10、2.1 遮罩层 遮罩的原理：被遮罩层的内容通过遮罩层的填充部分显示出来。 若要创建遮罩，请将图层指定为遮罩层，然后在该图层上绘制或放置一个填充形状。 可以将任何填充形状用作遮罩，包括组、文本和元件。 透过遮罩层可查看该填充形状下的链接层区域。在遮罩层上放置填充形状、文字或元件的实例。 Flash 会忽略遮罩层中的位图、渐变、透明度、颜色和线条样式。 在遮罩中的任何填充区域都是完全透明的；而任何非填充区域都是不透明的。,【例6-4】遮罩原理。本实例帮助了解遮罩的原理。实例效果如图6-14所示。,图6-14 遮罩效果,操作步骤： (1) 新建一空的Flash文档，并以文件名“遮罩原理”保存。 (2
11、) 选择【文件】|【导入】|【导入到舞台】命令，将图片“小姑娘”导入“图层1”。 (3) 添加“图层2”在上面绘制圆形如图6-15所示。,图6-15 遮罩前的情况,(4) 选中“图层2”在右键菜单中选择“遮罩层”命令，如图6-16所示。 (5) 选择【控制】|【测试影片】命令测试影片。,图6-16 设为遮罩层,创建引导层有以下几种方法： 选择或创建一个图层，选择【插入】|【时间轴】|【图层】，以在其上创建一个新图层。遮罩层总是遮住其下方紧贴着它的图层；因此请在正确的位置创建遮罩层。,1右键单击时间轴中的遮罩层名称，然后选择“遮罩”。 将出现一个遮罩层图标，表示该层为遮罩层。 紧贴它下面的图层将
12、链接到遮罩层，其内容会透过遮罩上的填充区域显示出来。 被遮罩的图层的名称将以缩进形式显示，其图标将更改为一个被遮罩的图层的图标。 2选择【修改】|【时间轴】|【图层属性】，然后选择“遮罩”作为图层类型。如图6-17所示。,图6-17 修改图层属性为遮罩层,将图层作为被遮罩层的方法有： 1将现有的图层直接拖到遮罩层下面。 2在遮罩层下面的任何地方创建一个新图层。 3选择【修改】|【时间轴】|【图层属性】，然后选择“被遮罩”。,选择要断开链接的图层，然后执行下列操作之一： 1将图层拖到遮罩层的上面。 2【修改】|【时间轴】|【图层属性】，然后选择“一般”。,6.2.2 创建遮罩动画,【例6-5】探
13、照灯效果。本实例利用遮罩原理制作探照灯遮罩动画。实例效果如图6-18所示。,图6-18 探照灯效果,操作步骤： (1) 新建一空的Flash文档，并以文件名“探照灯效果”保存。设置文档属性，舞台大小为600*300，背景色为黑色。 (2) 在“图层1”用“文本工具”输入文字“探照灯效果”，字体为“隶书”，字号为80。在第30帧插入帧。 (3) 创建一新元件“ball”，用“椭圆工具”绘制正圆，大小要求圆的直径比文字高一些。,(4) 创建“图层2”，将“ball”拖入舞台，放在文字的左边。在第30帧插入关键帧，将实例移动位置放在文字的右边。在第1帧到第30帧之间创建动画补间。如图6-19所示。
14、(5) 将“图层2”设为遮罩层。如图6-20所示。 (6) 选择【控制】|【测试影片】命令测试影片。,图6-19 遮罩之前,图6-20 遮罩后时间轴,【例6-6】 打字效果。本实例制作打字动画，进一步学习遮罩动画的制作。实例效果如图6-21所示。,图6-21 打字效果,操作步骤： (1) 新建一空的Flash文档，并以文件名“打字效果”保存。设置文档属性，舞台大小为600*200，背景色为黑色。 (2) 在“图层1”用“文本工具”输入文字“打字效果打字效果”，字体为“隶书”，字号为35。在第30帧插入帧。 (3) 创建“图层2”，在第1帧绘制较小矩形放在文字的左边，如图6-22所示。在第30帧
15、插入关键帧，用“任意变形工具”将小矩形放大使其覆盖所有文字，如图6-23所示。在第1帧到第30帧之间创建形状补间，时间轴如图6-24所示。,图6-22 图层2第1帧,图6-23 图层2第30帧,图6-24 遮罩后时间轴,【例6-7】字幕效果。本实例制作字幕显示动画效果。实例效果如图6-25所示。,图6-25 字幕效果,操作步骤： (1) 新建一空的Flash文档，并以文件名“字幕效果”保存。 (2) 选择【文件】|【导入】|【导入到舞台】命令，将图片“字幕”导入“图层1”。在“图层1”的第30帧插入关键帧。 (3) 新建“字幕内容”元件，类型为图形。输入相关内容。,(4) 新建“图层2”，将“
16、字幕内容”元件放到舞台上偏下方的位置，如图6-26所示。在第30帧插入关键帧，将实例向上移动到合适位置，如图6-27所示。在第1帧到第30帧之间创建动画补间，做一个文字从下向上运动的效果。,图6-26 字幕开始位置,图6-27 字幕结束位置,(5) 新建“图层3”，在上面绘制一矩形，位置如图6-28所示。在图层3第30帧插入帧。 (6) 将“图层3”做为遮罩层，时间轴如图6-29所示。 (7) 选择【控制】|【测试影片】命令测试影片。,图6-28 遮罩后时间轴,图6-29 遮罩后时间轴,【例6-8】镜头效果。本实例制作镜头遮罩动画效果。实例效果如图6-30所示。,图6-30 镜头效果,操作步骤
17、： (1) 新建一空的Flash文档，并以文件名“镜头效果”保存。 (2) 选择【文件】|【导入】|【导入到舞台】命令，将图片“镜头”导入“图层1”，按“F8”键将其转化为图形类元件。在“图层1”的第1帧将实例移至舞台右侧；第20帧插入关键帧，将实例移至舞台左侧；在第35帧插入关键帧，将实例用任意变形工具放大；第45帧插入帧。在第1帧和第20帧之间创建动画补间制作图片从右向左移动的效果。在第1帧和第20帧之间创建动画补间制作图片从右向左移动效果，相当于镜头的平移。在第20帧和第35帧之间创建动画补间制作图片从小变大的效果，相当于镜头推近。,(3) 新建“图层2”，在上面绘制一矩形。如图6-31
18、所示。 (4) 将“图层2”做为遮罩层，时间轴如图6-32所示。 (5) 选择【控制】|【测试影片】命令测试影片。,图6-31 遮罩层绘制矩形,图6-32 遮罩后时间轴,【例6-9】闪闪红星。本实例制作光芒四射的闪闪红星效果。实例效果如图6-33所示。,图6-33 闪闪红星效果,操作步骤： (1) 新建一空的Flash文档，并以文件名“闪闪红星”保存。 (2) 在舞台上绘制一矩形，要求窄一些长一些。按“F8”键转换成元件，类型为影片剪辑。双击该矩形进入“元件1”的编辑状态，用任意变形工具调整旋转中心点到矩形外面右下角的位置，如图6-34所示。,图6-34 细长矩形条,(3) 选择【窗口】|【变
19、形】命令打开变形面板，在旋转角度中输入15，多次单击“复制并应用变形”按钮，使矩形旋转一周，如图6-35所示。 (4) 新建影片剪辑类元件“元件2”，在“元件2”的编辑状态，将“元件1”拖入，执行【修改】|【变形】|【水平翻转】。在第20帧插入关键帧。在第1帧和第20帧之间创建动画补间，在属性面板上选择顺时针旋转一周，如图6-36所示。,图6-35 元件1的效果,图6-36 动画补间的设置,(5) 回到主时间轴，添加新图层“图层2”，在第1帧将“元件2”放入，使其入“图层1”上的“元件1”中心对齐，如图6-37所示。将“图层2”设为“遮罩层”。 (6) 添加新图层“图层3”，在上面绘制五角星。
20、最后作品的时间轴如图6-38所示。 (7) 选择【控制】|【测试影片】命令测试影片。,图6-37 元件2和元件1对齐,图6-38 遮罩后时间轴,【例6-10】 放大镜效果。本实例利用遮罩制作放大镜效果。实例效果如图6-39所示。,图6-39 放大镜效果,操作步骤： (1) 新建一空的Flash文档，并以文件名“放大镜效果”保存，修改文档属性为550*300。 (2) 重命名图层1为“小字层”，在其上用文本工具制作黑色文本“放大镜效果”，隶书，45号字。在第40帧插入帧。,(3) 在“小字层”上新建图层2，重命名为“大字层”。 用文本工具制作灰色文本“放大镜效果”，隶书，56号字。按“F8”键将
21、其转化为元件“文本”。在“大字层”的第1帧，将文本与“小字层”文本的左边沿对齐；在第40帧，将文本与“小字层”文本的右边沿对齐。在第1帧和第40帧之间创建动画补间。,(4) 在“大字层”上新建图层3，重命名为“大字遮罩”。用椭圆工具绘制一正圆，圆带黑色边框，大小和位置如图6-40所示，复制圆形以备后用。按“F8”键将其转化为元件“圆”。在图层的第40帧插入关键帧，将“圆”实例移动到文本的右边。创建从第1帧到第40帧的动画补间，制作出圆从左向右在文本上移动的效果。,图6-40 圆的大小和位置,(5) 在“小字层”上新建图层4，重命名为“小字遮罩”。在上面绘制矩形，颜色要与前面的圆区分，矩形要足够
22、长，保证当它从左向右运动时都能完全覆盖“小字层”文本，如图6-41所示。按“F8”键将其转化为元件“方”，双击进入“方”元件的编辑状态，粘贴圆使其在矩形的中间位置，然后先中圆及边框删除，制作出在矩形上挖圆洞的效果，如图6-42所示。,图6-41 矩形,图6-42 矩形挖洞,(6) 回到主时间轴上，在“小字遮罩”层上第40帧插入关键帧，分别调整第1帧和第40帧矩形的位置，使其中间的洞刚好和“大字遮罩”上的圆重合。在第1帧和第40帧之间创建动画补间。 (7) 分别将“小字遮罩” 和“小字遮罩”两层做为遮罩层遮罩“小字层”和“大字层”。时间轴如图4-43所示。,图6-43 遮罩后时间轴,(8) 创建
23、“放大镜”元件，在元件的编辑状态，粘贴圆，将填充部分去掉留下边框，将边框宽度增加到5做为放大镜的镜框。用矩形工具制作手柄，填充分为黑白黑线性渐变，再用选择工具调整中间弧度，用“任意变形工具”将手柄旋转一个合适的角度如图6-44所示。,图6-44 放大镜制作,(9) 在“大字遮罩”上新建图层5，重命名为“放大镜”。将元件“放大镜”拖入场景，在第40帧插入关键帧。调整第1帧和第40帧的位置，使其框与“大字遮罩”的圆对齐。此时，可以把“大字遮罩”层上的锁打开使圆显示出来做位置参照。在第1帧和第40帧创建动画补间。 (10) 选择【控制】|【测试影片】命令测试影片。,6.3 滤镜动画,6.3.1 滤镜
24、概述 使用滤镜可以为文本、按钮和影片剪辑增添有趣的视觉效果。只能对文本、按钮和影片剪辑对象应用滤镜。 对象每添加一个新的滤镜，在属性面板中，就会将其添加到该对象所应用的滤镜的列表中。 可以对一个对象应用多个滤镜，也可以删除以前应用的滤镜。通常都是使用“属性”面板中的“添加滤镜”菜单。如图6-45所示。,选择文本、按钮或影片剪辑对象，以应用或删除滤镜。选择滤镜，然后执行以下操作之一： 若要添加滤镜，请单击“添加滤镜”（+） 按钮，然后选择一个滤镜。 试验不同的设置，直到获得所需效果。 若要删除滤镜，请从已应用滤镜的列表中选择要删除的滤镜，然后单击“删除滤镜”（-）按钮。 复制和删除滤镜时，选择要
25、从中复制滤镜的对象，然后选择“滤镜”面板。 选择要复制的滤镜，然后单击“复制滤镜”按钮。选择要应用滤镜的对象，然后单击“粘贴滤镜”按钮。 如果要禁用或启用滤镜，在“滤镜”列表中，单击相应滤镜名称旁的启用或禁用图标。如图6-46所示。,图6-46 启用或禁用滤镜,【例6-11】星空。本实例为星空添加滤镜效果，使动画更生动逼真。实例效果如图6-47所示。,图6-47 星空,【例6-12】动感汽车广告。本实例制作一个汽车广告，通过滤镜使动画充满动感。实例效果如图所示。,图6-50 动感汽车广告,6.3.2 创建滤镜动画的技巧,如果将补间动画应用于已应用了滤镜的影片剪辑，则在补间的另一端插入关键帧时，
26、该影片剪辑在补间的最后一帧上自动具有它在补间开头所具有的滤镜，并且层叠顺序相同。 如果将影片剪辑放在两个不同帧上，并且对于每个影片剪辑应用不同滤镜，此外，两帧之间又应用了补间动画，则 Flash 首先处理带滤镜最多的影片剪辑。 然后，Flash 会比较应用于第一个影片剪辑和第二个影片剪辑的滤镜。 如果在第二个影片剪辑中找不到匹配的滤镜，Flash 会生成一个不带参数并具有现有滤镜的颜色的虚拟滤镜。,如果两个关键帧之间存在补间动画并且向其中一个关键帧中的对象添加了滤镜，则 Flash 会在到达补间另一端的关键帧时自动将一个虚拟滤镜添加到影片剪辑。 如果两个关键帧之间存在补间动画并且从其中一个关键
27、帧中的对象上删除了滤镜，则 Flash 会在到达补间另一端的关键帧时自动从影片剪辑中删除匹配的滤镜。 如果补间动画起始处和结束处的滤镜参数设置不一致，Flash 会将起始帧的滤镜设置应用于插补帧。,6.4 习 题,1. 上机题 （1） 飞翔的飞机。制作按照一定轨迹运动的飞机，效果如图T6-1所示。 （2） 制作下雨效果。效果如图T6-2所示。,图T6-1飞翔的飞机,图T6-2 下雨,（3） 制作画卷展开效果，效果如图T6-3所示。 （4） 制作幻灯切换效果，效果如图T6-4所示。,图T6-3画卷展开效果,图T6-4 幻灯切换效果果,（5） 制作滤镜综合效果 ，效果如图T6-5所示。,图T6-5 滤镜综合效果,
