项目三　帧与图层的应用

项目引入

动画与电影、电视一样，都是根据视觉原理制作而成的。人的眼睛具有“视觉暂留”的特性，也就是说，人的眼睛看到一个物体后，该物体图像会短时间内停留在眼睛的视网膜上，不会马上消失。利用这一原理，在一幅图像还没有消失之前将另一幅图像呈现在人的眼前，就会造成一种连续变化的效果。

Flash动画由一幅幅画面组成，实际上每一幅画面就是一个帧。一套完整的Flash动画就是由许多帧组成的，播放时依次显示每个帧中的内容。连续播放这些帧，就可以实现所要表达的动画效果。帧越多，动画需要播放的画面也越多，播放的内容越多，时间就越长。

帧在Flash动画中的作用和电影胶片在电影中所起的作用类似，可以表现画面的内容，而且在帧中还能添加帧标签或Action语句，对Flash动画中的相关元件进行运算或控制。

任务一　时　间　轴

1. 熟悉时间轴面板

【时间轴】面板位于舞台的下方，通过对时间轴上关键帧的制作，Flash会自动生成运动中的动画帧，节省了制作人员的大部分时间，也提高了效率。使用鼠标光标拖动播放头可以实现对动画的观察，也可按【Enter】键实现播放头从左向右的自动播放。

时间轴的主要组件是图层、帧和播放头。时间轴顶部的时间轴标题指示帧编号。播放头指示当前舞台中显示的帧。在时间轴的底部显示时间轴状态，指示所选的帧编号、当前帧频及到当前帧为止的运行时间，如图3-1所示。

2. 设置时间轴

1) 更改时间轴的外观

若要增长或缩短图层名字段，则可拖动时间轴中分隔图层名和帧部分的栏。

要调整时间轴的大小，可执行以下操作之一。

(1) 如果时间轴停放在主应用程序窗口，则可拖动分隔时间轴和舞台区域的栏。

(2) 如果时间轴没有停放在主应用程序窗口，则可拖动右下角的水平状态条。

2) 移动播放头

若要转到某帧，则可单击该帧在时间轴标题中的位置，或者将播放头拖到所需的位置。

若要使时间轴以当前帧为中心，可单击时间轴底部的【帧居中】按钮。

3) 更改时间轴中的帧显示

单击时间轴右上角的【帧视图】按钮，显示【帧视图】下拉菜单。从弹出的下拉菜单中进行选择，如图3-2所示。

要更改帧单元格的宽度，可选择【很小】、【小】、【标准】、【中等】或【大】命令(帧宽度设置对于查看声音波形的详细情况很有用)。

要减小帧单元格行的高度，可选择【小】命令。

要打开或关闭用彩色显示的帧的顺序，可选择【彩色显示帧】命令。

要显示每个帧的内容缩略图(其缩放比率适合时间轴帧的大小)，可选择【预览】命令。这可能导致内容的外观大小发生变化。

要显示每个完整帧(包括空白空间)的缩略图，可选择【关联预览】命令。如果要查看动画期间元素在其帧中的移动方式，此选项非常有用，但是这些预览通常比【预览】命令生成的小。

任务二　帧

1. 帧的类型

Flash使用帧来组织和控制文档的内容。帧是进行Flash动画制作的最基本的单位。时间轴上，每个小方格代表一个帧，每个帧都包含需要显示的所有内容，包括图形、声音、各种素材和其他多种对象。

最常用的帧包含关键帧、空白关键帧、普通帧和过渡帧等几种，它们在时间轴中各自的表示方法如图3-3所示。

1) 关键帧

在动画制作过程中，某一时刻需要定义对象的某种新状态，这个时刻所对应的帧称为关键帧。

关键帧是变化的关键点，如补间动画的起点和终点，以及逐帧动画的每个帧都是关键帧。关键帧数目越多，文件就越大。所以，同样内容的动画，逐帧动画的内容比补间动画的多得多。

实心圆点是有内容的关键帧，即实关键帧。无内容的关键帧，即空白关键帧，用空心圆点表示。每层的第一帧被默认为空白关键帧，可以在上面创建内容，一旦创建了内容，空白关键帧就变成实关键帧。

2) 普通帧

普通帧也称为静态帧，在时间轴中显示为一个个矩形单元格。无内容的普通帧显示为空白单元格，有内容的普通帧显示出一定的颜色。例如，关键帧后面的普通帧显示为灰色。

关键帧后面的普通帧将继承该关键帧的内容。例如，制作动画背景，就是将一个含有背景图案的关键帧的内容通过普通帧来延续，直到显示结束，如图3-4所示。

