基本动画和时间轴特效动画

《基本动画和时间轴特效动画》由会员分享，可在线阅读，更多相关《基本动画和时间轴特效动画（15页珍藏版）》请在金锄头文库上搜索。

1、138 第 第 6 6 章 章 基本基本动画动画和和时间轴特效动画时间轴特效动画 本章通过完成 8 案例，介绍了几种制作基本动画和利用时间轴特效制作特效动画的方法和 制作技巧，还介绍了库和图层文件夹的相关知识。 6.16.1【案例案例 2323】摆动摆动的模拟指针钟的模拟指针钟 【案例案例效果效果】 “摆动的模拟指针钟”动画播放后的 2 幅画面如图 611 所示。可以看到，最左边的彩珠 环摆起再回到原处后，撞击其他的彩珠环，使最右边的彩珠环摆起，当该彩珠环回到原处后， 又撞击其他彩珠环，使最左边的彩珠环再摆起。周而复始，不断运动。中间的彩珠环是顺时针 转圈，左右两个摆动模拟指针钟是逆时针转圈，

2、在摆动中还会改变颜色。 图 611 “摆动的模拟指针钟”动画播放后的 2 幅画面 【相关知识相关知识】动画简介 动画简介 1 1Flash Flash 动画的种类动画的种类 （1）帧帧动画：帧帧动画的每一帧都由制作者确定，而不是由 Flash 通过计算得到，然后 连续依次播放这些画面，即可生成动画效果。帧帧动画适于制作非常复杂的动画，Gif 格式的 动画就是属于这种动画。与过渡动画相比，通常帧帧动画的文件字节数较大。为了使一帧的画 面显示的时间长一些，可以在关键帧后边添加几个与关键帧内容一样的普通帧。 （2）补间动画：它也叫过渡动画。制作若干关键帧画面，由 Flash 计算生成各关键帧之间 的

3、各个帧，使画面从一个关键帧过渡到另一个关键帧。补间动画又分为动作动画和形状动画。 利用帧帧动画和补间动画，可以制作大小、位置、围绕对象中心点旋转角度、形状、颜色、 亮度、透明度等分别变化或同时变化的动画，可以制作围绕对象中心点顺时针或逆时针转圈或 者来回摆动的动画，可以制作沿着引导线移动的动画，还可以制作其他各种变化形式的动画。139 2 2动作动画的特点动作动画的特点 动作动画是补间动画中的一种。在 Flash CS3 中可以创建出丰富多彩的动作动画效果，可 以使一个对象在画面中沿直线移动，沿曲线移动，变换大小、形状和颜色，以中心为圆点自转， 以中心为圆点旋转，产生淡入淡出效果等。各种变化可

4、以独立进行，也可合成复杂的动画。例 如一个对象不断自转的同时还水平移动。 Flash CS3 可以使实例、图形、图像、文本和组合产生动作动画。创建动作动画后，自动将 对象转换成补间的实例， “库”面板中会自动增加元件，名字为“补间 l”和“补间 2”等。 动作动画可以借助于引导层使对象沿任意路径运动，即创建引导动作动画。动作动画可以 借助遮罩层的作用产生千奇百态的动画效果。 6.26.2【案例案例 2424】动画动画翻页画册翻页画册 【案例案例效果效果】 “动画翻页画册”动画播放后，动画翻页画册第 1 个动画画面慢慢从左向右翻开，接着第 2 动画画面慢慢从左向右翻开。其中的 3 幅画面如图 6

5、21 所示。当翻页翻到背面后，背面动画 画面与正面动画画面不一样。在翻页中动画画面一直变化。 图 621 “动画翻页画册”动画播放后的 3 幅画面 1 1制作第 制作第 1 1 页翻页动画页翻页动画 （1）设置舞台工作区宽为 300 像素、高为 300 像素。显示标尺，创建 3 条垂直辅助线和两 条水平辅助线，如图 622 所示。然后，导入 5 个 GIF 格式动画到“库”面板中。同时在“库” 面板内自动生成 5 个加载有相应的 GIF 格式动画的影片剪辑元件。 （2）将这 5 个影片剪辑元件的名称分别改为“动画 1” 、 “动画 2” 、 “动画 3” 、 “动画 4”和 “动画 5” 。双

