Flash逐帧动画教案

1、精选优质文档-倾情为你奉上教 案课程名称FLASH二维动画 N0. 10 教师姓名陈国旋班 级计机07-1、计机07-2授课形式实验课授课日期2007年 10 月 9日第 6 周（第五、六节）授课时数2章节名称第一章 第二节 天空翱翔小鸟飞行教学目的1、 理解时间轴、帧、关键帧、空白关键帧2、 掌握帧动画的制作方法教学重点掌握帧动画的制作方法教学难点掌握帧动画的制作方法增删改内容无教学手段与资源动画片展示、多媒体复习与导入新课： 时间：5分钟展示帧动画的效果，提出传统的动画制作方法与电脑制作方法的相似之处。教 学 过 程 与组织 时间：30分钟教学提示一、 帧的类型1、 普通帧2、 关键帧：指

2、用于定义动画变化或包含帧动作的帧。在Flash中可以通过在两个关键帧之间补间或填充帧来产生动画。创建关键帧的方法：菜单法、右键法、快捷键法（F6）3、 空白关键帧：表示当前舞台上没有任何对象，当在舞台上导入了某个对象后，空白关键帧会自动转变为关键帧。创建空白关键帧的方法：菜单法、右键法、快捷键法（F7）、关键帧加内容法。二、 帧动画逐帧动画（FrameBy Frame），这是一种常见的动画手法，它的原理是在“连续的关键帧”中分解动画动作，也就是每一帧中的内容不同，连续播放而成动画。由于逐帧动画的帧序列内容不一样，不仅增加制作负担而且最终输出的文件量也很大，但它的优势也很明显：因为它相似与电影播

3、放模式，很适合于表演很细腻的动画，如3D效果、人物或动物急剧转身等等效果。1逐帧动画的概念和在时间帧上的表现形式 在时间帧上逐帧绘制帧内容称为逐帧动画，由于是一帧一帧的画，所以逐帧动画具有非常大的灵活性，几乎可以表现任何想表现的内容。逐帧动画在时间帧上表现为连续出现的关键帧逐帧动画2创建逐帧动画的几种方法 （1）用导入的静态图片建立逐帧动画用jpg、png等格式的静态图片连续导入Flash中，就会建立一段逐帧动画。（2）绘制矢量逐帧动画用鼠标或压感笔在场景中一帧帧的画出帧内容。（3）文字逐帧动画用文字作帧中的元件，实现文字跳跃、旋转等特效。（4）导入序列图像可以导入gif序列图像、swf动画文

4、件或者利用第3方软件（如swish、swift 3D等）产生的动画序列。3绘图纸功能 （1）绘画纸的功能绘画纸是一个帮助定位和编辑动画的辅助功能，这个功能对制作逐帧动画特别有用。通常情况下，Flash 在舞台中一次只能显示动画序列的单个帧。使用绘画纸功能后，你就可以在舞台中一次查看两个或多个帧了。如图3-2-2所示，这是使用绘画纸功能后的场景，可以看出，当前帧中内容用全彩色显示，其它帧内容以半透明显示，它使我们看起来好像所有帧内容是画在一张半透明的绘图纸上，这些内容相互层叠在一起。当然，这时你只能编辑当前帧的内容。图3-2-2 同时显示多帧内容的变化（2）绘图纸各个按钮的介绍绘图纸外观按钮 按

5、下此按钮后，在时间帧的上方，出现 绘图纸外观标记。拉动外观标记的两端，可以扩大或缩小显示范围。 绘图纸外观轮廓 按下此按钮后，场景中显示各帧内容的轮廓线，填充色消失，特别适合观察对象轮廓，另外可以节省系统资源，加快显示过程。3. 绘图纸显示多帧按钮，按下后可以显示全部帧内容，并且可以进行“多帧同时编辑”。 修改绘图纸标记 按下后，弹出菜单，菜单中有以下选项： “总是显示标记”选项会在时间轴标题中显示绘图纸外观标记，无论绘图纸外观是否打开。“锚定绘图纸外观标记”选项会将绘图纸外观标记锁定在它们在时间轴标题中的当前位置。通常情况下，绘图纸外观范围是和当前帧的指针以及绘图纸外观标记相关的。通过锚定绘

6、图纸外观标记，可以防止它们随当前帧的指针移动。“绘图纸 2”选项会在当前帧的两边显示两个帧。“绘图纸 5”选项会在当前帧的两边显示五个帧。“绘制全部”选项会在当前帧的两边显示全部帧。上面，我们全面介绍了逐帧动画的特点和创建方法，现在，我们来动手制作二个逐帧动画实例，以加深对逐帧动画的认识。4奔跑的豹子 茫茫雪原上，有一只矫健的豹子在奔跑跳跃，这是一个利用导入连续位图而创建的逐帧动画，如图 3-2-3所示。图 3-2-3 奔跑的豹子1、 创建影片文档 执行【文件】|【新建】命令，在弹出的面板中选择【常规】|【Flash文档】选项后，点击【确定】按钮，新建一个影片文档，在【属性】面板上设置文件大小

7、为400*260象素，【背景色】为白色，如图 3-2-4所示。图 3-2-4 创建新文档2、 创建背景图层 选择第一帧，执行【文件】|【导入到场景】命令，将本实例中的名为“雪景.bmp”图片导入到场景中。在第8帧按F5，加过渡帧使帧内容延续。3、 导入gif动画新建一层，选择第一帧，执行【文件】|【导入到场景】命令，将本教程中的“奔跑的豹子”系列图片导入。此时，会弹出一个对话框，如图3-2-5所示。3-2-5 系列图片导入选择【是】按钮，Flash 会自动把gif中的图片序列按序以逐帧形式导入场景的左上角，如图3-2-7所示。3-2-7导入的gif动画在场景的上方形成帧帧动画如图3-2-8所示

8、是导入后的动画序列，它们被Flash自动分配在8个关键帧中。图 3-2-8 导入的8张图片4 、调整对象位置此时，时间帧区出现连续的关键帧，从左向右拉动播放头，就会看到一头勇猛的豹子在向前奔跑，但是，被导入的动画序列位置尚未处于我们需要的地方，缺省状况下，导入的对象被放在场景坐标“0，0”处，我们必须移动它们。你当然可以一帧帧调整位置，完成一幅图片后记下其坐标值，再把其它图片设置成相同坐标值，如果你有足够耐性和时间，也无妨，那么，我们何不试试“多帧编辑”功能呢？先把“雪景”图层加锁，然后按下时间轴面板下方的【绘图纸显示多帧】按钮 ，再单击【修改绘图纸标记】按钮 ，在弹出的菜单中选择【显示全部】

9、选项，如图3-2-9所示。图3-2-9 选择显示全部选项最后执行【编辑】|【全选】命令，此时时间轴和场景效果如图3-2-10所示。图3-2-10 选取多帧编辑用鼠标左键按住场景左上方的豹子拖动，就可以一次把8帧中的图片一次全移动到场景中了。5、 设置标题文字在场景中新建一个图层，单击工具栏上的文字工具按钮 ,设置【属性】面板上的文本参数如下，【文本类型】为静态文本；【字体】为隶书；【字体大小】35；【颜色】为深蓝色。如图 3-2-11所示。图 3-2-11 字体【属性】面板参数设置在文本框输入“奔跑的豹子”五个字，居中放置。6、 测试存盘 执行【控制】|【测试影片】命令，观察本例swf文件生成的动画有无问题，如果满意，执行【文件】|【保