3) 过渡帧

过渡帧实际上也是普通帧。过渡帧虽然包括许多帧，但其中至少要有两个帧：起始关键帧和结束关键帧。起始关键帧用于决定动画主体在起始位置的状态，而结束关键帧用于决定动画主体在终点位置的状态。

在Flash中，利用过渡帧可以制作两类过渡动画，即运动过渡动画和形状过渡动画。不同颜色代表不同类型的动画，此外，还有一些箭头、符号和文字等信息，用于识别各种帧的类别，可以通过表3-1所示的方式区分时间轴上的动画类型。

注意：同一层中，在前一个关键帧的后面任意帧处插入关键帧，即可复制前一个关键帧上的对象，并可对其进行编辑操作；如果插入普通帧，则可延续前一个关键帧上的内容，不可对其进行编辑操作；如果插入空白关键帧，则可清除该帧后面的延续内容，可以在空白关键帧上添加新的实例对象。

在关键帧和空白关键帧上都可以添加帧动作脚本，在普通帧上则不能。

2. 对帧的相关操作

在时间轴中，可以处理帧，并按照设定的顺序进行排列。还可以通过在时间轴中拖动关键帧来更改补间动画的长度。

1) 创建帧

(1) 创建关键帧主要有以下几种方法。

① 选中需要创建关键帧的帧格，按【F6】键创建关键帧。

② 选中需要创建关键帧的帧格，单击菜单栏中【插入】|【时间轴】|【关键帧】命令。

③ 右击要插入关键帧的帧格，在弹出的快捷菜单中选择【插入关键帧】命令。

(2) 创建普通帧主要有以下几种方法。

① 选中需要创建普通帧的帧格，按【F5】键创建普通帧。

② 选中需要创建普通帧的帧格，单击菜单栏中【插入】|【时间轴】|【帧】命令。

③ 右击要插入普通帧的帧格，在弹出的快捷菜单中选择【插入帧】命令。

(3) 创建空白关键帧主要有以下几种方法。

① 选中需要创建空白关键帧的帧格，按【F7】键创建空白关键帧。

② 右击要插入空白关键帧的帧格，在弹出的快捷菜单中选择【插入空白关键帧】命令。

③ 如果前一个关键帧中有内容，则选中要插入空白关键帧的帧格，单击菜单栏中【插入】|【时间轴】|【空白关键帧】命令；如果前一个关键帧中没有内容，则直接插入关键帧即可得到空白关键帧。

2) 选择帧

在Flash中可以选择单帧，也可以选择多帧，其方法如下。

(1) 选择单帧。在时间轴上单击要选择的帧格。被选中的帧格以黑色显示。

(2) 选择多帧。其又包含以下几种方法。

①连续多选：先选中第一个帧，然后按【Shift】键并单击需要选择的最后一个帧，或者拖动鼠标光标直到最后一个帧。

②不连续多选：先选中第一个帧，然后按【Ctrl】键并单击其他需要选择的帧格即可。

③选择某图层所有帧：在图层区单击某一图层名称。

④选择时间轴上的所有帧：单击菜单栏中【编辑】|【时间轴】|【选择所有帧】命令。

3) 移动帧

在动画制作过程中，有时需要对帧进行移动。移动帧的方法有以下两种。

(1) 拖动移动：选中要移动的帧，按鼠标左键并拖动到需要的位置，释放鼠标左键。

(2) 通过剪贴板移动：选中要移动的帧，执行【剪切帧】命令，在目标位置执行【粘贴帧】命令。

4) 复制帧

在动画制作过程中，有时需要对帧进行复制，其具体操作如下。

(1) 拖动复制：按【Alt】键并选中要复制的帧，拖动到需要的位置，释放鼠标左键。

(2) 通过剪贴板复制：选中要复制的帧并右击，在弹出的快捷菜单中选择【复制帧】命令。右击目标帧格，在弹出的快捷菜单中选择【粘贴帧】命令。

5) 删除帧

制作动画时，如果创建的帧不符合要求或不再需要，则可以将其删除。选中要删除的帧并右击，在弹出的快捷菜单中选择【删除帧】命令。

6) 清除帧

制作动画时，如果不再需要所创建的帧中的内容，则可以将内容清除。选中要清除的帧并右击，在弹出的快捷菜单中选择【清除帧】命令，可以清除帧中的内容并将该帧转化为空白关键帧。

7) 翻转帧

如果要颠倒动画多个帧的播放顺序，可以进行翻转帧操作。在时间轴上选中要翻转的帧格，右击，在弹出的快捷菜单中选择【翻转帧】命令，将选中帧的播放顺序进行翻转。