6、击“库”面板中“动画 1”影片剪辑元件，进入它的编辑状态，观察各帧的画面， 将损坏图像的帧删除。 （3）选中“图层 1”图层第 1 帧，将“库”面板中的“动画 1”影片剪辑元件拖曳到舞台 工作区内，形成一个“动画 1”影片剪辑实例。调整该实例宽为 122 像素，高为 160 像素，X 为 160 像素，Y 为 125 像素，如图 622 所示。 （4）在“图层 1”图层之上添加一个名称为“图层 2”的图层，选中“图层 2”图层第 1 帧，将“库”面板中的“动画 2”影片剪辑元件拖曳到舞台工作区内。在其“属性”面板内设 置实例的宽为 122 像素，高为 160 像素，X 为 160 像素，Y 为

7、 125 像素，如图 6219 所示。140 （5）创建“图层 2”图层的第 1 帧到第 50 帧的动画。使用工具箱内的“任意变形工具” ， 选中第 50 帧的实例，并用鼠标将该帧实例对象的中心标记 拖曳到如图 623 所示位置。然后 将第 50 帧复制粘贴到第 1 帧，第 1 帧实例的中心标记 位置也如图 623 所示。 图 622 “图层 1”图层第 1 帧画面 图 623 “图层 2”图层第 1 帧画面 （6）选中“图层 2”图层第 50 帧“动画 2”影片剪辑元件。使用工具箱内的“任意变形工 具” ，用鼠标向左拖曳该实例右侧的控制柄，将它水平反转过来（宽度不变） 。然后，将鼠 标指针移

8、到该实例左边缘处，当鼠标指针呈两条垂直箭头状时，垂直向上微微拖曳鼠标，使“动 画 2”影片剪辑实例左边微微向上倾斜，如图 624 所示。 （7）用鼠标拖曳时间轴中的红色播放头，可以看到“图层 2”图层中的“动画 2”影片剪 辑实例从上边进行翻页。如果，前面没有将“动画 2”影片剪辑实例左边微微向上倾斜，则很 可能是“动画 2”影片剪辑实例从下边进行翻页。当拖曳时间轴中的红色播放头移到第 25 帧处 时，可以看到舞台工作区内“动画 2”影片剪辑实例已经翻到垂直位置，如图 625 所示。 图 624 第 1 帧画面 图 625 第 25 帧画面 （8）在“图层 2”图层之上添加一个名称为“图层 3

9、”的图层，按照上述方法创建“图层 3”图层第 1 帧到第 50 帧的“动画 3”影片剪辑实例翻页动作动画。只是“动画 3”影片剪辑实 例是“库”面板内的“动画 3”影片剪辑元件的实例。 （9）按住 Ctrl 键，单击选中“图层 2”图层第 25 帧，和“图层 3”图层第 26 帧，按 F6 键，创建 2 个关键帧。选中“图层 1”图层第 50 帧，按 F5 键，使该图层第 1 帧到第 50 帧内容 一样。（10）按住 Shift 键，单击“图层 3”图层的第 1 帧和第 25 帧，选中第 1 帧和第 25 帧之 间的所有帧，如图 6-2-6 左图所示。右击选中的帧，弹出帧快捷菜单，再单击该菜单

10、中的“删 除帧”菜单命令，将选中的帧删除，效果如图 6-2-6 右图所示。141 图 626 时间轴内删除一些帧 （11）拖曳选中的帧，将第 1 帧到第 25 帧动画移到第 26 帧到第 50 帧处，如图 6-2-7 左 图所示。 （12）按住 Shift 键，单击“图层 2”图层的第 26 帧和第 50 帧，选中第 26 帧和第 50 帧 之间的所有帧。将鼠标指针移到选中的帧之上，单击鼠标右键，弹出帧快捷菜单，再单击该菜 单中的“删除帧”菜单命令，将选中的帧删除，效果如图 6-2-7 右图所示。 图 627 时间轴内移动和删除一些帧 2 2制作第 制作第 2 2 页翻页动画页翻页动画 （1）

11、在“图层 3”图层上边新建“图层 4”图层。选中“图层 1”图层第 1 帧，单击鼠标右 键，弹出帧快捷菜单，再单击该菜单中的“复制帧”菜单命令，将该帧内容复制到剪贴板中。 （2）右击“图层 4”图层第 51 帧，弹出帧快捷菜单，再单击该菜单中的“粘贴帧”菜单命 令，将剪贴板中的“图层 1”图层第 1 帧的内容粘贴到“图层 4”图层第 51 帧内。 （3）按照前面介绍的方法，创建“图层 4”图层第 51 帧到第 100 帧“动画 1”影片剪辑实 例翻页动画。再创建“图层 5”图层第 51 帧到第 100 帧“动画 4”影片剪辑实例的翻页动画。 （4）按照上述方法，将“图层 4”图层的第 51 帧

