《Flash项目实践教程》（第六版）课件 03 时间轴、帧与图层的应用；04 元件、实例与库的创建

Part3

项目3时间轴、帧与图层的应用

一切推理都必须从观察与实验得来。

——伽利略目标概述学习要求本章将全面介绍FlashCC2015中的时间轴、图层以及关键帧基本概念和应用方法，使学习者能够掌握Flash中时间轴、图层和帧基本概念和应用方法，为后面的动画制作奠定坚实的基础。学习目标

学习目标知识点了解理解掌握应用时间轴的基本概念（帧、帧频率、图层的基本概念）

案例1、案例2时间轴的作用

案例2帧的类型（关键帧、空白关键帧、属性关键帧、补间帧、静态帧）

案例1、案例2帧的操作方法（插入帧、选择帧、移动复制粘贴帧、删除帧、转换帧、帧居中、绘图纸工具的使用）

案例1、案例2图层的属性（图层名称的设置、图层的类型、轮廓颜色、图层高度）

案例1、案例2图层的操作（创建图层、移动、复制、展开、折叠图层、删除图层、重命名图层、锁定或者解锁图层）案例1、案例2图层动画的制作（引导层动画、遮罩动画的制作方法）案例1、案例2制作“瓢虫爬行”动画任务3-1案例概述案例效果本案例主要应用引导层的设置使瓢虫能按照指定的运动路径进行爬行，实现“瓢虫爬行”的动画效果。完成本案例能理解时间轴的基本概念，掌握帧的基本操作和引导层动画的制作方法。体味青山绿水就是金山银山，树立环保的理念。任务3-1制作“瓢虫爬行”动画案例分析制作“瓢虫爬行”动画主要应用创建新层、导入位图、转换为元件、时间轴中的帧、添加引导层、创建传统补间动画等知识来完成。通过本案例的制作，能够深刻理解时间轴中“图层与帧”的应用方法。图3-2“瓢虫与绿叶”的效果制作步骤步骤1新建一个动画文件。选择“修改”→“文档”命令，在打开的“文档属性”对话框中修改动画的属性，设置背景色为黑色。步骤2选择“导入”→“导入到库”，导入一个“绿叶”的背景图像，如图3-3所示。创建一名为“瓢虫”的图形元件，如图3-4所示。步骤3单击“新建图层”按钮

，新增一个图层，命名为“瓢虫”。选取“窗口”→“库”，打开元件库，在元件库中选取导入的“背景”与“瓢虫”元件，将其拖入到舞台，创建该元件的实例。并调整到合适大小，如图3-5所示。

图3-3导入到库中的图像

图3-4创建“瓢虫”元件

图3-5创建的元件实例

案例1制作“瓢虫爬行”动画任务3-1制作“瓢虫爬行”动画制作步骤步骤4选中“背景”图层，在时间轴的第30帧处右击，在弹出的菜单中选取“插入帧”命令，令背景一直可见，并锁定，如图3-6所示。步骤5选择“瓢虫”图层，在30帧处右击，在弹出的菜单中选择“插入关键帧”命令或按F6键，将第30帧设置为关键帧。在第30帧的画面上，将“瓢虫”移动到绿叶上的合适位置，并适当缩小其尺寸，如图3-7所示。

图3-6令背景一直可见

图3-7将“瓢虫”移动到绿叶上的合适位置任务3-1制作“瓢虫爬行”动画制作步骤步骤6在“瓢虫”图层上右击，在弹出的菜单中选择“添加传统运动引导层”命令，添加一个“引导层”。引导层的功能是为一般的图层提供路径，以制作自定义轨迹的“引导层动画”，如图3-8所示。

图3-8添加一个“传统运动引导层”任务3-1制作“瓢虫爬行”动画制作步骤步骤7将播放头移动到第1帧，单击“工具”面板上的“铅笔工具”

，再单击选项的“平滑”按钮

，

在引导层上绘制一条平滑的路径，如图3-9所示。步骤8单击“主工具栏”或工具选项中的“贴紧至对象”按钮

，启动该模式。步骤9选取“瓢虫”图层的第1帧，拖曳“瓢虫”元件的中心点（小十字）到路径的右端点，使瓢虫上的中心点与路径相结合。步骤10将播放头移至第30帧，选取瓢虫，拖曳瓢虫的中心点（小十字）到路径的左端点，使瓢虫上的圆点与路径相结合，如图3-10所示。