8) 其他操作

(1) 要延长关键帧动画的持续时间，则可拖动关键帧，将其拖动到希望成为序列的最后一帧的位置。

(2) 要将关键帧转换为普通帧，可选择该关键帧，单击菜单栏中【编辑】|【时间轴】|【清除关键帧】命令，或者右击该关键帧，然后从上下文菜单中选择【清除关键帧】命令。所清除的关键帧及到下一个关键帧之前的所有帧的舞台内容，将被所清除的关键帧之前的帧的舞台内容替换。

(3) 要更改补间序列的长度，可将开始关键帧或结束关键帧向左或向右拖动。

(4) 要将项目从库中添加到当前关键帧中，可将该项目从【库】面板拖到舞台中。

3. 为平滑动画效果设置帧频率

帧频是指动画播放的速度，以每秒播放的帧数来度量。帧频太慢会使动画不连续，帧频太快会使动画变得模糊。网页上以12帧/秒为最佳；标准运动图像速度是24帧/秒。

要设置帧频，可执行以下其中一项操作。

(1) 单击菜单栏中【修改】|【文档】命令，在打开的【文档设置】对话框的“帧频”文本框中输入合适的帧频，如图3-5所示。

(2) 在【属性】面板的“属性”文本框中输入合适的帧频，如图3-6所示。

任务三　图　层

在Flash动画制作过程中，图层是一个非常重要的概念，灵活运用图层，可以帮助用户制作更多精彩的动画。

图层类似于一张透明的薄纸，每张纸上绘制一些图形或文字，而一幅作品就是由许多张这样的薄纸叠合在一起形成的。它可以帮助用户组织文档中的插图，可以在图层上绘制和编辑对象，而不会影响其他图层上的对象。

图层具有独立性，当改变其中任意一个图层的对象时，其他图层的对象保持不变。

Flash中图层包括正常图层、引导图层、被引导图层、遮罩图层、被遮罩图层及文件夹。

(1) 正常图层：系统默认的图层类型。

(2) 引导图层：动画中的对象在运动时的路径引导的图层，例如，某一图层中的小球沿路径运动，就要用到这个引导图层，如图3-7所示。

(3) 被引导图层：是一个与引导图层相关联的正常图层。

(4) 遮罩图层：就像是在对象上面遮着一个带有孔的图层，它常用于制作探照灯等动画效果，如图3-8所示。

(5) 被遮罩图层：该图层的内容只有在相应位置有遮罩对象时才可见，其他内容不可见。

(6) 文件夹：当图层过多时，可以使用图层文件夹，将图层放入文件夹中便于对图层进行管理。

在Flash中，因为图层具有不同的模式，所以它能够以不同的方式工作。图层具有四种模式，如图3-9所示。

当前模式：当前模式是指当前图层处于编辑状态，用户可以对该图层中的对象进行编辑。判别一个图层是否为当前模式的方法就是查看当前图层名称栏是否显示一个铅笔图标。

隐藏模式：它的作用是将某个图层隐藏后，用户在编辑该图层以外的图层时，被隐藏的图层不受影响。虽然被隐藏的图层在场景中看不到对象，但在发布.SWF文件时，都会保留.FLA文档中的任何隐藏图层，并可在.SWF文件中看到。

锁定模式：它的作用是将一个或多个图层锁定后，无法对其进行修改，但是在场景中依然可以看到它。

轮廓模式：选择该模式后，只显示图层中对象的轮廓。在图层的名称栏上的彩色方块轮廓的颜色就是该图层中对象的轮廓颜色。

创建与编辑图层

1) 创建图层和图层文件夹

创建图层

(1) 单击时间轴底部的【新建图层】按钮。

(2) 单击菜单栏中【插入】|【时间轴】|【图层】命令。

(3) 右击时间轴中的一个图层名称，然后从快捷菜单中选择【插入图层】命令。

创建图层文件夹

(1) 在时间轴中选择一个图层或文件夹，然后单击菜单栏中【插入】|【时间轴】|【图层文件夹】命令。

(2) 右击时间轴中的一个图层名称，然后从快捷菜单中选择【插入文件夹】命令。新文件夹将出现在所选图层或文件夹的上面。

2) 编辑图层和图层文件夹

默认情况下，新图层是按照创建它们的顺序命名的，如图层1、图层2，依此类推。重命名图层可更好地反映它们的内容。

选择图层或文件夹

(1) 单击时间轴中图层或文件夹的名称。

(2) 在时间轴中单击要选择的图层的任意一个帧。

