教学课件：《网页设计与制作》（中职）.ppt

8.2.3 制作动作补间动画：鹰飞天空（一） 动作补间动画的基本制作方法是，在一个关键帧上放置一个对象，然后在另一个关键帧改变这个对象的大小、位置、颜色、透明度、旋转、倾斜、滤镜参数等，接着定义补间动画，Flash就会自动补上中间的动画过程。 构成补间动画的对象包括元件（影片剪辑元件、图形元件、按钮元件）、文字、位图、组等，但不能是形状，只有把形状组合成“组”或者转换成“元件”后才可以做“补间动画”。 1）制作“飞鹰飞过天空” 下面以制作一个飞鹰飞过天空的动画为例，学习制作动作补间动画的方法。 飞鹰飞过天空 8.2.3 制作动作补间动画：鹰飞天空（二） 新建一个600×222的Flash文档，设置背景为白色，帧频为12fps 。 导入我们做过的实例“飞鹰动画.swf”到库中。选中第一帧，把库中的影片剪辑“飞鹰动画.swf”拖入舞台中，放置在舞台左边不可见区域（让飞鹰从左边飞出，出现在我们的视野内），如图所示。 选中时间轴第50帧处，点击F6建立关键帧，如图所示，并左键选中舞台中的“飞鹰”，拖动到舞台的右边不可见区域（飞出我们的视野）。 导入素材并放置到舞台左边 新建关键帧并拖动素材到舞台右边 8.2.3 制作动作补间动画：鹰飞天空（三） 选中第一帧，设置“补间”选项为“动画”。这时，“图层1”第1帧到第50帧之间出现了一条带箭头的实线，并且第1帧到第50帧之间的帧格变成淡紫色。 保存文档“飞鹰飞过天空”，使用快捷键Ctrl+Enter测试最终效果。 加入补间动画 8.2.3 制作动作补间动画：缩放动画 （一） 上面的实例中制作了一个位置属性变化的补间动画，下面我们制作“五角星放大动画效果”来学习缩放变化的补间动画。 （1）新建一个Flash影片文档，文档属性保持默认。 （2）选择多角星形工具，选中“对象绘制”功能。在“属性”面板中，设置笔触色为无，填充颜色为红色。接着单击“属性”按钮，在弹出的对话框中设置“类型”为“星形”，边数为5。 （3）在舞台上绘制一个五角星。选中它，点击右键，在快捷菜单中选择“转换为元件”命令，在弹出的“转换为元件”对话框中，选择转换“类型”为“图形”元件。 绘制五角星并转换为图形元件 8.2.3 制作动作补间动画：缩放动画 （二） （4）选择“图层1”的第30帧，按F6键插入一个关键帧。 （5）选中第30帧上的五角星，单击“窗口”菜单→“变形”，将打开“变形”面板，选中“约束”复选框，在“宽度”文本框中输入200％，“高度”文本框中也自动变为200％。 （6）选择第1帧，在“属性”面板的“补间”下拉列表中选择“动画”。这样我们就完成了一个五角星放大动画的制作。 （7）按Enter键观看动画效果。 8.2.3 制作动作补间动画：“颜色变化效果” 下面我们制作“五角星从红色逐渐变为黄色”的动画效果。接着上面的步骤继续操作。 （1）选中第30帧上的五角星，在“属性”面板中，单击“填充颜色”区域，在弹出的颜色板中设置颜色为黄色。 （2）按Enter键观看动画效果。可以看到，五角星从小逐渐变化到大，并且颜色从红色逐渐过渡为黄色。 8.2.3 制作动作补间动画：“旋转动画效果” 下面我们制作五角星旋转的动画效果。接着上面的步骤继续操作。 （1）选择第1帧，选择“属性”面板中的“旋转”下拉列表中的“顺时针”选项。 （2）在“旋转”选项后面的文本框中输入“2”。 （3）按Enter键观看动画效果。可以看到，五角星顺时针旋转两圈的动画效果。 设置旋转参数 8.2.3 制作动作补间动画：“淡入淡出”效果（一） （1）新建一个Flash影片文档，文档属性保持默认。 （2）选择多角星形工具，在“属性”面板中，设置笔触色为无，填充颜色为红色。接着单击“属性”按钮，在弹出的对话框中设置“类型”为“星形”，边数为5。 （3）在舞台上绘制一个红色五角星，并将这个对象转换为图形元件，名称为“五角星”。 （4）选择“图层1”的第20帧，按F6插入一个关键帧。 （5）选择第1帧上的五角形实例，在“属性”面板中，选择“颜色”下拉列表中的“Alpha”选项，设置Alpha值为0％。 设置图形实例的Alpha值 8.2.3 制作动作补间动画：“淡入淡出”效果（二） （6）选择第1帧，在“属性”面板的“补间”下拉列表中选择“动画”。这样我们就完成了一个对象淡入的动画效果，按Enter键观看动画效果。 （7）下面制作图形淡出的动画效果。右击第1帧，在弹出的快捷菜单中执行“复制帧”命令。 （8）右击第40帧，在弹出的快捷菜单中执行“粘贴帧”命令。 （9）选择第20帧，在“属性”面板的“补间”下拉列表中选择“动画”。 （10）再按Enter键观看动画效果。可以看到五角星淡入淡出的动画效果。 8.2.3 制