在制作过程中，如果仅仅使用图片和文字制作动画，不但制作步骤烦琐，而且动画的变化也不多。使用元件制作动画，既提高了制作动画的速度，又使得动画的效果更加多样化。所以，在动画中，元件的使用是必不可少的。本节中将详细介绍元件的概念，并通过实例介绍元件在动画中的应用。

动画制作中包括图形、按钮和影片剪辑3种元件。这3种元件既可以单独创建，又可以嵌套在一起综合使用。

使用元件可以更加快速、高效地制作影片。而且，对于内部已经创建完成的Flash元件，可以在舞台上直接对元件实例进行修改，而不必每次都重新创建新的对象。元件的存在使得动画制作更加简单快捷，动画效果也更加丰富多彩。

1.元件概述

元件是指在创作环境中使用Button（AS 2.0）、SimpleButton（AS 3.0）和MovieClip创建的图形、按钮和影片剪辑，如图4-66所示。创建完成的元件将出现在库面板中，如图4-67所示。元件是可以重复利用的，它能够在文档中多次使用一个资源，而无须在文件中复制该资源。因为在文档中可以仅保存元件的一个副本，所以使文档文件变得很小，易于网络传输。

图4-66 创建元件

图4-67 库面板

在文档中使用元件可以减少文件的大小，保存一个元件的几个实例比保存该元件内容的多个副本占用的存储空间小。例如，通过将背景图像这样的静态图形转换为元件，然后重新使用它们，可以减小文件的大小。使用元件还可以加快SWF文件的回放速度，因为元件只需下载到Player中一次。

2.元件的类型

元件在动画中占有很重的地位，所以单一的元件类型是不能满足动画制作的。按照元件的不同功能，可以将元件分为“图形”元件、“按钮”元件和“影片剪辑”元件。

（1）“图形”元件

“图形”元件是用来出创建连接到主时间轴可以重复调用的动画片段，如图4-68所示；也可以是图像，如图4-69所示。动画播放时，“图形”元件与主时间轴同步播放。但是交互式控件和声音在图形元件的动画序列中不起作用。

图4-68 “图形”元件——动画片段

图4-69 “图形”元件图像

（2）“按钮”元件

在动画制作中，需要随时控制动画的播放进度，所以就出现了“按钮”元件。使用“按钮”元件可以创建用于响应鼠标单击、滑过或其他动作的交互式按钮。

“按钮”元件的时间轴与“图形”元件的时间轴不相同，由弹起、指针经过、按下和点击4个状态组成，如图4-70所示。其中各个状态能够实现不同的动画效果。

图4-70 按钮元件时间轴及效果

（3）“影片剪辑”元件

在“影片剪辑”元件中可以独立制作各种动画，并且可以将其他各种元件嵌套在一起，而且各个元件都可以包含交互式控件、声音甚至其他影片剪辑实例，如图4-71所示。当然也可以将“影片剪辑”实例放在“按钮”元件的某个状态，用来创建动画按钮。此外，还可以使用ActionScript对影片剪辑进行控制。

图4-71 “影片剪辑”元件时间轴及效果

3.创建与编辑元件

1）执行【文件】寅【新建】命令，弹出“新建文档”对话框，如图4-72所示。单击【确定】按钮，新建一个文档。

图4-72 新建Flash文档

2）执行【新建元件】命令，如图4-73所示。弹出“创建新元件”对话框，设置元件的【类型】为【图形】，【名称】为【汽车】，如图4-74所示。单击【确定】按钮，即可完成元件的创建。

图4-73 执行【新建元件】命令

图4-74 “创建新元件”对话框(www.daowen.com)

3）执行【文件】寅【导入】寅【导入到舞台】命令，将一辆汽车的素材文件插入到场景中，如图4-75所示。

4）单击状态栏上的场景1，返回到场景编辑状态，如图4-76所示。执行【库】命令，在弹出的库面板上可以看到图形元件汽车，如图4-77所示。

图4-75 导入图片

图4-76 返回到场景

5）单击属性面板上的背景颜色按钮，设置颜色值为#993300，将背景颜色改为橙色，效果如图4-78所示。在库面板上图形元件汽车上双击，重新进入汽车元件的编辑状态，效果如图4-79所示。

图4-77 库面板中的汽车元件

图4-78 修改文档背景色

6）选择图像，执行【分离】命令，如图4-80所示。将图像分离为图形，效果如图4-81所示。

7）单击工具箱中的【套索工具】按钮，此时在工具箱的选项区域中弹出【套索工具】的相应选项中选择【魔术棒】按钮，在图像空白区域单击，选取白色，按下<Delete>键，得到效果如图4-82所示。单击取消【魔术棒工具】按钮选择，然后再单击下面的【多边形模式】按钮，选择多余的白色并删除，完成效果如图4-83所示。

8）单击状态栏上的【场景1】按钮，返回到场景编辑状态。可以看到“汽车”图形元件已经修改完毕。选择元件，单击属性面板上颜色样式下的【Alpha】选项，如图4-84所示。修改设置元件【透明度（Alpha）】为【70%】，效果如图4-85所示。

图4-79 返回元件编辑状态

图4-80 执行【分离】命令

图4-81 图像分离效果

图4-82 删除背景色

图4-83 删除多余颜色

图4-84 属性设置

图4-85 元件的透明效果

4.使用库面板

库面板是存储各种元件的地方，而且可以用于存储导入的文件、包裹位图图形、声音文件和视频剪辑，如图4-86所示。在库面板中可以对各种资源进行查看、新建、删除、编辑和归类等操作。库面板可以组织文件夹中的库项目，查看项目在文档中使用的频率，并按类型对项目排序。

为了方便用户在Flash中制作动画，提供了一个专供用户使用的“公共库”，并且按照功能的不同分为“学习交互”、“按钮”和“类”3种，如图4-87所示。

图4-86 库面板

图4-87 公共库面板