(3) 在舞台中单击要选择的图层上的一个对象。

选择多个图层或文件夹

(1) 要选择连续的几个图层或文件夹，可按【Shift】键并单击时间轴中它们的名称。

(2) 要选择几个不连续的图层或文件夹，可按【Ctrl】键并单击时间轴中它们的名称。

锁定图层或文件夹

(1) 单击图层或文件夹名称右侧的【锁定】可以锁定它。再次单击【锁定】可以解锁该图层或文件夹。

(2) 单击挂锁图标可以锁定所有的图层和文件夹。再次单击它可以解锁所有的图层和文件夹。

(3) 在【锁定】中拖动可以锁定或解锁多个图层或文件夹。

(4) 按【Alt】键，单击图层或文件夹名称右侧的【锁定】，可以锁定所有其他图层或文件夹。再次按【Alt】键单击【锁定】可以解锁所有图层或文件夹。

重命名图层或文件夹

双击要重命名的图层名并进入文本编辑状态，在文本框中输入新名称后按【Enter】键确认。

复制图层

单击时间轴中的图层名称选择整个图层。单击菜单栏中的【编辑】|【时间轴】|【复制帧】命令，或者单击【添加图层】按钮创建新层。 单击该新图层，然后单击菜单栏中的【编辑】|【时间轴】|【粘贴帧】命令。

复制图层文件夹的内容

单击时间轴中文件夹名称左侧的三角形按钮可折叠它。单击文件夹名称可以选择整个文件夹。单击菜单栏中的【编辑】|【时间轴】|【复制帧】命令，或者单击菜单栏中的【插入】|【时间轴】|【图层文件夹】命令，创建新文件夹。单击该新文件夹，然后单击【编辑】|【时间轴】|【粘贴帧】命令。

删除图层或文件夹

(1) 单击时间轴中图层或文件夹的名称，选择图层或文件夹，或者单击图层中的任何帧进行选择。

(2) 单击时间轴中的【删除图层】按钮。

(3) 将图层或文件夹拖到【删除图层】按钮。

(4) 右击该图层或文件夹的名称，然后从快捷菜单中选择【删除图层】命令。

注意：删除图层文件夹之后，将会删除所有包含的图层及其内容。

深入解析

一个Flash工程文件(.fla)中可包含多个场景，一个场景只包含一个时间轴，一个时间轴可以包含多个图层，一个图层上可以有多个帧。

在制作动画时，时间轴窗口是调整动画播放速度和将对象放置到不同图层的地方。时间轴用于组织和控制动画在不同时间、不同图层和帧的内容。时间轴最重要的成分是帧、图层和播放头。

帧是动画的核心，它决定了动画在时间和动作上的所有内容，帧的数目和放映的速度决定了动画的整体长度。图层的作用主要是组织动画的各个部分，分离动画对象，使其相互不致发生擦涂、连接或分割。

同一图层中，在前一个关键帧的后面任一帧处插入关键帧，即可复制前一个关键帧上的对象，可对其进行编辑操作；如果插入普通帧，则可延续前一个关键帧上的内容，不可对其进行编辑操作；如果插入空白关键帧，则可清除该帧后面的延续内容，可以在空白关键帧添加新的实例对象。关键帧和空白关键帧都可以添加帧动作脚本，普通帧则不能。

在时间轴中按【F6】键插入关键帧，按【F7】键插入空白关键帧，按【F5】键延长关键帧或空白关键帧。有时，可以利用帧标签为动画做一些标记以便于编辑。方法是选择帧，然后在【属性】面板的帧标签位置输入标记数字或字母，相应的帧就会出现一面小红旗，小红旗后就是输入的作为标记的数字或字母。

综合实训——奔驰的骏马

知识准备

逐帧动画是一种常见的动画形式，其原理是在“连续的关键帧”中分解动画，也就是在时间轴的每帧上逐帧绘制不同的内容，使其连续播放而成动画。

因为逐帧动画的帧序列内容不一样，所以不但给制作增加了负担而且最终输出的文件内容也很大。但它的优势也很明显：逐帧动画具有非常大的灵活性，几乎可以表现任何想表现的内容，它类似于电影的播放模式，很适合于表演细腻的动画。例如，人物或动物急剧转身、头发及衣服的飘动、走路、说话，以及精致的3D效果等。

绘画纸是一项帮助定位和编辑动画的辅助功能，这项功能对制作逐帧动画特别有用。通常情况下，Flash 在舞台中一次只能显示动画序列的单个帧。绘画纸功能可以在舞台中一次查看两个或多个帧，如图3-10所示。