图3-9在引导层上绘制一条平滑的路径

图3-10使瓢虫上的圆点与路径相结合任务3-1制作“瓢虫爬行”动画制作步骤步骤11选取“瓢虫”层，在中间帧的位置右击，在出现的快捷菜单中选取“创建传统补间”命令。在时间轴面板上的第1帧到第29帧将出现淡色底纹。如图3-11所示。步骤12启动绘图纸功能，设置绘图纸效果范围为全部，查看瓢虫运动效果，如图3-12所示。

图3-11创建传统补间

图3-12洋葱皮效果步骤13按Enter键，播放动画，按Ctrl+Enter键，可以测试动画。若觉得路径碍事，可以将运动引导图层隐藏案例1制作“瓢虫爬行”动画任务3-1制作“瓢虫爬行”动画相关知识1.时间轴从本质上讲，Flash动画是以图层为单位来进行组织、以时间轴中的帧为主线来实现的。在“时间轴”面板上，影片中的“图层”在时间轴左侧的列中，每个层中包含的帧则显示在该层名称右侧的一行中。时间轴中的层与帧的功能如图所示。案例1绘制“五星红旗”案例1制作“瓢虫爬行”动画图3-13“时间轴”面板任务3-1制作“瓢虫爬行”动画相关知识1.时间轴（1）帧频率帧频率是动画播放的速度，以每秒播放的帧数(fps)为度量单位。24fps的帧速率是新Flash文档的默认设置，通常在Web上提供最佳效果。（2）帧的类型Flash在时间轴中使用帧来组织和控制文档的内容，在时间轴中放置帧的顺序将决定帧内对象在最终内容中的显示顺序。关键帧：是指时间轴中其元件实例首次出现在舞台上的帧。空白关键帧：空白关键帧是特殊的关键帧，以空心圆表示。它的作用是将前面的关键帧内容清除掉，而使画面的内容变为空白，即使动画中的对象消失掉。属性关键帧：属性关键帧是在补间范围中为补间目标对象显示定义一个或多个属性值的帧。定义的每个属性都有它自己的属性关键帧。补间帧：是作为补间动画的一部分的任何帧。Flash能补间，即自动填充属性关键帧之间的属性值，以便生成流畅的动画。静态帧：静态帧也称为普通帧，显示同一层上最后一个关键帧的内容。在时间轴上关键帧必须始终在普通帧的前面。任务3-1制作“瓢虫爬行”动画相关知识1.时间轴（3）图层的属性FlashCC中的图层具有多种不同的属性。①名称：在此文本框中设置图层的名称。显示：设置图层内容是否显示在场景中。锁定：设置是否可以编辑层中的内容，即图层是否处于锁定状态。②类型：设置图层的类型。一般：设置该图层为标准图层，这是Flash默认的图层类型。遮罩层：允许用户把当前层的类型设置为遮罩层，这种类型的层将遮掩与其相链接的任何层上的对象。被遮罩：设置当前层为被遮罩层，这意味着它必须链接到一个遮罩层上。只有该层在遮罩层或另一个链接的被遮罩层正下方时，该选项才可用。

图3-14“图层属性”对话框图3-15设置前的图层任务3-1制作“瓢虫爬行”动画相关知识1.时间轴（3）图层的属性

文件夹：设置当前图层为图层文件夹形式，将消除该层包含的全部内容。引导层：设置该层为引导层，这种类型的层可以引导与其相链接的被引导层中的过渡动画。被引导：设置该图层为被引导层，即它被链接到运动引导层。只有当该层在遮罩层或另一个被链接的被引导层正下方时，该选项才出现。③轮廓颜色：用于设置该图层上对象的轮廓颜色。④图层高度：可设置图层的高度。如图3-16所示。案例1制作“瓢虫爬行”动画

