第八章 动画的制作8.1 动画原理及分类8.1.1 动画原理将一系列单幅画面连续播放，使观看者产生“动”的错觉，这就是动画的原理Flash 动画的原理与电影的成像原理是一样的，同样是利用了人眼的暂存视觉（或视觉暂留）在Flash 中，一系列的单幅画面称为帧，动画的制作就是改变连续帧内容的过程帧代表着时刻，不同的帧代表不同的时刻，画面随着时间的推移逐个出现，就成了动画动画可以做成对象的移动、旋转和缩放，也可以是变色、变形和淡入淡出等效果动画可以是一种效果，也可以同时伴随多种效果8.1.2 动画分类在 Flash 中制作的动画，根据组成帧的形式的不同，可以分为逐帧动画 ( 即构成动画的每一帧的内容都是由一幅绘制的图像组成 ) 、补间动画 ( 利用关键帧处理技术得到的动画)补间动画又可分为运动补间动画和形状补间动画图 8.18.2 时间线和帧8.2.1 时间线概述时间轴用于组织和控制文档内容在一定时间内播放的层数和帧数与胶片一样，Flash 文档也将时长分为帧层就像堆叠在一起的多张幻灯胶片一样，每个层都包含一个显示在舞台中的不同图像时间轴的主要组件是层、帧和播放头文档中的层列在时间轴左侧的列中。
每个层中包含的帧显示在该层名右侧的一行中时间轴顶部的时间轴标题指示帧编号播放头指示在舞台中当前显示的帧时间轴状态显示在时间轴的底部，它指示所选的帧编号、当前帧频以及到当前帧为止的运行时间注意：在播放动画时，将显示实际的帧频；如果计算机不能足够快地显示动画，则该帧频可能与文档的帧频不一致图 8.2可以更改帧在时间轴中的显示方式，也可以在时间轴中显示帧内容的缩略图时间轴显示文档中哪些地方有动画，包括逐帧动画、补间动画和运动路径时间轴的层部分中的控件使您可以隐藏、显示、锁定或解锁层，以及将层内容显示为轮廓可以在时间轴中插入、删除、选择和移动帧也可以将帧拖到同一层中的不同位置，或是拖到不同的层中 更改时间轴的外观移动时间轴：从时间轴标题上的区域拖动时间轴将时间轴拖到应用程序窗口的边沿，停放它按住 Control 键拖动时将禁止时间轴停放要增长或缩短层名字段：拖动时间轴中分隔层名和帧部分的栏要调整时间轴的大小，请执行以下操作之一：• 如果时间轴停放在主应用程序窗口，请拖动分隔时间轴和应用程序窗口的栏• 如果时间轴没有停放在主应用程序窗口中，请拖动右下角移动播放头：播放头在时间轴上移动，指示当前显示在舞台中的帧。
时间轴标题显示动画的帧编号要在舞台上显示帧，可以将播放头移动到时间轴中该帧的位置如果正在处理大量的帧，而这些帧无法一次全部显示在时间轴上，则可以将播放头沿着时间轴移动，从而轻易地定位当前帧转到帧：单击该帧在时间轴标题中的位置，或将播放头拖到所需的位置要使时间轴以当前帧为中心：单击时间轴底部的“帧居中”按钮 更改时间轴中的帧显示：1、单击时间轴右上角的“帧视图”按钮，显示“帧视图”弹出菜单2、从下面的选项中进行选择： 要更改帧单元格的宽度，请选择“很小”、“小”、“正常”、“中”或“大”大”帧宽度设置对于查看声音波形的详细情况很有用 要减小帧单元格行的高度，请选择“短” 要显示每个帧的内容缩略图（其缩放比率适合时间轴帧的大小），请选择“预览”这可能导致内容的外观大小发生变化8.2.2 帧和关键帧我们知道，在 Flash 中，一系列的单幅画面称为帧，帧又分为关键帧和普通帧图 8.3关键帧是定义在动画中的变化的帧当创建逐帧动画时，每个帧都是关键帧在补间动画中，可以在动画的重要位置定义关键帧，让Flash 创建关键帧之间的帧内容。
Flash 通过在两个关键帧之间绘制一个浅蓝色或浅绿色的箭头显示补间动画的内插帧由于 Flash 文档保存每一个关键帧中的形状，所以只应在插图中有变化的点处创建关键帧关键帧在时间轴中标明：有内容的关键帧以该帧前面的实心圆表示，而空白的关键帧则以该帧前面的空心圆表示以后添加到同一层的帧的内容将和关键帧相同要创建关键帧，请执行以下操作之一：• 在时间轴中选择一个帧，然后选择“插入”→“时间轴”→“关键帧”• 右击(Windows) 或按住 Control 键单击(Macintosh) 时间轴中的一个帧，然后选择“插入关键帧”普通帧是两个关键帧之间的帧，显示为一个个单元格无内容的帧显示空的单元格，有内容的帧显示出一定的颜色，不同的颜色代表不同类型8.3 补间动画在 Flash 的动画设计中，提供了一种新型的动画制作方式，即补间动画（也称渐变动画）制作方式使用这种方式制作动画，只要制作好动画的第一帧与最后一帧，就可以自动地完成动画的制作补间动画制作有运动（也称动作）和形状两种方式其中运动方式适用于组合对象、文字对象或元件；而形状方式适用于图形值得一提的是，很多书籍将 Tween 翻译为渐变，本书则翻译为补间。
其它书中所说的渐变动画与本书补间动画的说法等同8.3.1 创建运动补间动画在补间动画中，在一个时间点定义一个实例、组或文本块的位置、大小和旋转等属性，然后在另一个时间点改变那些属性下面通过几个例子来说明创建运动补间动画的方法 字体的缩放制作步骤 1、单击工具栏中的文字工具 A2、在舞台内划一个文字输入区域，输入文字3、选定输入的文字，鼠标指向文字单击右键，选择“转换为元件”，出现对话框，选择“图形”，单击确定 图 8.44、鼠标指向时间轴内第 30 帧击右键，弹出菜单，选“插入关键帧”然后，利用箭头工具选择输入的文字，再单击菜单栏中的“修改”→变形→缩放，出现对话框，在比例栏中输入200；选择输入的文字，单击属性面板中颜色下拉框，选 Alpha，设置其右边的数值为 10%5、鼠标指向时间轴内第 1～30 帧之间单击右键，弹出菜单，选“创建补间动画”按回车播放图 8.5 底端旋转1、利用工具栏中直线工具画一条直线 2、选择箭头工具，鼠标指向直线单击右键，选择“转换为元件”，出现对话框，选择“图形”，单击确定(参见图 8.4) 3、利用箭头工具选择上输直线，然后单击工具栏中“任意变形工具”，利用鼠标拖动直线中心点（如图 8.6）到直线底端。
图 8.64、鼠标指向时间轴内第 30 帧击右键，弹出菜单，选“插入关键帧”，再单击菜单栏中的“修改”→变形→旋转，鼠标指向直线顶端控制点，拖动鼠标使直线旋转到适当位置5、鼠标指向时间轴内第 1～30 帧之间击右键，弹出菜单，选“创建动画动作”按回车播放图 8.7 特别提示在创建运动补间动画中，必须将对象首先转换为元件，否则，补间是断的或不完整的虚线图 8.88.3.2 设置运动补间属性上面介绍的例子是最简单的运动补间动画，在 Flash 中还可以利用渐变属性面板设置运动渐变的属性，从而得到更为复杂的动画，例如对象加速运动、运动时播放 音乐等当选中时间线面板中两个关键帧之间的某帧 ( 尚未创建渐变动画的帧 ) 后，属性面板即显示为帧属性面板，如图 8.9 所示图 8.9该面板中各选项功能如下所述帧: 该项用于为帧设置标签或注释，标签用于标识该帧，而注释则用 于对该帧进行解释当在该框中输入标签内容后，会有一个小红旗标志显示在当前帧上，参见图 8.9 所示如果在文字前加两个斜杠 "// ", 则表示添加的是注释在时间线面板中，帧上的两个斜杠会以绿色显示补间模式: 该项用于设置运动方式，单击其下拉按钮，打开下拉列表框，其中包括三个选项，如图 8.9 所示 ,“无”是没有补间的动画 ,“动作”是运动补间动画 ,“形状”是形状补间动画。
当在时间线上选择设置了运动渐变的帧，帧属性面板会有所变化 ,以下是对应于运动渐变模式的选项设置减速: 该选项用于设置对象的运动方式，即以加速或减速运动单击其下拉按钮会弹出一个滑动条 ,将滑块向下拖动，文本框中显示负值，表示对象的运动是一个加速过程 ; 将滑块拖到上边，文本框中显示正值，则表示对象的运动是减速过程旋转：该项用于设置运动对象的旋转方式，其下拉列表框中有 4 个选 项，“无”表示对象在运动过程中不旋转 ,“自动”表示按最小角度进行旋转 ,“顺时针 CW”表示旋转方向为顺时针方向，“逆时针 CCW”则表示逆时针方向旋转当选择了“顺时针 CW”或“逆时针 CCW”后，其后面的输入框被激活，在该框中输入的数值会被作为旋转圈数面向路径方向：选中该复选项，当对象沿着路径移动时，将会一直面向所移动的路径 ( 有关路径运动动画将在下章的导向图层中介绍 ) 同步：对于动画对象是一个包含动画效果的图形符号实例，当选择了该选项后，可以使实例中的动画播放与舞台中的动画播放同步吸附：选择该复选框，在路径动画过程中会将动画对象强制吸附在运动路径上有关运动路径的内容将在下章中讨论本节我们只介绍与运动渐变有关的选项，其他选项如声音设置、效果设置等将在以后介绍。
8.3.3 创建形状补间动画使用形状方式制作动画，动画制作对象是图形，一般用于制作图形的变形、颜色渐变等效果下面通过几个例子来说明创建运动补间动画的方法 圆变为矩形范例，操作步骤如下：1、利用工具栏中椭圆工具画一个圆球 2、鼠标指向时间轴内第 30 帧单击右键，弹出菜单，选“插入空白关键帧”3、利用工具栏中矩形工具画一个矩形 4、鼠标指向时间轴内第 1～30 帧之间任意帧处，单击，然后，鼠标指向“属性面板”，单击“补间”右边的下拉框，弹出菜单，选“形状”按回车播放图 8.10在形状动画类型中，“混合”处是混合类型设置，也就是产生动画过程的演变效果项选择分布式项是使用分布方式，一般物件使用此项选择角形项是使用有棱角的方式，对于线段、方块等物件的变形，多使用此方式 复制进度状态显示范例，操作步骤如下：1、 利用工具栏中矩形工具画一个矩形2、鼠标指向时间轴内第 30 帧击右键，弹出菜单，选“插入关键帧”3、选定矩形，利用利用工具栏中“自由转换工具”，改变矩形的长度到适当大小 4、鼠标指向时间轴内第 1～30 帧之间任意帧处，单击，然后，鼠标指向“属性面板”，单击“补间”右边的下拉框，弹出菜单，选“形状”。
按回车播放5、再插入一个图层，画一个矩形边框，大小与上述矩形匹配（见演示）回车观看效果图 8.11 灯光移动范例，操作步骤如下1、利用工具栏中椭圆工具画一个圆球2、单击油漆桶工具，在颜色区，单击填充颜色，选择圆形径向渐变（灰色、红色或蓝色）然后，在圆球左上角部位单击（圆球被着色，见图 8.12）3、鼠标指向时间轴内第 30 帧击右键，弹出菜单，选“插入关键帧”4、再利用油漆桶工具，在圆球右下角部位单击（注意：颜色不变，只是着色点改变）5、鼠标指向时间轴内第 1～30 帧之间任意帧处，单击，然后，鼠标指向“属性面板”，单击“中间”右边的下拉框，弹出菜单，选“形状”（参见图 8.11）按回车播放图 8.128.3.4 形状补间动画图形线索在 Flash 中制作形状渐变动画时，有时需要严格控制变形部位的对应关系，即让一个图 形上的某一点变换到另一个图形上的某一点，使得对象之间的变形不是随机的，而是有规 律的，这时就需要应用 Flash 提供的图形线索 (Shape Hints) 功能利用图形线索可以制作 出多种复杂有趣的变形效果图形线索暗示点是一个有颜色的实心小圆，上面写着一个英文字母，表示物体部位的名称，最多可以用 26 个英文字母来代表图形上的部位。
下面利用图形线索来制作一个开门的变形动画，具体操作步骤如下 :1、新建一个文件，按 {Ctrl。