图3-10是使用绘画纸功能后的场景，从中可以看出，当前帧中内容用全彩色显示，其他帧内容以半透明显示，这使我们看起来好像所有帧内容是画在一张半透明的绘图纸上，这些内容相互层叠在一起。下面介绍绘画纸界面按钮的功能。

【绘图纸外观】按钮：单击此按钮，在时间轴的上方会出现绘图纸外观标记。拉动外观标记的两端，可以扩大或缩小显示范围。

【绘图纸外观轮廓】按钮：单击此按钮，场景中将显示各帧内容的轮廓线，填充色消失，它特别适合观察对象轮廓，另外可以节省系统资源，加快显示过程。

【编辑多个帧】按钮：单击此按钮，可以显示全部帧内容，并且可以进行“多帧同时编辑”。

【修改绘图纸标记】按钮：单击此按钮，弹出菜单，菜单中包含以下命令。

【总是显示标记】命令：无论绘图纸外观是否打开，总会在时间轴标题中显示绘图纸外观标记。

【锚定绘图纸】命令：会将绘图纸外观标记锁定在时间轴标题中的当前位置。通常情况下，绘图纸外观范围是和当前帧的指针及绘图纸外观标记相关的。通过锚定绘图纸外观标记，可以防止它们随当前帧的指针移动而变动。

【绘图纸2】命令：会在当前帧的两边显示两个帧。

【绘图纸5】命令：会在当前帧的两边显示五个帧。

【所有绘图纸】命令：会在当前帧的两边显示全部帧。

任务实施

任务目标：使用逐帧动画的方式制作奔驰的骏马。

具体操作步骤如下。

(1) 创建影片文档。单击菜单栏中的【文件】|【新建】命令，在弹出的面板中选择【常规】|【Flash文档】选项后，单击【确定】按钮，新建一个动画文档，在【属性】面板上设置文件大小为“550×400”像素，背景色设为“白色”，帧频设为“8.00”。如图3-11所示。

(2) 创建背景图层。选择第1帧，单击菜单栏中的【文件】|【导入】|【导入到舞台】命令，将背景图片导入舞台中。在第8帧按【F5】键，添加过渡帧使帧内容延续。

(3) 导入序列图片。新建图层，选择第1帧，单击菜单栏中的【文件】|【导入】|【导入到舞台】命令，在【导入】对话框中选择“骏马”系列图片中的第一个文件，单击【打开】按钮，如图3-12所示。

(4) 此时，会弹出一个对话框，如图3-13所示。

(5) 单击【是】按钮，Flash 会自动把.gif中的图片序列按序以逐帧形式导入，时间轴上会出现连续的关键帧，如图3-14所示。从左向右拉动播放头，就会看到一头骏马原地奔跑的景象。

(6) 锁定背景层。编辑多帧时，编辑的是场景中的全部对象。为了避免误操作，要将一些不需要编辑的图层进行锁定。单击背景图层1在【时间轴】面板小黄锁下方的黑点，对此图层进行加锁。

(7) 调整对象大小和位置。单击【时间轴】面板下方的【编辑多个帧】按钮，再单击【修改绘图纸标记】按钮，在弹出的菜单中选择【所有绘图纸】命令，如图3-15所示。

(8) 单击菜单栏中的【编辑】|【全选】命令，按住鼠标左键对场景中的对象进行拖动，并使用任意变形工具调整其大小，这样就可以一次调整8帧中全部图片的大小了。场景效果如图3-16所示。

(9) 为了表现骏马从左向右奔跑的景象，使用选择工具依次拖动各帧对象以改变相对位置。按【Enter】键就可以在场景中看到骏马奔跑的动画效果了。场景效果如图3-17所示。

(10) 测试存盘。单击菜单栏中的【控制】|【测试影片】|【测试】命令，观察动画有无问题。如果一帧一个动作显示速度过快，那么可在对象图层2的各个关键帧后插入一帧来减慢速度。这可以执行下列操作之一来完成。

① 在每个关键帧上按【F5】键(插入一帧)。

② 在要插入帧的地方单击，在弹出的快捷菜单中选择【插入帧】命令。

③ 在每个关键帧处单击【插入】|【时间轴】|【帧】命令。

(11) 同时在“图层1”的第16帧处按【F5】键插入帧。如图3-18所示。

(12) 按【Ctrl+Enter】键测试影片，观察动画效果。如果满意，单击菜单栏中的【文件】|【保存】命令，保存文件；如果要导出Flash的播放文件，单击菜单栏中的【文件】|【导出】|【导出影片】命令保存为.SWF文件。