图3-16设置为不同高度的图层任务3-1制作“瓢虫爬行”动画相关知识2.帧的操作（1）在时间轴中插入帧在动画制作的时候，通常会制作跨越许多帧的静态图像或延长动画，这就需要在这个层中插入更多的帧，使其在所有时间都被显示。（2）在时间轴中选择帧在基于帧的选择（默认情况）中，可以在时间轴中选择单个帧。在基于整体范围的选择中，在单击一个关键帧到下一个关键帧之间的任何帧时，整个帧序列都将被选中。（3）复制、粘贴帧或帧序列选择帧或序列并选择“编辑”→“时间轴”→“复制帧”。选择要替换的帧或序列，然后选择“编辑”→“时间轴”→“粘贴帧”。或按住Alt键再单击，并将关键帧拖到要粘贴的位置。（4）删除帧或帧序列选择帧或序列并选择“编辑”→“时间轴”→“删除帧”或者右击帧或序列，从上下文菜单中选择“删除帧”。任务3-1制作“瓢虫爬行”动画相关知识2.帧的操作（5）移动关键帧或帧序列及其内容将关键帧或序列拖到目标位置。（6）更改静态帧序列的长度在按住Ctrl键的同时向左或向右拖动范围的开始或结束帧，可以更改静态帧序列的长度。（7）将关键帧转换为帧选择关键帧并选择“编辑”→“时间轴”→“清除关键帧”或者右击关键帧并从上下文菜单中选择“清除关键帧”。

图3-18移动帧序列图3-17移动单个帧任务3-1制作“瓢虫爬行”动画相关知识2.帧的操作（8）帧居中在编辑状态时，我们可以在时间轴上看到有一红色的播放指针，它可以指示当前所在帧。（9）“绘图纸”功能：绘图纸外观。单击该按钮，将显示播放指针所在帧内容的同时显示其前后数帧的内容。播放指针周围会出现方括号形状的标记，其中所包含的帧都会显示出来，这将有利于观察不同帧之间的图形变化过程。：绘图纸外观轮廓。单击该按钮，除当前播放指针下的关键帧以原色显示外，其他帧将显示出对象的轮廓线。：编辑多个帧。单击该按钮，将显示“洋葱皮”标记之间每一帧的内容，使每一帧都可以编辑，而不管是不是当前帧。图3-19帧居中任务3-1制作“瓢虫爬行”动画相关知识3.铅笔工具

使用铅笔工具可以绘制线条和形状，绘画的方式与使用真实铅笔大致相同。若要在绘画时平滑或伸直线条和形状，可为铅笔工具选择一种绘制模式。（1）选择“铅笔工具”。（2）选择“窗口”→“属性”命令，然后选择笔触颜色、笔触和样式。（3）在“工具”面板的“选项”下，选择一种绘制模式：①若要绘制直线，并将接近三角形、椭圆、圆形、矩形和正方形的形状转换为这些常见的几何形状，可选择“伸直”。②若要绘制平滑曲线，可选择“平滑”。③若要绘制不用修改的手画线条，可选择“墨水”。④若要使用“铅笔工具”绘制，可单击舞台并拖动，按住Shift键拖动可将线条限制为垂直或水平方向。任务3-1制作“瓢虫爬行”动画制作“遮罩文字”动画任务3-2案例概述案例效果本案例主要通过“文字工具”和遮罩动画完成“遮罩文字”的动画效果。任务3-2制作“遮罩文字”动画“遮罩文字”的效果案例分析创建简单“遮罩文字动画”的动画过程。通过本案例的制作，可以深刻理解时间轴中“图层”的应用方法，制作完成“遮罩文字”动画效果。制作步骤步骤1

新建文件，命名为“遮罩文字”，将背景设为白色，大小为400×200像素。步骤2输入文字。将“图层1”名称改为“文字”，选择工具箱中的文本工具

，在舞台上输入文本“Mask”，文字大小为100，字体为ArialBlack，颜色任意（因为变成遮罩层后，文字的颜色不显示），执行“对齐”面板中的

与

命令，将文字与舞台中心对齐，如图3-21、图3-22所示。案例2制作“遮罩文字”动画图3-21文字图层图3-22输入文本任务3-2制作“遮罩文字”动画制作步骤步骤3新建图层，命名为“图像”，将“图像”层移动到“文字”层下方，如图3-23所示。步骤4

导入图像。选择“文件”→“导入”→“导入到舞台”，将光盘“素材”→“遮罩动画”文件夹中的“花.jpg”导入到舞台上，使用“任意变形工具”

