第3章元件和库
元件是可反复在舞台上使用的对象，是Animate动画设计中非常重要的部分。库是所有舞台对象的存储场所，相当于剧组的后台空间。所有元件(即与制作有关的道具、演员等)都在未参与舞台表现时存放在库里面。本章主要讲解创建元件，将舞台上的动画转换为影片剪辑元件，编辑元件和使用库项目等内容。
3.1元件与“库”面板
元件是指可在整个文档或其他文档中重复使用的内容，元件存储在一个被称为“库”的地方并可在需要的时候使用。实例是指存在于舞台上的元件的副本，它参与阐述动画的主题。
使用元件可以显著地减小文件的大小，使用元件还可以加快SWF文件的播放速度，因为元件只需下载一次。
3.1.1元件的类型
元件的类型主要有图形元件、按钮元件和影片剪辑元件，可在整个文档或其他文档中重复使用。设计者创建的任何元件都会自动地成为当前文档的库的一部分。
每个元件都有自己的时间轴、图层和舞台，并可以将帧、关键帧和图层等添加到其时间轴上，就像主时间轴(顶层动画舞台的时间轴)一样。
1. 图形元件
图形元件表示静态图像(画面)，可用于创建连接到主时间轴的可重复使用的动画片段。图形元件与主时间轴同步运行。交互式控件和声音在图形元件的动画序列中不起作用。图形元件本身没有时间轴，仅描述静态画面，因此图形元件在FLA文件中的尺寸小于按钮和影片剪辑。
2. 按钮元件
按钮元件用于实现与用户的交互，可以响应鼠标单击、滑过或其他操作，也可以定义与各种按钮状态关联的图形，然后将动作指定给按钮实例。当用户有特定操作时，通常需要完成某种功能，必须结合ActionScript 3.0脚本才能实现，因此需要先掌握与脚本编写相关的知识。

3. 影片剪辑元件
影片剪辑元件用于可以重复使用的动画片段，它拥有自身独立于主时间轴的多帧时间轴。影片剪辑的多帧时间轴可看作是嵌套在主时间轴内，其中包含交互式控件、声音甚至其他影片剪辑实例的元件。如果将影片剪辑的实例放在按钮元件的时间轴内，即可创建具有动画效果的按钮。
说明： 3种类型的元件在“库”面板中分别以不同的图标来指示，用户可以很方便地识别和选用。




3.1.2创建图形元件
图形元件用于表示静止的画面(如房屋、家具等)，图形元件的时间轴与主时间轴同步，图形元件中的声音与交互在主时间轴上不起作用。

创建图形元件的基本过程是先绘制元件的内容，然后将其转换为图形元件。
动画的设计与制作通常需要一定的美术基础，制作元件也不例外。对于没有美术基础的读者而言，为了增加制作效果，不妨使用现成的图片作为辅助。


视频讲解


【案例3.1】制作古钱币元件。
①  新建一个“角色动画”类型预设为“标准(640×480)”的Animate文档，然后将该文档保存为“案例3.1.fla”。
②  执行“视图”→“标尺”命令，打开“标尺”，然后通过标尺拖出水平、垂直参考线各一条，并使参考线相交于舞台中央的位置。
③  修改“图层1”的名称为“钱币”，然后在该图层中绘制钱币的轮廓，如图31(a)所示。


图31古钱币元件制作过程




图32渐变填充设置