12、到第 75 帧动画删除，将原来的第 76 帧到 第 100 帧动画移回到原来位置。将“图层 5”图层的第 76 帧到第 100 帧动画删除。 （5）选中“图层 3”图层的第 100 帧，按 F5 键，使“图层 3”图层第 50 帧到第 100 帧内 容一样。右击“图层 3”图层的第 50 帧，调出帧快捷菜单，单击该菜单中的“删除补间”菜单 命令，使该帧不具有动画属性。 （6）在“图层 1”图层下边新建一个名称为“背景”的图层。选中“背景”图层的第 51 帧，按 F7 键，创建一个关键帧。将“库”面板内的“动画 5”影片剪辑元件拖曳到舞台工作区 内，调整它的宽 122 像素，高 160 像素，X

13、 为 160 像素，Y 为 125 像素，如图 628 所示。 （7）选中“背景”图层第 100 帧，按 F5 键，使“背景”图层第 76 帧到第 100 帧内容一样。 至此，整个“动画翻页”动画制作完毕，该动画的时间轴如图 629 所示。 图 6-2-8 第 5 个实例 图 6-2-9 “动画翻页”动画的时间轴142 【相关知识相关知识】动作动作动画关键帧的动画关键帧的“属性属性”面板面板 选中动画关键帧，调出动画关键帧的“属性”面板。利用该面板可以设置动画类型和动画 其他属性。在“补间”下拉列表框中选择了“动画”选项（应该翻译为“动作” ）后，该面板如 图 6210 所示。该对话框内有关选

14、项的作用如下（其中关于声音的选项参看第 4.5 节） 。 图 6210 动画关键帧的“属性”面板 （1）“”文本框：用来输入关键帧的标签名称。 （2）“标签类型”下拉列表框：在输入关键帧的标签名称后“标签类型”下拉列表框才会 生效。该下拉列表框可以用来定义标签的类型，其中有三个选项“名称”、“注释”、“锚点”。 例如：选中动作动画的第 1 关键帧，在其“属性”面板“”文本框中输入“第 1 帧”文字后，时间轴的第 1 关键帧内会显示标签的名称。如果在“标签类型”下拉列表框中选 择不同选项，则该关键帧内的红色标记图案会不一样，其作用也会不一样。选择“名称”选项 时，程序中可以利用该名称。 （3）“

15、补间”下拉列表框：用来选择动画类型。它有三个选项：选择“无”选项，是没有 动画；选择“动画”选项，是创建动作动画；选择“形状”选项，是创建“形状”动画。 （4）“缓动”文本框：可输入数据或调整滑条的滑块（数值范围是100 到 100），来调整 运动的加速度。其值为负数时为动画在结束时加速，其值为正数时为动画在结束时减速。 （5）“旋转”下拉列表框：用来控制对象在运动时的旋转方式。选择“无”选项是不旋转； 选择“自动”选项是按照尽可能少运动的情况下旋转；选择“顺时针”选项是顺时针旋转象； 选择“逆时针”选项是逆时针旋转。可以在其右边的“次”文本框内输入旋转的次数。 （6）“调整到路径”复选框：选

16、中它后，可将运动对象的基线调整到运动路径。 （7）“同步”复选框：选中它后，可使图形元件实例的动画与住时间轴同步。 （8）“对齐”复选框：选中它后，可使运动对象的中心点标记与运动路径对齐。 6.6.3 3【案例案例 2 25 5】我也要救灾我也要救灾 【案例案例效果效果】 “我也要救灾”动画播放后的 3 幅画面如图 631 所示。可以看到，在一幅儿童图像之上 “我” 、 “也” 、 “要” 、 “救”和“灾”五个文字旋转着沿着 5 条不同的曲线轨迹，依次从上向下 移动到下边，排成倾斜的一排。143 图 631 “我也要救灾”动画播放后 3 幅画面 1 1制作 制作 5 5 个图形元件个图形元件 （1）新建一个 Flash 文档，设置舞台工作区宽 280 像素、高 300 像素，背景为蓝色。然后， 以名称“我也要救灾.fla”保存在“ 【案例 25】我也要救灾”文件夹内。 （2