，将图片缩放到合适大小（可以比舞台本身更长一些），将其与文字左端靠近，如图3-24所示。图3-23创建图像图层图3-24导入图像任务3-2制作“遮罩文字”动画制作步骤步骤5转换为元件。将位图图像选中，选择“修改”→“转换为元件”命令，将图像转换为图形元件，命名为“图像”。步骤6选中图像层的第20帧，按F6键，插入关键帧，如图3-25所示。步骤7在文字层上选中第20帧，按F5键，插入帧。在图像层的第20帧上将图片移动到舞台左侧，使其右边与文字靠近，如图3-26所示。图3-25插入关键帧图3-26将图片移动到舞台左侧任务3-2制作“遮罩文字”动画制作步骤步骤8创建动画。选择“图像”层中间帧，右击，在弹出的快捷菜单中选择“创建传统补间”，创建运动补间动画，如图3-27所示。步骤9创建遮罩层。在“文字”层上右击，在弹出菜单中选择“遮罩层”，如图3-28所示。图3-27创建运动补间动画图3-28创建遮罩层任务3-2制作“遮罩文字”动画制作步骤步骤10创建完成后的图层显示如图3-29所示。步骤11测试动画。我们可以看到图像在文字中流过的效果，如图3-30所示。图3-29图层显示图3-30图像在文字中流过的效果任务3-2制作“遮罩文字”动画相关知识创建图层或文件夹创建一个图层或文件夹之后，该图层或文件夹将出现在所选图层的上方。新添加的图层将成为活动图层。执行下列操作之一：（1）单击图层底部的“插入图层”按钮或“新建文件夹”按钮。（2）右击一个图层名称，然后选择快捷菜单中的“插入图层”或“插入文件夹”。2.选择图层或文件夹执行下列操作之一：（1）单击图层或文件夹的名称。（2）单击要选择的图层的任意一个帧或在舞台中选择要选择的图层上的一个对象。（3）要选择连续的几个图层或文件夹，可按住Shift键单击它们的名称。（4）若要选择几个不连续的图层或文件夹，可按住Ctrl键单击时间轴中它们的名称。案例1绘制“五星红旗”任务3-2制作“遮罩文字”动画相关知识3.移动、展开、折叠图层或文件夹（1）要将图层或文件夹移动到文件夹中，可将该图层或文件夹的名称拖到目标文件夹的名称中。（2）要更改图层或文件夹的顺序，可将一个或多个图层或文件夹拖到所需位置。（3）要展开或折叠文件夹或所有文件夹，可单击该文件夹名称左侧的三角形；或右击，选择快捷菜单中的“展开所有文件夹”或“折叠所有文件夹”。4.重命名图层或文件夹养成良好的习惯，始终命名每个图层，并为图层指定一个有意义的名称，以指示该图层上内容的类型。5.复制图层或文件夹（1）要复制图层或文件夹的内容，可选择图层或文件夹。然后选择“编辑”→“时间轴”→“复制帧”。（2）单击新图层，然后选择“编辑”→“时间轴”→“粘贴帧”，便可将图层或文件夹的内容复制了。任务3-2制作“遮罩文字”动画相关知识6.删除图层或文件夹要选择图层或文件夹，可以单击该图层或图层文件夹的名称，或者单击图层中的任意一个帧。执行下列操作之一：（1）单击时间轴中的“删除图层”按钮或将图层或文件夹拖到“删除图层”按钮。（2）右击该图层或文件夹的名称，然后选择快捷菜单中的“删除图层”或“删除文件夹”。7.锁定或解锁一个或多个图层或文件夹（1）要锁定图层或文件夹，可以单击该图层或文件夹名称右侧的“锁定”列。要解锁该图层或文件夹，可再次单击“锁定”列。（2）要锁定所有图层和文件夹，可以单击挂锁图标。要解锁所有图层和文件夹，可再次单击它。（3）要锁定或解锁多个图层或文件夹，可以在“锁定”列中拖动。（4）若要锁定所有其他图层或文件夹，可以按住Alt键单击图层或文件夹名称右侧的“锁定”列。要解锁所有图层或文件夹，可再次按住Alt键单击“锁定”列。任务3-2制作“遮罩文字”动画相关知识8.图层的轮廓在对象编辑中，通过显示对象为轮廓的方法，方便地察看对象。在线框模式下，该层的所有对象都以一种颜色显示。图层轮廓的颜色可在“图层属性”中自行设置，也可以由Flash以随机的方式给图层分配一种轮廓颜色。每个对象的轮廓颜色和其所在图层右侧的“将所有图层显示为轮廓”图标的颜色相同。调出轮廓显示的方法如下：（1）单击图层名称右边的显示模式栏即可将图层转换为轮廓模式；再次单击显示模式栏则取消轮廓模式。（2）单击“显示所有图层的轮廓”图标，可以将所有图层以轮廓模式显示；再次单击轮廓模式图标则取消轮廓模式。任务3-2制作“遮罩文字”动画项目小结案例1绘制“五星红旗”本章全面介绍了图层、时间轴、帧等有关术语。介绍了图层的属性、图层与帧的操作方法，还介绍了图层的管理、图层的编辑，并通过“引导层动画”及“遮罩层动画”案例的制作，进一步熟悉了动画制作中图层与时间轴的功能及用法，为后面动画的制作奠定了坚实的基础。项目小结思考与练习案例1绘制“五星红旗”1.什么是图层？图层的作用是什么？图层有几种？怎样编辑图层？2.结合前面所学内容练习图层、普通引导层与运动引导层的转换。3.结合所讲内容，练习制作一个应用文字作为遮罩层的例子。思考与练习拓展训练案例1绘制“五星红旗”训练1：制作“跳动的小球”动画任务要求：创建“球”元件，制作球上下跳动的效果。要求如下：1.设置舞台的大小为500×400像素。2.绘制一个“球”并转换为图形元件。3.制作小球上下弹跳的补间动画。4.创建“小球阴影”的图形元件，通过调整Alpha设置制作阴影动画。动画效果：效果如图