④  打开“颜色”面板并将填充颜色类型调整为“径向渐变”，并设置渐变的起始颜色和终止颜色，如图32所示。钱币的内外边条颜色是(#999966，#999900)，钱币主体颜色是(#999900，#996600)，利用“颜料桶”工具为钱币的不同区域填充颜色，效果如图31(b)所示，完成后锁定该图层。
⑤ 添加一个新图层并命名为“文字”，然后利用文本工具添加文字“乾隆通宝”，此处用到的字体为“颜体”(没有的话可使用别的字体)，字体颜色为 #FFCC00，文字大小根据具体情况进行调整； 接着按Ctrl+B组合键将文字“分离”为4个独立的汉字，并重新调整文字的位置，完成后的效果如图31(c)所示。
⑥  解锁所有图层，并选择所有舞台对象，然后执行“修改”→“转换为元件”命令，将所选内容定义为“图形”元件，名称为“古钱币”，如图33所示。


图33转换为元件


新创建的图形元件可以在“库”面板中找到。
3.1.3创建按钮元件
按钮元件用于实现与用户的交互，需要编写ActionScript 3.0脚本才能完成功能，在未介绍脚本知识之前，先带领读者学习按钮元件的制作方法。
创建新元件，除了可以先在舞台上制作好后将其转换为元件以外，还可以直接创建空元件并以从零开始的方式完成制作，按钮元件的制作就是如此。
创建按钮元件应遵循以下基本步骤。
1. 选择最适合自己需求的按钮类型
按钮有普通按钮元件和影片剪辑按钮元件两类。
大部分人会选择普通按钮元件类型，因为此类型按钮更具灵活性。普通按钮元件包含自己特有的内部时间轴用于表示按钮的状态，这些状态分别是“弹起”“指针经过”“按下”“点击”。通过为这4种状态创建不同的视觉效果，可以制作出非常丰富的特效。
使用影片剪辑按钮元件可以创建更复杂的、包含动画效果的按钮。这种按钮有一个缺点，那就是影片剪辑按钮元件比普通按钮元件要占用更大的存储空间。
2. 定义按钮状态
普通按钮元件有“弹起”“指针经过”“按下”“点击” 4种状态，需要设计者逐一设置。
(1) “弹起”帧： 当用户没有与按钮进行交互时显示的外观。
(2) “指针经过”帧： 当鼠标指针移动到按钮上方时显示的外观。
(3) “按下”帧： 当用户单击按钮时显示的外观。
(4) “点击”帧： 对用户的单击有响应的区域。是否定义“点击”帧是可选的，如果按钮比较小，或者其图形区域不是连续的，定义此帧会非常有用。“点击”帧具有以下特点。
① 在播放期间，“点击”帧的内容在舞台上不可见。
② “点击”帧的图形是一个实心区域，它的大小通常完全覆盖“弹起”“按下”“指针经过”帧的所有图形元素。如果想制作响应舞台的特定区域的按钮，则可以将“点击”帧图形放在一个不覆盖其他按钮帧图形的位置上。
③ 如果没有指定“点击”帧，则使用“弹起”状态的图像。
3. 将操作与按钮关联
如果要使用户选中一个按钮时触发某事件，可以在时间轴上添加ActionScript代码，将ActionScript代码放入与按钮相同的帧中。在“代码片段”面板中有针对许多常见的按钮用途预编写的ActionScript 3.0代码。


视频讲解


【案例3.2】制作按钮元件。
① 新建一个采用ActionScript 3.0脚本技术的常规Animate文档，然后保存该文档为“案例3.2.fla”。
② 执行“插入”→“新建元件”命令，在打开的“创建新元件”对话框中输入名称为“按钮1”并调整类型为“按钮”，然后单击“确定”按钮完成新元件的创建。

③ 在“时间轴”面板双击“图层1”文字并将文字改为“图形”，然后单击“时间轴”面板左下方的“新建图层”按钮创建一个新图层，并将图层说明文字“图层2”改为“箭头”，完成后的结果可参考图34。


图34“时间轴”面板状态


④ 以相同的填充效果、不同的颜色制作“图形”层上的“弹起”“指针经过”“按下”“点击” 4个帧上的“圆”形状。以相同的填充效果、不同的颜色制作“箭头”层上的“指针经过”“按下”两个帧上的“三角”形状。完成后的效果可参考图35(a)~(d)。


图35按钮元件的4个帧


⑤ 单击舞台上方的“编辑栏”左侧的按钮返回主场景舞台，然后打开“库”面板，将“按钮1”元件拖到舞台上，并测试影片观察按钮的交互效果。


视频讲解


【案例3.3】利用图片素材制作按钮元件。
制作按钮元件不一定非要全手工绘制，如果有合适的图片素材可以用来制作按钮元件。本案例就是使用现有的图片来制作按钮元件，各图片如图36(a)~(d)所示。


图36制作按钮元件的图片素材


① 新建一个采用ActionScript 3.0脚本技术的常规Animate文档，然后保存该文档为“案例3.3.fla”。
② 执行“插入”→“新建元件”命令，在打开的“创建新元件”对话框中输入名称为faceButton并调整类型为“按钮”，然后单击“确定”按钮完成新元件的创建。
③ 选中按钮元件时间轴的“弹起”帧，然后执行“文件”→“导入”→“导入到舞台”命令，通过“导入”对话框找到并选中相应的素材文件(例如Face4.png)，单击“打开”按钮完成素材的导入。
说明： 如果多个素材文件命名中有编号特征(例如此例中的Face4.png、Face5.png、Face6.png等)，Animate会询问是否一同导入，如果决定一同导入，则相应的多个图片素材会被导入连续的多个帧上，每个帧上放置一个图片素材。
④ 重复步骤③并分别在按钮元件的“指针经过”“按下”“点击”帧上放置相应的图片素材。
⑤ 单击舞台上方的“编辑栏”左侧的按钮返回主场景舞台，然后打开“库”面板，将faceButton元件拖到舞台上，并测试影片观察按钮的交互效果。
3.1.4创建影片剪辑元件
影片剪辑元件同样可以从库中取出并反复使用，特别之处在于其自身包含动画效果，可以不依赖主时间轴而自动播放。
影片剪辑元件的制作与普通Animate动画的制作几乎完全相同，唯一的区别是它可以很方便地重复使用。


视频讲解


【案例3.4】制作旋转的雪花。
① 新建一个采用ActionScript 3.0脚本技术的常规Animate文档，然后保存该文档为“案例3.4.fla”。
② 在舞台上制作“雪花”的图案（见图37(d)），制作过程如下所述。
 通过文档“属性”面板调整“舞台”的背景颜色为蓝色(#0000FF)。
 在工具箱中选择“多角星形工具”，设置笔触颜色为白色且无填充，“笔触”的粗细适当。调整“选项”为六边形后绘制一个六边形。
 执行“视图”→“贴紧”→“贴紧到对象”命令，开启该贴紧功能，然后使用“线条工具”绘制3条对角线及一条从中心到一边中点的线，完成后如图37(a)所示。
 选择“选择工具”，向内调整边的中心点，然后复制并调整相应线条制作出“雪花”的一瓣，完成后如图37(b)所示。


图37“雪花”图形的制作过程



 使用“选择工具”删除六边形的其余5条边并选中需要复制的“雪花”的一瓣，然后使用“任意变形工具”调整变形中心的位置到六边形的中心处，完成后如图37(c)所示。
 打开“变形”面板，调整“旋转”角度为60°，然后单击“重制选区和变形”按钮直到“雪花”的形状完整，最终效果如图37(d)所示。
③ 使用“选择工具”选中“雪花”形状，然后执行“修改”→“转换为元件”命令，在“转换为元件”对话框中输入元件的“名称”为Snow，选择元件的“类型”为图形，单击“确定”按钮创建元件。
④ 执行“插入”→“新建元件”命令，在“创建新元件”对话框中输入元件的“名称”为rSnow，选择“类型”为影片剪辑，单击“确定”按钮创建影片剪辑元件。
⑤ 在影片剪辑的第1帧上放置图形元件Snow，在第2、第3帧上放置图形元件Snow并分别旋转20°、40°。
⑥ 单击舞台上方的“编辑栏”左侧的按钮返回主场景舞台，然后打开“库”面板，将rSnow影片剪辑元件拖到舞台上，并测试影片观察动画效果。
3.1.5转换元件
元件可以从无到有地创建，也可以根据现有的内容转换得到。将现有内容转换为元件的具体过程如下所述。
(1) 在舞台上选择一个或多个元素，然后执行下列操作之一。
① 执行“修改”→“转换为元件”命令。案例3.4中的步骤③使用的就是这种方法。
② 将选中的内容拖曳到“库”面板上。
③ 在选中的内容上右击，然后在弹出的快捷菜单中执行“转换为元件”命令。
(2) 在“转换为元件”对话框中输入元件名称并选择元件类型。
(3) 在“对齐”右侧的注册网格中单击，以便调整元件的注册点。
(4) 单击“确定”按钮。
Animate会将该元件添加到库中，同时舞台上原先选定的元素变成该元件的一个实例。在创建元件后，仍可以通过执行“编辑”→“编辑元件”命令在元件编辑模式下编辑该元件，也可以通过执行“编辑”→“在当前位置编辑”命令在舞台的当前位置编辑该元件。
3.1.6“库”面板的组成
“库”是存放所有动画资源的地方，“库”面板则是管理这些资源的应用窗口。资源始终保存在fla文件中，所以库又分为内置库（当前文件）和外部库（其他文件）两种。图38所示为打开“案例3.3”后“库”面板的界面截图。



图38“库”面板


“库”面板从上到下共有4个区域。
最上方是文件列表框，其中列出了所有打开的Animate文档，通过该列表框可以很方便地选用各Animate文档中的元件或素材。文件列表框右侧
有一个“固定当前库”按钮，可以将库面板中的内容固定，使其不随文档的切换而改变，方便将资源用于其他文档。旁边还有一个“新建库面板”按钮，通过该按钮可以同时打开多个“库”面板窗口，这在分类汇总动画资源时非常实用。

文件列表框的下方为资源预览区，选中的资源在此处显示其预览信息。资源预览区下方有一个搜索框，可依据资源名称在库中查找素材。搜索框下方是资源列表框，在文件列表框中选中的Animate文档中的所有资源都会列在这里，单击相应资源会看到资源的预览，双击资源会进入资源编辑窗口或者显示资源的描述信息。

“库”面板的左下方有4个按钮，其中，“新建元件”按钮实现创建新元件的功能，“新建文件夹”按钮实现资源分组的功能，“属性”按钮实现资源描述信息的查看与修改，“删除”按钮用于删除库中不再需要的资源。
3.1.7动画资源的共享
Animate中的资源都存储在库中，每个Animate文档的资源都存储在自己的内置库中。在打开多个Animate文档后，这些文档中的资源可以共用，这是最基本的资源共享方式。


视频讲解


【案例3.5】在案例3.3和案例3.4之间共享资源。
① 在Animate中打开“案例3.3.fla”和“案例3.4.fla”。
②  切换到“案例3.4”文档窗口并打开“库”面板，在“库”面板上方的文件列表框中选择“案例3.3”，则在“库”面板下方的资源列表中会看到“案例3.3”的所有资源。
③  从“库”面板(图38所示)中拖曳faceButton到舞台上并用“任意变形工具”调整舞台上对象的位置和大小，图39可供参考。
说明： 拖曳操作会使另一文件库中的资源被复制到当前文件的库中(如图310所示)，同时会在舞台上创建对象的一个实例。
④  将Animate文档另存为“案例3.5.fla”，测试影片观察效果。


图39在Animate文档间共享资源





图310“案例3.4”的内置库



Animate文档自己库中的资源可以称为内置库，设计者还可以建立自己的外部“库文件”。外部库其实就是一个普通的FLA文件，该文件也有自己的库资源，只需要将其与项目中的其他文件放置在一起，即可与其他动画文件共享资源。
设计者可以将自己制作或收集的资源放置在外部库文件中，可以随身携带，同时也方便使用。

3.2实例的创建与应用
创建元件之后，可以在文档中的任何地方(包括在其他元件内)创建该元件的实例。当用户修改元件时，Animate会更新元件的所有实例。
用户可以在“属性”面板中为实例提供名称。在ActionScript中使用实例名称引用实例。若要用ActionScript控制实例，需要为单个时间轴内的每个实例提供唯一的名称。
除非另外指定，否则实例的行为与元件的行为相同。另外，所做的任何更改只影响实例，并不影响元件。
3.2.1建立实例
创建元件实例的步骤如下所述。
(1) 在时间轴上选择某一个层。
Animate只允许将实例放在关键帧中，并且总在当前选中的图层上。如果没有选择关键帧，Animate会将实例添加到当前帧左侧的第一个关键帧上。
(2) 执行“窗口”→“库”命令，
打开“库”面板，以便从中选取元件等资源。如果该资源存在于其他库中，则需要通过“库”面板上方的文件列表框改变文件，或执行“窗口”→“公用库”命令。
(3) 将元件从库中拖到舞台上。
拖曳“库”面板中的元件到舞台上是最便捷的操作方法，当然也可以通过在“库”面板中复制并在舞台上粘贴的传统方法完成元件实例的创建。
读者可以使用本章前面的几个案例来练习元件实例的创建过程。
3.2.2转换实例的类型
若要在Animate应用程序中重新定义实例的行为，应更改实例的类型。例如，如果一个图形实例包含用户想要独立于主时间轴播放的动画，则可以将该图形实例重新定义为影片剪辑实例。下面介绍两种改变实例类型的方法。

图311改变实例类型


1. 打开“属性”面板

在舞台上选择实例，然后执行“窗口”→“属性”命令打开“属性”面板，如果该面板已经在软件界面中，则单击切换到该面板即可。
2. 改变实例类型
通过“属性”面板上方的“实例行为”类型列表选择“图形”“按钮”或“影片剪辑”，如图311所示。
3.2.3改变实例的颜色和透明效果
每个元件实例都可以有自己不同的色彩效果。使用“属性”面板可以设置实例的颜色和透明度选项，这些设置也会影响放置在元件内的位图。
当在某关键帧中改变一个实例的颜色和透明度时，改变的结果会在该关键帧上立刻体现出来。通过在不同关键帧上设置不同的颜色和透明度选项，再结合使用补间动画就可以实现实例的渐变效果动画。
说明： 如果对包含多帧的影片剪辑元件应用色彩效果，Animate会将该效果应用于该影片剪辑元件中的每一帧。
设置实例颜色和透明效果的过程如下所述。
(1) 在舞台上选择实例并打开“属性”面板。
如果“属性”面板未出现在软件界面中，则可执行“窗口”→“属性”命令打开“属性”面板。
(2) 在“属性”面板的“色彩效果”区的“样式”下拉菜单中选择下列选项之一，如图312所示。

① 亮度： 调节图像的相对亮度或暗度，度量范围是从黑(-100%)到白(100%)。若要调整亮度，可以单击并拖曳三角形滑块，也可以在对应的框中输入数值来完成。
② 色调： 用相同的色相为实例着色。若要设置色调百分比(从0%完全透明到100%完全饱和)，使用“属性”面板中的色调滑块。若要调整色调，单击此三角形并拖曳滑块，或者在框中输入一个值。若要选择颜色，在各自的框中输入红、绿和蓝色的值，或者单击“着色”控件(图312右上方的色块)，然后从“颜色选择器”中选择一种颜色。
③  Alpha： 调节实例的透明度，调节范围是从完全透明(0%)到完全饱和(100%)。若要调整Alpha值，单击此三角形并拖曳滑块，或者在框中输入一个值。
④ 高级： 分别调节实例的红色、绿色、蓝色和透明度值(如图313所示)。对于在位图这样的对象上创建和制作具有微妙色彩效果的动画，此选项非常有用。左侧的控件使用户可以按指定的百分比降低颜色或透明度的值； 右侧的控件使用户可以按常数值降低或者增大颜色或者透明度的值。
在“高级”选项中，当前的红、绿、蓝和Alpha的值都乘以百分比值，然后加上右列中的常数值，产生新的颜色值。例如，当前的红色值是100，若将左侧的滑块设置为50%并将右侧滑块设置为101，如图313所示，则会产生一个新的红色值151(计算方法是100×50%＋101＝151)。



图312“色彩效果”选项




图313色彩效果的“高级”选项



说明： “样式”中的“高级”设置执行函数(a*y+b)=x，其中，a是框左侧设置中指定的百分比，y是原始位图的颜色，b是框右侧设置中指定的值，x是生成的效果(RGB介于0~255，Alpha透明度介于0~100)。


视频讲解


【案例3.6】
制作渐隐的雪花飘落效果。
① 新建一个Animate文档，调整舞台背景为蓝色(#0000FF)，然后将文档保存为“案例3.6.fla”。
② 执行“文件”→“导入”→“打开外部库”命令，通过“作为库打开”窗口找到“案例3.4.fla”文件，并将其作为外部库导入。
③ 选中时间轴的“图层1”的第1帧，将“库案例3.4”面板的“旋转雪花”元件拖到舞台上，即创建一个雪花实例，然后移动雪花实例至舞台上方某处并通过“任意变形工具”调整雪花的大小。
④ 选中时间轴的“图层1”的第60帧，执行“插入”→“时间轴”→“关键帧”命令(该命令的快捷键为F6)，然后在该关键帧上调整雪花的位置到舞台的下方某处并调小雪花的大小。
⑤ 选中第60帧上的雪花实例，在“属性”面板的“色彩效果”区中调整“样式”为Alpha，并将其值调整为0，如图314所示。

图314调整雪花的Alpha值

⑥ 右击时间轴的第1帧，并在快捷菜单中选择“创建传统补间”命令。
⑦ 保存并测试影片，观察雪花旋转着飘落并逐渐消失的动画效果。
3.3对象的变形与操作
对象添加到舞台后，可以通过工具箱中的“任意变形工具”对其进行变形操作。使用“任意变形工具”选中某个对象后，在对象上会出现变形控制框，如图315(a)所示。变形操作主要包括以下3种，如图315(b)~(d)所示。


图315对象的变形操作



1. 缩放变形
对象的四周有8个变形控制点，通过4条边中点的控制点可以改变对象的宽度或高度，通过4个角的控制点可以自由变换对象的宽度和高度。将鼠标靠近这些控制点时鼠标指针会变成、或等指示形状，图315(b)为宽度变化后的雪花形状。
说明： 在变形过程中，按住Alt键可以改变变形的参考点。变形参考点主要有对象的中心点和对边(角)两种。在拖曳4个角的控制点缩放时，按住Shift键可以确保缩放后的高宽比不发生变化。
2. 旋转变形
当从外部靠近对象的4个角时会出现类似的鼠标指针提示，此时单击并拖曳鼠标可以实现对象旋转变形的效果。
对象的中心有一个白色的控制点，该控制点是对象旋转变形的默认旋转中心。若要改变旋转中心，只需在旋转前调整该控制点的位置即可。图315(c)为自由旋转后的结果。
说明： 在旋转变形的过程中，按住Alt键可以改变旋转的中心点。变形参考点主要有对象的中心点和对角点两种。在旋转的过程中按住Shift键可以确保旋转45°、90°及135°等特殊的角度。
3. 剪切变形
当鼠标从外部靠近控制框的4条边时，鼠标指针会变成类似或的形状，这就是剪切变形的提示指针。此时单击并拖曳鼠标即可实现剪切变形的操作，图315(d)即为执行完垂直剪切变形后的效果。
3.4对象的修饰
在对象绘制到舞台上以后，还可以使用不同的工具进行修改和调整，主要的工具有“选择工具”、“部分选取工具”、“颜料桶工具”、“墨水瓶工具”和“封套工具”。
1. 选择工具和部分选取工具
选择工具可以很方便地调整对象的笔触和填充，部分选取工具则可以较精细地调整对象的外形轮廓。通过前面章节的内容及案例，读者应当对它们有了较深的了解。


图316用“选择工具”修饰对象

图316即是使用“选择工具”在两个圆形状的基础上制作的“元宝”形状，整个过程仅是在不断调整圆的笔触线形状。

部分选取工具和选择工具的主要区别是其只能对笔触轮廓进行修改，通过修改轮廓上的控制点位置及其曲率方向和大小可以精细地调整轮廓的形状。
2. 颜料桶工具和墨水瓶工具
颜料桶工具用于控制对象内部的填充特征，可以用纯色、渐变或位图填充的方式影响对象的填充部分。墨水瓶工具用于控制对象的笔触轮廓特征，同样可以用纯色、渐变或位图填充的方式影响对象的轮廓线特征。


图317“文本工具”选项




视频讲解


【案例3.7】制作描边和填充的文字内容。
文字添加到舞台上后默认是一个整体对象，无法独立控制其中细部的动画效果。如果需要独立控制，则需要将文字分离使其变成类似合并绘制类的形状，之后就可以改变其笔触的线条和填充的效果了。
① 新建一个Animate文档并将其保存为“案例3.7.fla”。
② 选择工具箱中的“文本工具”，参考图317调整工具的各选项，然后在舞台上添加文字内容(例如“绚丽的彩虹文字”)，添加后的文本如图318(a)所示。


图318最初的文本对象


说明： 舞台上的文本对象被选中后，可通过“属性”面板对其各个选项进行调整。
③ 使用“选择工具”选中舞台上的文本对象，然后两次执行“修改”→“分离”命令，得到类似合并绘制形式的文字形状，如图318(b)所示。
④ 在工具箱中选择“墨水瓶工具”并调整笔触为红色(#FF0000)，然后在文字或其笔画的外边缘单击为其添加红色的描边效果(见图319(a))，注意不要忽略任何的内外部的笔画轮廓。
⑤ 换用“颜料桶工具”并通过“样本”面板调整填充颜色为彩虹渐变色，然后将其填充在文字形状的内部，完成后的效果如图319(b)所示。


图319描边并填充文本形状




图320使用“封套工具”调整


3. 封套工具
封套工具需要通过执行“修改”→“变形”→“封套”命令打开。该工具与“部分选取工具”在调整方法上是非常相似的，它也是调整控制点的位置及其曲率的方向与大小。不同之处是封套工具针对的是对象所覆盖的矩形区域，而部分选取工具针对的是对象的轮廓线。
图320所示即在使用“封套工具”调整过程中的状态，其中方点为形状控制点，圆点为曲率控制点。

3.5“对齐”面板与“变形”面板的使用
在制作舞台对象时，经常需要舞台上的多个对象按某种方式排列整齐，或者使其大小按某种方式保持一致，这就需要使用“对齐”面板，如图321(a)所示。


图321“对齐”和“变形”面板


与3.3节使用“任意变形工具”改变对象的形状类似，对象的变形操作也可以借助“变形”面板来实现，如图321（b)所示。使用“变形”面板除了能实现普通的变形之外，还可以实现对象的3D旋转，从而能以平面的方式描述3D投影的效果。


视频讲解



【案例3.8】利用“对齐”面板制作电影胶片效果。
① 新建一个Animate文档，设置舞台背景为黑色并将文档保存为“案例3.8.fla”。
② 选中“图层1”在时间轴上的第1帧，选择“基本矩形工具”并调整笔触为黑色、填充为白色，然后在舞台的左上角绘制一个正方形。
③ 换用“选择工具”选中该正方形，复制并粘贴10次(注意粘贴的所有形状都叠放在舞台的中央)。
④ 拖曳舞台中央的一个正方形至舞台的右上角位置，然后选中舞台上所有的正方形，并打开“对齐”面板，依次单击其中的“顶对齐”按钮和“水平居中分布”按钮，完成后的效果如图322(a)所示。


图322制作电影胶片效果


⑤ 选中制作好的11个正方形复制并粘贴1次，然后将新得到的11个正方形整体移动到与另一组正方形上下对称并左对齐的位置上，完成后的效果如图322(b)所示。
⑥ 新建一个图层并选中“图层2”时间轴的第1帧，然后导入一幅图像到舞台上，移动图像的位置至舞台的右外侧。
⑦ 在两个图层的第60帧插入关键帧，然后移动第60帧上图像的位置至舞台的左外侧，并在“图层2”中创建传统补间动画。
⑧ 保存并测试动画效果，图322(c)为测试中某时刻的画面，可供读者在制作时参考。


视频讲解



【案例3.9】利用“变形”面板绘制向日葵的花朵。
① 新建一个Animate文档并将文档保存为“案例3.9.fla”。
② 选择“椭圆工具”并调整笔触为无，然后通过“颜色”面板调整填充颜色为“线性渐变”并设置起始色为#A63300，终止色为#FFFF66，在舞台上绘制一个椭圆形的花瓣，如图323(a)所示。


图323制作向日葵花朵


③ 选择“任意变形工具”并选中舞台上的花瓣，然后向下调整花瓣的旋转中心点的位置(对象中的“句号”形状)，调整后的结果可参考图323(a)。
④ 打开“变形”面板，然后调整面板中的旋转角度为15°并立即单击“重制选区和变形”按钮，直到花瓣布满一周为止。旋转变形中的状态及最终效果如图323(b)和(c)所示。
3.6外部素材的导入
Animate动画制作所需要的素材并非全部由设计者全新制作得到，如果有合适的图像、声音、视频或者Animate文档等现成的素材可用，那么将它们以外部素材导入是最经济、高效的方式。
外部素材的导入需要执行“文件”→“导入”命令，该命令有4种导入方式，简要说明如下所述。
(1) 导入到舞台： 通过“导入”对话框导入外部素材到当前文档的“库”中，同时会在舞台上为每个素材创建各自的实例。如果一次导入的是多个外部素材，则Animate在创建舞台实例时会将每个实例放置在连续相邻的多个关键帧上。
(2) 导入到库： 通过“导入到库”对话框导入外部素材到当前文档的“库”中，设计者可以在以后需要的时候再手动在舞台上创建其实例。
(3) 打开外部库： 关于“外部库”的说明可参考3.1.7节。如果需要将现有的FLA文档作为外部库来使用，可以使用此方式将其导入。
(4) 导入视频： 通过“导入视频”对话框导入外部视频文档到当前文档的“库”中，设计者可以在需要的时候使用它们。
3.6.1导入图片


视频讲解


【案例3.10】制作金陵十二钗动画效果。
① 新建一个Animate文档并将其保存为“案例3.10.fla”。
② 执行“文件”→“导入”→“导入到库”命令，将“金陵十二钗”图片导入库中。
③ 根据图片的大小调整舞台大小为“600×450像素”，并调整帧频为1fps。
④ 将12张图片逐一放置到第1~12帧的舞台上，期间需要执行“插入”→“时间轴”→“空白关键帧”命令，因为只有“空白关键帧”和“关键帧”才能在舞台上添加对象。
⑤ 在每一帧中将图片对齐到舞台的中央。方法是选中舞台上的图片，然后单击“对齐”面板中的“水平中齐”按钮和“垂直中齐”按钮(注意，先选中“与舞台对齐”复选框)。
⑥ 单击“时间轴”面板中的“新建图层”按钮创建“图层2”，然后在“图层2”的第1帧上将“库”中的“高山流水”素材放置到舞台上，并设置该帧的同步选项为“开始”，重复为“1”。
⑦ 保存并测试影片，观察播放的效果。
3.6.2导入声音
声音可以用作动画短片的背景音乐，也可以用作动画中的配音效果。声音素材可以通过录制、剪辑的方式得到，也可以通过网络获得。
执行“文件”→“导入”→“导入到库”命令可以将声音素材导入库中，之后可以在需要时将声音添加到时间轴上。声音与其他舞台对象一样需要放置到独立的层上。


视频讲解


【案例3.11】制作小车碰撞动画。
① 新建一个Animate文档并将其保存为“案例3.11.fla”。
② 分别制作“地面及障碍”“小车”和“货物” 3个影片剪辑元件，具体形状可参考图324(a)~(c)。


图324制作动画元件


③ 创建3个图层，分别将图层重命名为“地面”“小车”“货物”，并将3个元件分别放置到对应层的舞台上，调整它们在舞台上的位置，如图325所示。


图325动画的初始状态


④ 在“地面”层的第67帧插入“帧”，并以此确定整个动画的时长。
⑤ 定义“小车”层上的动画效果。在“小车”层的第40帧处插入“关键帧”，调整该帧上小车的位置以及与障碍物碰撞接触的状态。最后右击“小车”层的第1帧并创建传统补间添加小车的平移动画。
⑥ 定义“货物”层上的动画效果。选择工具箱中的“任意变形工具”并调整“货物”对象的变形中心点至其右下角的位置。在“货物”层的第40帧插入“关键帧”，调整货物的位置(注意保持与小车的相对位置不变)； 在“货物”层的第48帧插入“关键帧”并用“任意变形工具”向右旋转“货物”将其平放； 在“货物”层的第60帧插入“关键帧”并移动货物至与障碍物碰撞接触的位置。最后分别右击“货物”层的第1帧、第40帧和第48帧并创建传统补间为货物创建动画效果。
⑦ 为碰撞效果配音。执行“文件”→“导入”→“导入到库”命令，将事先准备好的“碰撞”和“摩擦”声音导入库中。然后新建一个图层并将其重命名为“声音”，在“声音”层的第40帧、第48帧和第60帧的舞台上分别添加“碰撞”“摩擦”“碰撞”声音，并在声音的“属性”面板中设置效果为“淡出”，同步为“事件”，重复为“1”。
⑧ 保存并测试影片，观察播放的效果。
3.7Animate动画的分发
Animate动画作品制作完成后的成果，可以通过两种方式与他人分享，一种称为导出，另一种称为发布。
3.7.1导出
Animate动画导出的目的是制作可以再利用的资源，通过执行“文件”→“导出”命令，可以制作图像、影片和视频3种类型的资源。
1. 导出图像
执行“文件”→“导出”→“导出图像”命令，可以将播放头所在时刻的舞台画面保存为一幅图像，图像格式可以是JPEG图像、GIF图像、PNG图像或者SVG图像。不同格式的图像有不同的格式参数，设置好图像参数并单击“确定”按钮即可。
2. 导出影片
执行“文件”→“导出”→“导出影片”命令，可以将整个Animate动画导出为SWF影片、GIF动画以及JPEG序列、GIF序列和PNG序列。
SWF影片可以在网站制作时使用，也可用于其他目的；  GIF动画的应用场景也非常广泛，最典型的应用就是软件聊天时的动画表情； 3种图像序列则在影视后期合成时有广泛的应用。
3. 导出视频
执行“文件”→“导出”→“导出视频”命令，可以将Animate动画导出为QuickTime(.mov)格式的传统视频，这个过程需要用到Adobe Media Encoder这一编码工具。
图326展示了导出时的选项设置。


图326导出时的选项设置


3.7.2发布
Animate动画发布的主要目的是生成以网页形式查看的动态内容，通常是一个SWF影片和一个HTML网页文件。将发布的文件全部复制到网站的某个位置，然后添加超链接即可被网站用户访问，非常方便。
1. 发布设置
Animate动画发布之前通常要检查或调整相关的发布选项，可以通过执行“文件”→“发布设置”命令来完成。“发布设置”的各项设置如图327所示，其中最重要的就是Flash(.swf)的设置和HTML包装器的设置。


图327发布设置


(1) Flash(.swf)的设置： 与SWF影片相关的发布选项，主要包括品质、压缩、安全和硬件加速等内容。
(2) HTML包装器的设置： 主要设置SWF影片在网页中播放的相关选项，主要包括画面大小、播放控制、品质以及缩放对齐等内容。

2. 发布命令
在检查完“发布设置”选项后，就可以发布Animate动画了。执行“文件”→“发布”命令即可将结果发布到指定的文件夹下。当然，也可以在调整好“发布设置”选项后，直接单击“发布设置”窗口下方的“发布”按钮，完成Animate动画的发布。注意还必须将发布的结果放置到网站的某个位置并添加超链接，才可以在网站中被用户访问。
习题
1. 创建一个图形元件，根据自己的实际能力，可以完全手绘也可以依靠现有的素材。
2. 创建一个按钮元件，熟悉按钮元件的特点，然后在舞台上使用该元件并观察按钮的效果。
3. 创建一个影片剪辑，例如蜻蜓、齿轮、弹跳的对象、开关的动画等。
4. 创建一个相对复杂的动画，在动画中使用“库”中的各种素材、元件展示一个动画主题，练习“库”面板的使用与管理。