逐帧动画的制作(教案)

逐帧动画制作

授课人：刘建

学习目标：

1、认识逐帧动画的动画原理

2、会制作逐帧动画

重、难点：

认识逐帧动画的动画原理，会制作逐帧动画

教学方法：

演示法、讲授法、练习法

教学过程：

一、引入

由演示几个逐帧动画实例引入

二、新课学习

1. 逐帧动画的动画原理

原理是在“连续的关键帧”中分解动画动作，也就是每一帧中的内容不同，连续播放而成动画

2. 帧、关键帧、空白关键帧

时间轴上的小方格叫单元格。可以把单元格转化为帧、关键帧、空白关键帧。当播放头移到帧上时，帧的内容就显示在舞台上。

帧与关键帧都用来记录舞台的内容，但是帧只能显示离它最左边关键帧的内容，我们不能对帧的内容直接进行修改编辑，要想修改帧的内容，必须把它转变成关键帧，后者修改帧最左边关键帧的内容。

关键帧是可以直接编辑的帧。

空白关键帧是在舞台上没有任何内容的关键帧，一旦在空白关键帧上绘制了内容，它就变成关键帧。

3. 创建逐帧动画的几种方法

（1）用导入的静态图片建立逐帧动画

用jpg、png等格式的静态图片连续导入到Flash中，就会建立一段逐帧动画（参考实例：奔跑的豹子）。

（2）绘制矢量逐帧动画

用鼠标或压感笔在场景中一帧帧的画出帧内容（参考实例：旋转的立方体）。

（3）文字逐帧动画

用文字作帧中的元件，实现文字跳跃、旋转等特效。

（4）指令逐帧动画

在时间帧面板上，逐帧写入动作脚本语句来完成元件的变化。

（5）导入序列图像

可以导入gif序列图像、swf动画文件或者利用第3方软件（如swish、swift 3D等）产生的动画序列。

4. 演示逐帧动画奔跑的豹子制作

三、学生练习

任务：熟悉逐帧动画的制作

1. 根据老师所提供的学习资料制作逐帧动画

2. 从网上搜索更多的教程学习

四、课堂小结

小结本节的主要内容和学生中存在的问题

附：学生资料

实例1——奔跑的豹子

实例简介

茫茫雪原上，有一只矫健的豹子在奔跑跳跃，这是一个利用导入连续位图而创建的逐帧动画，如图3-2-3所示。

图 3-2-3 奔跑的豹子

知识提要

●导入位图的方法

●创建逐帧动画

●创建文字对象

●利用洋葱皮工具移动多帧元件

步骤1 创建影片文档

执行【文件】|【新建】命令，在弹出的对话框中选择【常规】|【Flash文档】选项后，点击【确定】按钮，新建一个影片文档，在【属性】面板上设置文件大小为400×260像素，【背景色】为白色，如图3-2-4所示。

图 3-2-4 创建新文档

步骤2 创建背景图层

选择第一帧，执行【文件】|【导入】|【导入到舞台】命令，将配套光盘中的名为“雪景.bmp”图片导入到场景中，（“雪景”图片位置：光盘\example\part3\***\图片\雪景.b mp）。选择第8帧，按F5键，增加过渡帧，使帧内容延续到第8帧。

步骤3 导入gif动画

新建一个图层，选择第一帧，执行【文件】|【导入】|【导入到舞台】命令，将配套光盘中的“奔跑的豹子”系列图片导入，（“奔跑的豹子”系列图片位置：光盘\example\par t3\***\图片\奔跑的豹子1.png）。此时，会弹出一个对话框，如图3-2-5所示。

图3-2-5 系列图片导入

选择【是】按钮，Flash会自动把gif中的图片序列按序以逐帧形式导入场景的左上角，如图3-2-6所示。

图3-2-6 导入的gif动画在场景的上方形成帧帧动画如图3-2-7所示是导入后的动画序列，它们被Flash自动分配在8个关键帧中。

图3-2-7 导入的8张图片

逐帧动画(3)

步骤4 调整对象位置

此时，时间帧区出现连续的关键帧，从左向右拉动播放头，就会看到一头勇猛的豹子在向前奔跑，但是，被导入的动画序列位置尚未处于我们需要的地方，缺省状况下，导入的对象被放在场景坐标“0，0”处，我们必须移动它们。

你当然可以一帧帧调整位置，完成一幅图片后记下其坐标值，再把其它图片设置成相同坐标值，如果你有足够耐性和时间，也无妨，那么，我们何不试试“多帧编辑”功能呢？

先把“雪景”图层加锁，然后按下时间轴面板下方的【编辑多个帧】按钮，再单击【修改绘图纸标记】按钮，在弹出的菜单中选择【显示全部】选项，如图3-2-8所示。

图3-2-8 选择显示全部选项

最后执行【编辑】|【全选】命令，此时时间轴和场景效果如图3-2-9所示。

图3-2-9 选取多帧编辑

用鼠标左键按住场景左上方的豹子拖动，就可以把8帧中的图片一次全移动到场景中央了。

步骤5 设置标题文字

在场景中新建一个图层，单击工具箱中的【文字工具】，设置【属性】面板上的文本参数如下，文本类型为【静态文本】；字体为【隶书】；字体大小为35；颜色为深蓝色。如图3-2-10所示。

图 3-2-10 字体【属性】面板参数设置

在文本框中输入“奔跑的豹子”五个字，居中放置。

步骤6 测试存盘

执行【控制】|【测试影片】命令（快捷键Ctrl+Enter），观察动画效果，如果满意，执行【文件】|【保存】命令，将文件保存成“奔跑的豹子.fla”文件，如果要导出Flash的播放文件，执行【文件】|【导出】|【导出影片】命令。