所示。拓展训练拓展训练案例1绘制“五星红旗”训练2：制作“万花筒效果”动画任务要求：使用一幅图片，利用遮罩动画制作眼花缭乱的“万花筒效果”。要求如下：1.设置舞台的大小为400×300像素，准备一幅图片，导入到库中转换图形元件。3.利用图形元件实例和遮罩动画创建45度扇形影片剪辑元件。4.在场景中使用影片剪辑元件实例摆放成一个圆形，创建“万花筒效果”动画。动画效果：效果如图所示。拓展训练谢谢！Part4项目4元件、实例与库的创建

勿以恶小而为之，勿以善小而不为。——刘备

目标概述学习要求本章将全面介绍FlashCC中的元件的概念和基本类型，创建和编辑三种元件方法，使学习者能充分的理解3种类型元件之间的区别和联系，并清楚的了解元件与实例之前的关系。学习目标

学习目标知识点了解理解掌握应用图形元件的基本概念、影片剪辑元件、按钮元件的创建和编辑方法

案例1、案例2影片剪辑元件的基本概念

案例2按钮元件的基本概念

案例1、案例3、案例4图形元件的创建和编辑方法

案例3影片剪辑元件的创建和编辑方法

案例1按钮元件的创建和编辑方法案例4库的概念案例3库的基本操作案例7实例的概念案例3实例的编辑方法案例12026/9/14图4-1第4章知识导航图制作“星形”图形元件任务4-1案例概述案例效果本案例主要通过新建元件、绘制与编辑图形元件、场景与库等操作来完成简单的“星形”图形元件的创建。创建完成后的星形图形元件出现在库中，等待随时调用。任务4-1制作“星形”图形元件案例分析制作“星形”图形元件主要应用绘画工具完成图形的绘制，然后创建“星形”图形元件。图4-2星形元件最终效果图制作步骤步骤1新建Flash文件。选择“修改”→“文档”，设置背景色为黑色。选择“插入”→“新建元件”，将弹出“创建新元件”对话框，如图4-3所示。步骤2

在“名称”栏输入“星形”，在“类型”中选择“图形”,如图4-4所示。图4-3“创建新元件”对话框图4-4选择“图形”类型任务4-1制作“星形”图形元件制作步骤步骤3单击“确定”按钮，进入“星形”图形元件编辑模式，如图4-5所示。步骤4

选择“多角星形工具”

，打开“属性”面板，如图4-6所示。图4-5“星形”图形元件编辑模式图4-6打开“属性”面板任务4-1制作“星形”图形元件制作步骤步骤5单击属性面板中的

，在弹出的“工具设置”对话框中，设置样式为星形，边数为8，星形顶点大小为0.10，单击“确定”，如图4-7所示。步骤６选择“窗口”→“颜色”，调出“颜色”面板，将笔触颜色设为无色。在“类型”下拉列表中选择“放射状”，调整渐变颜色，如图4-8所示。图4-7“工具设置”对话框图4-8调整渐变颜色任务4-1制作“星形”图形元件制作步骤步骤7使用“多角星形工具”

在舞台上拖动出一个星形，如图4-9所示。步骤8

选择“窗口”→“对齐”或按下Ctrl+K键，打开“对齐”面板，如图4-10所示。按下水平居中对齐

和垂直居中对齐

，将该图形中心与舞台中心对齐。图4-9绘制星形图4-10“对齐”面板任务4-1制作“星形”图形元件制作步骤步骤9单击“场景1”，退出图形元件的编辑模式，回到主场景，编辑的星形就已经保存在“库”中了。这样该动画的基本图形元件就已准备完毕了，如图4-11所示。步骤10多次拖动“星形”元件到舞台上创建星星实例，根据星星远近设置星星变形和旋转的数据，最终实现动画效果，如图4-2所示。图4-11“库”面板任务4-1制作“星形”图形元件相关知识1.元件的概念元件是Flash中一个重要而且使用非常频繁的概念，狭义的元件是指在Flash创作环境中或使用Button（AS2.0）、SimpleButton（AS3.0）和MovieClip类创建过一次的图形、按钮或影片剪辑这三种元件。元件一旦创建，就会被自动添加到当前影片的库中，然后可以自始至终地在当前影片或其他影片中重复使用。用户创建的所有元件都会自动变为当前文件的库的一部分。2.元件的类型（1）图形元件

图形元件可用于静态图像，并可用来创建连接到主时间轴的可重用动画片段。（2）影片剪辑元件

影片剪辑元件是Flash电影中一个相当重要的角色。使用影片剪辑元件可以创建可重用的动画片段。影片剪辑拥有各自独立于主时间轴的多帧时间轴，不受场景和时间轴的影响。（3）按钮元件

按钮元件是一个比较特殊的元件，它不是单一的图像，它用4种不同的状态来显示。使用按钮元件可以创建用于响应鼠标单击、滑过或其他动作的交互式按钮。案例1绘制“五星红旗”任务4-1制作“星形”图形元件相关知识3.库资源的概念库资源在创作或运行时，可以将元件作为共享库资源在文档间共享。4.认识库使用库可以省去许多重复的操作和一些不必要的麻烦。另外，使用库对于最大程度上减小动画文件的体积也具有决定性的意义。FlashCC的库，如图所示。任务4-1制作“星形”图形元件相关知识4.认识库（1）标题栏标题栏显示当前库的标题。（2）列表栏在列表栏中，列出了库中包含的所有元素的各种属性，包括名称、类型、使用次数、链接和修改日期5项。（3）预览窗口单击选定列表栏中的某一个文件，在列表栏上面的预览窗口中就可以对其进行预览。（4）编辑工具在库界面左下方有“新建元件”、“新建文件夹”、“元件属性”、“删除元件”4个按钮可以对库文件进行编辑。任务4-1制作“星形”图形元件相关知识5.认识元件库每一个FlashCC动画文件中都有一个元件库，这个元件库仅存放当前动画文件的元件。选择“窗口”→“库”命令或按Ctrl+L键，将打开当前编辑环境下的“库”面板。该库中的文件夹和文件包含了当前编辑环境下所有的元件以及导入的位图和其他对象，如声音、视频等，相当于在当前这部影片中扮演每个角色的所有演员的大集合。无论在当前编辑的动画中，某个元件出现了多少次、在多少个位置出现、被编辑成什么形式出现，它都作为一个元件被放进库文件列表中，同时还可以使用“库”界面左下角的库编辑工具，对库中的所有文件和文件夹自由地进行管理操作，这种功能将会给当前环境的动画制作带来极大的方便。6.新增元件到库在FlashCC中，如果要将对象新增到元件库内，最常用的方法是从舞台中选择某个对象转换为元件。另外，还可以如上所述创建一个空元件，然后在元件编辑模式下再为其添加内容，如此可将绘制的元件新增到元件库内。以下通过案例讲解下新增元件到库的方法。任务4-1制作“星形”图形元件步骤1选择“窗口”→“库”或按下快捷键Ctrl+L，打开当前文件的元件库，若是新文件，则元件库为空。

步骤2选择“文件”→“导入”→“导入到舞台”命令，打开“导入”对话框，从中选择要导入的“车2.JPG”文件，如图4-13所示。导入的“车2.JPG”图像文件便出现在舞台上了。选择“任意变形工具”手动调整到舞台适当大小，如图4-14所示。

图4-13“导入”对话框图4-14调整导入车的图像文件制作步骤任务4-1制作“星形”图形元件步骤3在舞台上选择导入的位图对象，按下Ctrl+B键，将位图分离。用“套索工具”选项中的“魔棒工具”，去除背景，再选择“修改”→“转换为元件”或按F8键，系统将弹出“转换为元件”对话框，在“名称”框中输入元件的名称“车”，在“类型”选项中选择“图形”，在“注册”中选择中心点，单击“确定”，如图4-15所示。转换后的“车”元件出现在舞台，元件的中心点有一个十字，如图4-16所示。制作步骤图4-15“转换为元件”对话框图4-16转换后的“车”元件任务4-1制作“星形”图形元件制作步骤步骤4

选择“窗口”→“库”，打开“库”面板。可以看到，在库中出现了新创建的元件，如图4-17所示。步骤5完成元件内容的制作后，选择“编辑”→“编辑文档”或按下快捷键Ctrl+E，还可以单击“时间轴”面板上的“场景1”标签，即退出元件编辑模式。此时，该元件的实例出现在舞台中。如图4-18所示。步骤6选择“文件”→“保存”，将该文件保存为“新增元件”，新增元件到库的操作便完成了。

图4-17打开“库”面板图4-18舞台中的元件实例任务4-1制作“星形”图形元件制作“星光闪烁”影片剪辑任务4-2案例概述案例效果本案例将以“星光闪烁”效果为例学习影片剪辑的创建与编辑。完成此案例能掌握影片剪辑元件的创建和编辑的方法，熟练“库”的操作方法。任务4-2制作“星光闪烁”影片剪辑案例分析本案例主要完成“星形”影片剪辑元件的创建与库的操作以及编辑影片剪辑元件，调整其透明度，创建传统补间动画，并在场景中应用影片剪辑，完成“星光闪烁”动画的制作。图4-19“星光闪烁”效果制作步骤步骤1新建文件，设置文档背景为黑色。选择“插入”→“新建元件”命令，打开“创建新元件”对话框，如图4-20所示。设置“名称”为“star_mc”，设置“类型”为“影片剪辑”，单击“确定”。步骤2选择“多角星形工具”

选项中的“星形”工具，绘制一个“star_mc”图形。在“属性”面板中调整图形的位置和大小，完成效果如图4-21所示。图4-20“创建新元件”对话框

图4-21绘制“star_mc”图形任务4-2制作“星光闪烁”影片剪辑制作步骤步骤3分别选中该层的第6帧和第12帧，按F6键插入关键帧，如图4-23所示。步骤4选中时间轴上任意一帧，选择“插入”→“传统补间”或右击，在弹出的快捷菜单中选择“创建传统补间”，在3个关键帧中添加两个补间动画，时间轴效果如图4-24所示。

图4-22插入关键帧

图4-23创建传统补间任务4-2制作“星光闪烁”影片剪辑制作步骤步骤5调整星形的透明度。在舞台上分别选中第1帧和第12帧的图形元件，在“属性”面板中将其Alpha属性改为9%或更小，如图4-23所示。步骤6回到“场景1”，打开“库”面板，如图4-24所示。

图4-24“属性”面板

图4-25“库”面板任务4-2制作“星光闪烁”影片剪辑制作步骤步骤7

将创建完成的影片剪辑多次拖入到场景中，此时影片剪辑占据了主场景中的一个关键帧，如图4-26所示。步骤8

测试影片。可以看到虽然场景中只有一帧，但是动画依然可以播放，如图4-27所示。在这里，如果把影片剪辑想象为一个时间轴，理解起来就很容易了。

图4-26影片剪辑只占据了一帧

图4-27测试影片任务4-2制作“星光闪烁”影片剪辑制作步骤步骤9为了使影片剪辑看上去更生动，我们在时间轴上增加一新层，如图4-28所示。步骤10导入本章素材文件夹中名为“星空”的背景图像，放在下面的层中，在上面层中添加若干星星，如图4-29所示。

图4-28增加一新层

图4-29导入“星空”的背景图像任务4-2制作“星光闪烁”影片剪辑制作步骤步骤11将库中的影片剪辑元件拖入场景中若干次，在“属性”面板中单击“色彩效果”选项左侧的小三角，打开“样式”下拉菜单，选择“高级”，打开“红、绿、蓝”选项，拖动滑块，对星星的色调进行编辑修改，如图4-30所示。步骤12

按下Ctrl+Enter键，测试影片。完成的效果如图4-22所示。

图4-30“属性”面板任务4-2制作“星光闪烁”影片剪辑2026/9/14相关知识通过应用已创建完成的动画，在时间轴上进行复制帧、粘贴帧的操作，实现创建影片剪辑元件的操作。通过本案例的操作过程，可以将已制作完成的动画，快速转换成影片剪辑。步骤1

打开一个动画文件，在时间轴左边的层编辑区中，按Shift键，选取所有的图层，如图4-31所示。

图4-31选择所有的图层

步骤2在时间轴的帧上右击，然后从弹出的菜单中选择“复制帧”命令；或者选择“编辑”→“时间轴”→“复制帧”命令，复制所有的动画帧。任务4-2制作“星光闪烁”影片剪辑2026/9/14相关知识步骤3选择“插入”→“新建元件”命令或按下Ctrl+F8键，在“创建新元件”对话框中，将元件命名为“电影片段”，元件类型选择“影片剪辑”，单击“确定”如图4-32所示

步骤4在出现的元件编辑模式下，单击时间轴上的第1帧，从菜单中选择“编辑”→“时间轴”→“粘贴帧”命令；或者在第1帧上右击，从弹出的菜单中选择“粘贴帧”命令，将已复制的全部动画帧粘贴进来，如图4-33所示。图4-32“创建新元件”对话框图4-33复制为影片剪辑元件步骤5选择“编辑”→“编辑文档”或者单击时间轴面板上的“场景1”标签，退出元件编辑模式。任务4-2制作“星光闪烁”影片剪辑

制作“交互式按钮”元件任务4-3案例概述案例效果主要应用创建、编辑按钮元件来完成“交互式按钮”效果的制作。任务4-3制作“交互式按钮”元件案例分析本案例分析按钮元件的构造，了解按钮的功能。通过导入的位图创建“花形按钮”图形，并将该图形应用于按钮的各种状态中。图4-34按钮四种状态效果图制作步骤步骤1新建Flash文件，创建按钮所用的图形元件。选择“插入”→“新建元件”或按Ctrl+F8键，弹出“创建新元件”对话框，在“名称”框中输入“花”，在“类型”选项中选择“图形”，单击

“确定”

，进入图形元件编辑模式，如图4-35所示。步骤2导入一幅鲜花图片，按下Ctrl+B键分离后去除背景，将分离后的花朵与场景的中心对齐，创建一个名为“花”的图形元件，如图4-36所示。图4-35“创建新元件”对话框图4-36创建一个名为“花”的图形元件任务4-3制作“交互式按钮”元件制作步骤步骤3选择“编辑”→“编辑文档”或单击左上角的“场景1”，返回主界面。这时，刚刚编辑的名为“花”的图形元件将出现在库中，如图4-37所示。步骤4再创建一按钮元件，名称为“按钮”，单击“确定”后，进入按钮元件编辑模式，时间轴变为4帧，如图4-38所示。图4-37库中的“花”图形元件

图4-38按钮的编辑模式任务4-3制作“交互式按钮”元件制作步骤步骤5在“弹起”帧上右击，从弹出的菜单中选择“插入关键帧”命令，或将库中名为“花”的图形元件拖入舞台中央与中心点对齐，这样就创建了“弹起”帧的图像，如图4-39所示。步骤6在“指针经过”帧上右击，从弹出的菜单中选择“插入关键帧”，第2帧的图像就出现在舞台上了。选中该图像，在“属性”面板中的“颜色”选项中选择“高级”，进行设置，更改图形颜色，效果如图4-40所示。图4-39创建“弹起”帧的图像

图4-40更改图形颜色效果任务4-3制作“交互式按钮”元件制作步骤步骤7

复制第1帧，在“按下”帧上右击，从弹出的菜单中选择“插入关键帧”或将库中名为“花”的图形元件拖入舞台中央与中心点对齐，第3帧“按下”帧的图像就出现在舞台上了。应用“任意变形工具”

，将该图形元件进行缩小，结果如图4-40所示。步骤8在“点击”帧上右击，从弹出的菜单中选择“插入关键帧”，第4帧的图像就出现在舞台上了。应用“任意变形工具”

，将该图形元件进行放大，设置感应区域，结果如图4-41所示。图4-40“按下”帧的图像图4-41“按下”帧的图像任务4-3制作“交互式