《二维动画制作》教案.doc

丁丁的文档二维动画制作教案 (2010年下学期)教师：丁星明授课班级：一年级1001、1002班第一章 二维动画基础【课 题】二维动画基础【节 标 题】1.1 动画的原理与发展1.2 二维动画的制作工具及文件格式1.3 flash mx基础知识【教学目标】1.知识目标(1)了解动画的基本原理、电脑动画的概念及特点；(2)了解传统动画的制作过程；(3)了解二维动画的常用制作软件；(4)了解二维动画常用的文件格式；(5)认识 flash mx 动画制作软件的界面；(6)初步掌握 flash 相关的几个基本概念。2.技能目标(1)熟悉flash mx的使用界面；(2)掌握浮动面板的显示、隐藏及布局。3.发展目标培养学生自主学习的能力【教学模式】基于教师指导与学生思记的教学模式【课前准备】1.制作教学辅助课件，引导学生认真阅读教材，为学生自主探究学习提供帮助。2.准备几张透明胶片，将风车动画的基本组成部件绘制在胶片上。3.使用flash mx制作好风车动画的几个基本元件（风车架、风叶等）。4.各收集一个gif格式、swf格式、avi格式和flc格式的动画。【教学重、难点】重点：flash的使用界面及基本概念。难点：flash的几个基本概念。【课时安排】2课时【教学过程】一、 新课导入对于动画，我们大家都不会陌生，很多同学大概都是伴随着动画片成长，象“米老鼠”、“唐老鸭”等动画形象大家肯定都不会。动画，可以说是一种老少咸宜的艺术形式，它有着悠久的历史，像我国民间的走马灯和皮影戏，就可以说是动画的一种古老形式。设疑，让同学们思考。1.什么是动画？2.动画是如何制作出来的？3.我们是否也能够制作动画片？二、 新课讲解1.动画的原理与发展(1)动画是由于人眼“视觉暂留”的特性而产生的。讲解过程中展示风车转动的图片，先一幅幅放慢地展示，然后在以转快的速度展示，使学生加深理解。(2)简单介绍传统动画片的制作过程。事先准备好几张透明胶片，通过幻灯片投影演示，让学生有个较直观的了解。(3)讲解电脑动画的概念及分类，先通过使用flash mx制作风车转动动画，让学生对电脑动画与手工制作动画的区别有个较为直观的了解，更便于掌握电脑的特点。2.二维动画的制作工具及文件格式简单介绍二维动画的制作工具，展示flash mx及ulead gif animator 软件，展示几个格式的动画例子，帮助学生了解并记忆。3.flash mx基础知识(1)flash mx的使用界面，以前面制作的风车动画为例，来逐一讲解flash mx的使用界面，特别注意演示浮动面板的显示和隐藏的基本操作。(2)讲解清楚几个概念（以风车转动进行讲解）矢量图形和位图图像。注意演示两种图像缩放后，画质变化情况，使学生能够牢记。帧。组成动画的最基本元素，可以理解成日常生活中电影胶片中的底片元件。是组成电影的各个元素，可重复使用。图层。用于控制不同类型或不同时间段的对象。三、 归纳小结1.学习动画的基础知识，了解动画的基本原理及二维动画的基础知识。2.着重学习flash mx的基础知识，重点掌握flash的基本概念。 四、 课后作业1.动画是根据什么原理产生的？电脑动画一般分成几种类型？它们分别是什么？2.二维动画的文件格式有哪些？3.矢量图形与位图图像有何区别？4.帧、元件和图层各有哪些类型？5.flash mx有哪些主要的文件格式？6.上机实习，熟悉flash mx的使用界面，掌握浮动面板的显示、隐藏及布局。第二章 绘图基础【课 题】绘图基础【节 标 题】2.1 绘图和着色2.2 选择与编辑对象2.3 文本编辑2.4 图形导入【教学目标】了解flash mx的界面掌握flash mx绘图工具的初步使用理解对象，库，组件，实例的概念学会简单动画的制作要点flash mx的基本工具的使用flash mx的专业术语的概念和应用简单动画的制作流程和关键步骤【教学模式】基于任务驱动法，结合演示引导启发式的教学模式及教材的自主探究学习的教学模式【课前准备】1.制作教学辅助课件，引导学生认真阅读教材，为学生自主探究学习提供帮助。2.将教学辅助课件及实例素材发给每位学生。3.班级学生按“组内异质，组间同质”的原则分好各合作学习小组，每组45人组成。【教学重、难点】重点：flash mx软件绘图中编辑对象的一般方法。难点：flash mx软件绘制图形的操作技能。【课时安排】（16课时）2.1 绘图和着色（二课时）2.2 选择与编辑对象 （六课时）2.3 文本编辑（四课时）2.4 图形导入（四课时）2.1 绘图和着色flash是一个优秀的平面动画及动态网页制作工具，flash已越来越多落户于动画创作人员的计算机中，以网页动画为代表的网站也如雨后春笋般涌现出来，其中比比皆是。flash系列到近期推出的flash mx功能不断加强，ie5支持flash,浏览者不用下载插件就可以直接浏览flash动画。系列的主要特点：1，采用和其他网面动画制作软件完全不同的核心技术：流控制技术。简单地说，就是边下载边播放的技术，不需要考虑网络是否拥挤，即使是每秒几十字节的传输速度，也可以流畅地观看。flash文件在下载的同时可即时地流畅的播放显示，完全打破网络带宽的限制。2，采用了矢量技术，可以将一幅图像进行任意的缩放，而不会有任何失真。因此，可以采用体积很小的图像来制作动画，使flash文件变得非常小，而在应用时，即使全屏幕播放该动画也不会增加文件大小。3，界面友好，简单易学，只要一上手，就会被深深地吸引。无论初学者还是高手们都可以利用flash权利，发挥无限的想象力，实现自己的创意。在flash的天地中，只有想不到的没有做不到的。4，与dreamweaver和fireworks配合密切，结合完美。flash动画可以插入到html里，也可以单独成为网页。由于还具有交互性，flash制作的网页的效果完全超出了dhtml,java和activex。flash mx与flash5相比较，新增加了一些主要的功能：*增加了浮动面板和可引用的其他源文件的图库组件。*支持双声道*支持mp3压缩音频格式*支持alpha透明通道为了让初学者学习flash更为方便，直观的，本篇的采用最新版本flash mx汉化软件来组织教材。只要的读者懂得windows的操作，学习就会很快入门和得到进阶提高。对创建夭量图形和动画还没有经验的读者，建议除本篇外，再看一看flash mx自带的帮助文件中的教程和实例。说明：汉化flash mx版有两种：一种用汉化被丁方法实现，另一种一次直接安装。本教材采用的是前一种方法。不同方法化结果略不同。绘图工具的使用绘图工具箱中的各种绘图工具和操作工具是用户创建flash动画的基本要素就是用它所带的绘图工具箱制作完全的。图2-2-8所示的是常用工具栏的各个工具的具体名称。一、画笔工具在flash mx的绘图工具中，画笔工具是了常用的工具之一，画笔工具类可以直线工具，画圆工具一样归入。1，直线工具单击直线工具按钮/，按下绘图工具栏中部的按钮，选择好线条颜色后就可以使用鼠标到工作区域来创建直线了。如图示2-2-9所示。打开方法之一：菜单“窗口”/“面板”/“描绘”命令即可。在其面板是上便可确定你所需的参数了。直线工具只能使用实心的颜色的颜色而不能使用填充的效果。需要注意的是在flash中建立的图形都是矢量图形。技巧1按住shift键可以将直线的方向限制在水平，垂直45角的方向。2确定颜色时在打开“调色板”对话杠中，其颜色值除可用鼠标选定外，还可用手工输入具体的rgb十六进制数值。例如，输入“#fffffff代表白色2，画圆工具画圆工具可以建立各种椭圆和图形。在这里建立的椭圆主要包括两面部分，分别是线框部分和填充部分，如图示2-2-10所示。椭圆的线框和填充部分可以看作是两个不同的对象。线框部分其实是一个线条对象，用户可以像设置直线对象的属性那样设置线框的颜色，宽度和类型。而填充部分要使用工具箱下主如图示2-211所示的属性面板栏，它不但可以设置实心的颜色，还可以设置填充的效果，例如渐变的效果。单击画圆工具按钮，将你所需要的参数设置好，就可以使用鼠标到工作区域来创建圆形了，不仅可以画出各样的开头形状，还可以画出无线框或无填充各种图形。不妨试试！技巧按shift键可以建立一个正圆形。3，矩形工具矩形工具和椭圆工具的使用非常相似，同样是由两部分组成，但是矩形带有另一个参数-圆角的半径大小。单击按钮，弹出更改圆角矩形半径对话框，改变边角半径(c)0点框中的数值，便可以画出有转角的矩形，设定适合的角度，在绘制特殊效果矩形的过程中是很有用的。技巧按住shift键可以建立一个正方形。4，铅笔工具铅笔工具用来创建任意形状的曲线，铅笔工具设有一个属性面板，即曲线模式选择按钮。单击该按钮后可以弹出菜单中选择不同的曲线方式。曲线模式选择菜单中共有3种模式可供选择，分别是：直线化：在工作中画曲线时，曲线会尽量向标准的几何图形转换平滑：在工作中画曲线，曲线会尽量的圆滑。墨水瓶：在工作中画曲线时，曲线的形状完全就是鼠标的移动路线。注意在使用铅笔工具进行绘图之前，一定要决定好使用哪种曲线模式，因为对于同样的鼠标路径，不同的曲线模式所创建的效果有时会有很大的区别。技巧按住shift键盘可以使鼠标的移动路线限制在水平或垂直的方向上。5 钢笔工具它是flash mx新增的功能，用于生成精确的路径，作为直线，或者平滑，流畅的曲线。可以生成直线段，曲线段，可以调节直线段的角度和长度，曲线段的倾斜度。2.2 选择与编辑对象【课 题】选择与编辑对象【教学目标】1.知识目标(1) 掌握flash mx选择工具的使用技巧。(2)掌握flash mx编辑对象的一般方法。 2.技能目标(1)熟练掌握利用flash mx绘制图形的操作技能。(2)通过绘图实例训练，培养学生的综合知识的应用能力。3.发展目标(1)使学生在不断尝试中，激发学生创新意识，培养学生的创造能力和审美能力。(2)在绘图的过程中，使学生具有精益求精的工作态度和严谨的工作作风。4.层次目标(1)基础薄弱学生的学习目标了解选择与编辑对象的一般方法。完成花朵的绘制。(2)中等学生的学习目标掌握选择与编辑对象的一般方法。完成花朵与小汽车轮廓的绘制。(3)优等学生的学习目标掌握选择与编辑对象的一般方法与应用技巧。完成花朵与小汽车的绘制。指导帮助本组的其他同学，在知识技术和组织上的带头作用。【教学模式】基于任务驱动法，结合演示引导启发式的教学模式及教材的自主探究学习的教学模式【课前准备】1.制作教学辅助课件，引导学生认真阅读教材，为学生自主探究学习提供帮助。2.将教学辅助课件及实例素材发给每位学生。3.班级学生按“组内异质，组间同质”的原则分好各合作学习小组，每组45人组成。【教学重、难点】重点：flash mx软件绘图中编辑对象的一般方法。难点：flash mx软件绘制图形的操作技能。【课时安排】6课时【教学过程】一、导入图形是 flash mx 动画的基础，所以掌握绘图的一般方法对于制作好的flash作品是至关重要的。前一讲我们学习了绘制图形工具的使用，并且掌握图形填充和着色的操作方法，本节课我们学习flash mx选择工具的使用技巧与编辑对象的一般方法。二、新课：运用自主探究的学习方法学习以下内容：1.箭头工具的使用(1)用箭头工具选择填充区域。(2)用箭头工具选择线条。(3)用箭头工具选择某一区域内的对象。(4)用箭头工具修改图形的其他方式。2.套索工具的使用(1)套索工具可以选取一定的区域(2)在套索工具中的选项栏里有三种选取模式3移动、复制和删除对象4群组与分离对象(1)群组对象：选择“修改”“组合”菜单命令(快捷键： ctrl+g )(2)分离对象：选择“修改”“分离”菜单命令,这种操作也称为“打散”，如需将群组后的对象撤消群组状态，也需要同样的方法，(快捷键：ctrl+b )。5对齐对象选择“窗口”“排列”菜单命令（快捷键：ctrl+k ），将显示“对齐”面板，在该面板中可以调节各个对象的位置来对齐对象。6变换对象(1)缩放、倾斜与旋转对象(2)翻转对象(3)变形与修边对象(4)调整对象的注册点位置：在 flash mx 中，所有的群组、实例、文本块、位图都有一个注册点。在对对象进行旋转、倾斜、扭曲等转换操作时都将用到它。默认情况下，注册点位于对象的中心。要移动其位置，只需用鼠标左键按住注册点并拖动即可，当对象的注册点改变后，对对象进行转换操作时，将以新的注册点为中心。三、实例应用实例一：绘制花朵本实例教学运用演示引导启发式的教学模式(1)实例分析：本实例是绘制一花朵。该实例首先运用椭圆工具和编辑工具绘制一片花瓣，然后移动注册点，利用变形面板对花瓣进行精确旋转复制，即可绘制出均匀分布花瓣的花朵了。(2)跟学实例要点:在本实例的跟学过程中，有两点特别重要，一是在使用椭圆工具和箭头工具绘制完一个花瓣后， 一定要移动注册点到适当的位置；二是使用“变形”面板对花瓣进行精确旋转的角度分析，如在本例中要画片花瓣的花朵，那么花瓣所要旋转的角度为360 除以 5，即 72 度。点取“拷贝并应用变形”按扭四次，即可得到拥有五片花瓣的花朵。一定要分析透彻，使学生达到举一反三，灵活运用的目的。实例二：绘制小汽车本实例教学运用任务驱动法的教学模式(1)布置任务：绘制“甲壳虫”轿车(2)分合作小组：将班级学生按“组内异质，组间同质”的原则分好各合作学习小组，每组45人组成。根据学生的能力和素质水平分为ad，其中a、d的学生须具有较好的协调能力，a属于优等学生，要求他们不但完成小汽车的绘制，还要在制作过程中，指导帮助本组的基础比较薄弱的其他同学。b、c属于中等学生，要求完成小汽车轮廓的绘制。(3)分析任务：对照实例，学生讨论并列举绘制小汽车所涉及的知识点。(4)完成任务要点：在本实例的跟学过程中，首先要注意圆的部分的切分方法与“对齐”命令的运用；其次是小汽车的车轮装饰部分绘制。 用矩形工具绘制一个细长圆角矩形，使用复制工具将圆角矩形复制 4 个，并使用变形工具中的旋转命令，对 5 个圆角矩形旋转，并用箭头工具将它们移动成为花瓣状，在点上些小圆圈，也可以利用变形面板进行精确旋转复制绘制，如绘制花瓣的方法。最后要让学生对整辆车注意颜色的观察，要有立体感，汽车的外表进行装饰中，最好要运用渐变颜色填充。对车的内部进行装饰，可让学生自己去创意，添加椅子、方向盘以及后视镜等部件。通过本任务的完成，使学生熟练掌握flash mx选择工具与编辑对象的一般方法与技巧。 (5)作品评价评价标准小轿车的轮廓结构布局合理；轿车颜色填充色彩搭配美观，外表装饰设计新颖、有创意。评价形式将作品通过网络展示给全班同学，每组的第一份作品由教师示范点评，其余作品由学生互评。四、归纳小结1.学习了flash mx选择工具的使用技巧。2.掌握flash mx编辑对象的一般方法。3.学会利用辅助学习软件自主探究的学习方法。五、课后作业1.绘制“卡哇咿”小猪。（要求全体同学完成）2.绘制花蝴蝶。（要求中等层次以上的同学完成）3.制作荷兰风车。（要求合作学习小组的优等学生完成）23 文本编辑文字工具的作用是用来在工作区中输入文本。它设有附属工具，是一个含字符，段落，广本的三个选项卡的浮动面板。其作用与字处理软件中的十分相似，操作时的步骤也基本相同。打开这个附属工具的方法之一：在启动面板条上按“a按钮后选中所需的选项卡央其面板上确定你所需的参数即可，另外在菜单栏上设有“文本”下拉菜单，其中没有字体，尺寸，风格，排列等属性选项命令。选定文字工具按钮a，在舞台上单击后便可在文字框内输入文字了，文本框的右上角的小圆圈表示输入文字的宽度不受限制。如果文本框的右上角变为小方框，则表明文本框设定了宽度，只要输入文字超过文本框宽度时就自动换行。两者是相互转变的，拖动小圆圈则变为小方框，双击小方框则变成小圆圈，如下所示。1、字体的修改flash mx对字体等属性的修改，提供了更完善的支持，除了菜单中有“文本”菜单命令外，还提供了一个三合一的浮动面板，可以对字体进行精细地高调整。前面已有描述不再重复。由于用文字工具写出的文字是属于文字组件，对文字组件的修改必须是整体修改。若要对其中的部分文字个别作修改，应事先将文字组件换成舞台对象即矢量图形。2、段落的修改在文本浮动面板上单击菜单“段落”选项卡，将弹出段落属性对话框，从中可设置首先文字或行距等属性。3、柔化填充边缘柔化填充边缘，可以将填色区域的边沿柔化。单击菜单“修改”/“外形”/“柔化填充边缘”命令，经过柔化过的边缘可以达到一定的特殊效果。4、制作颜色渐变色1单击常用工具栏的按钮，新建一个动画。单击工具箱中的a按钮，单击启动面板上下班a图标，打开“字符”浮动面板，或选择菜单“窗口”/“面板”“文本选项”命令将文本的字体大小设置不68，字体设置为arialblack,然后在工作区中新建一个文本对象。如图2-3-1(a)所示。2选中该文本对象，选择菜单“修改”/“分解组件”命令，打散该文本对象，此时文本对象变成如图2-3-1(b)所示。3单击工具箱中的按钮，单击其属性面板中的按钮，然后从调色板窗口中选择一种合适的渐变方式2-3-2(a)所示。4单击属性面板中按钮，从弹出的模式选择菜单中选择第一种模式：/不封闭空隙。5在工作区选定的各个文字区域中单击鼠标，填充该区域，使用箭头工具在工作区空白处单击取消选择，此时所创建的渐变效果如图2-3-2(b)所示。6单击工具箱中的按钮，单击其属性面板中的按钮，然后单击工件区中一个文字，例如f，如图2-3-3(a)所示。此时该文字周围出现了边界条和旋转的点，如图2-3-3(b)所示。7鼠标指向拖动小方框，按下左键拖曳可改变边界的位置，见图2-3-3(c).鼠向移动的小圆圈，按下左键拖曳可改变渐变的范围，见图2-3-3(d).鼠标指向旋转小圆圈，按下左键拖曳可改变渐变的方向，见图2-3-3(e)，图2-3-3(f)，便是调整后的效果。8同样方法，将其他字母一一作不同调整，最后含有效果的渐变字便产生了。见图2-3-4。9第一个作品，千万别忘了保存，按下来选择菜单“文件”/“保存”命令。在出现的对话框内，系统默认保存类型为“flahs影片”，你只要指定路径和文件名即可。借鉴此例，读者可作出其他风格的文字，例如：空心字浮雕字等。24 图形导入导入位图，就其形式而言相当于拍摄电影时演员剧组，在其中存放有组件图像声音等。每个flash动画文件都有一个库。单击启动面板上的图标，或ctrl+1键，或选择菜单“窗口”/“图库”命令，便打工了动画文件的库，如图示2-2-6所示。当然，新建动画文件的库是没有内容的，只有通过创建组件和导入图像声音等操作充实动画的文件的库。库的管理和操作类似于windows资源管理器，其中：按钮可新建一个组件；按钮可新建文件夹，当图库中组件太多时，可将众多组件集中放在一文件夹中；按钮可打开库属性窗口，从而可置相关库属性；按钮可删除库中指定的对象。为了方便用户的制作，flash程序本身也提供了一些共享库，通过选择菜单“窗口”/“共享图库”级联菜单中的命令就、可调用这些共享库，其中有按钮库图形库，电影片库，声音等。其实，只有这些库在制作动画过程中是远远不够的。flash mx新增可以直接调用另外珍上flash源文件的组件库，因此，当发现某个flash动画中有自己感兴趣的组件声音等，你可以通过菜单“文件”/“以图库打开”或“以共享图库打开”这两项命令，便可实现将指定源文件中的图库调到你当前的设计窗口中来，真正体现图库共享。组件，就是指具有独立身份的，有独立的时间轴舞台，可以反复引用。在舞台上对组件的引用，就构成了实例。一旦组件本身改变了，则改变的实例也发生相应的变化，利用这种特性，就可以快速地改变整个flash动画中的相同内容。在flash作品中有些图形元素重复应用，就应该将这些对象制作成组件。这样，即可以大大减小flash动画文件的大小。又可以以缩减加载flash动的网页下载时间。241制作大小变化的球你想感受flash的强大魅力，想亲手编辑一段动画然后陶醉在其中吗?现在就开始始做一个大小变化的球动画.1、新建一个动画.选择菜单插入/新建组件命令,弹出了组件属性窗口,在名称框中输入:ball在类型中选择图形,确定后系统进入组件编辑的界面.请注意在场景窗口的左上角场景1的右边增加一个组件ball.2、选择工具栏中的画圆工具,单击菜单窗口/面板/描绘命令,打开描绘浮动在板,选择线粗为2.0,在作图区中央画一个圆,在画的过程中会出现一个粗边的上圆圈,令鼠标在拖曳的过程中始终处于正小圆圈,画出来的就是一个正圆,若所画的小球偏离中心坐标点,可使用对齐工具面板,见图2-5-5所示.首先选中小球,单击排列/分布场景按钮,然后分别按下中间垂直排列按钮和水平中间分布按钮,结果小球对齐到坐标的中心点了.ball组件完成了,后面我们将引用到这个组件.3、将鼠标移动到左上角的场景1标签处,单击一下回到场景1.4、单击启动面板上的图标,调出图库,选中组件,图库中便出现了组件ball的预览.用鼠标将组件内容拖入场景1中,并把它放在画布中央,然后关闭图库.5、在时间线窗口编辑区的第15帧处点击一下,如图2-5-6所示.6、单击菜单插入/关键帧命令,结果在第15帧复制了一个关键帧,见图2-5-7所示.7、选中第15帧点击左边工具栏的选取按钮,再点选工具栏的属性面板中的按钮,准备对小球进行放大.即用鼠标拖曳球体右上角的小方格,将实例ball放大.如图2-5-8所示.8、这是最关键的一步,使它动起来!在第1帧到第15帧之间任一帧处双击鼠标,弹出帧数浮动面板,如图2-5-9(a)所示.在对话框中的变化下拉列表框中选择动作.保留其作设置,关闭对话框.此时发现在时间内的对象从第1帧到第15之间出现一个长箭头,如图2-5-9(b)所示.表明在这两个关键帧之间将产生动画过渡.9、作品完成了,急着想看动画效果吗?单击菜单控制/测试影片命令,系统立刻打开一个播放器,播放动画,从窗口可以看到小球体大小变化的动态效果了.若有不足之处.可以关闭播放器.回到编辑界面中,重新改动,直到满意为止.10、第9步中,我们执行了测试影片的命令,可在播放器中观看动画效果,同时,系统还在相同目录中自动生成一个流文件*.swf,而且文件名与源文件的文件名相同.flash流文件可以用各种播放器直接播放,也可以插入到网页中.若你要中选路径和文件名的话,也可执行菜单文件/导出电影命令,在出现的对话框内,选择保存类型为flash电影,此时,你可重选路径或文件名即可.提示:由于使用的是汉化版软件,有些名词的程序不太一样,例如:mofion名词在这里翻译为动作,有的书上翻译为运动或移动242制作形态变化的动画示例圆形变方形的动画1、新建一个动画.选取工具栏中的画圆工具按钮,单击菜单窗口/面板/描绘命令,打开描绘浮动面板,选择线粗为2.0,选择好填充颜色.在作图区左侧画一个实心的圆形.2、然后在时间线窗口编辑区的第15帧处点一下.3、单击菜单插入/空白关键帧命令,结果在第15帧复制了一个空白关键帧,见图2-4-10所示.4、选择工具样的矩形工具按钮,还可以另设一种填充颜色,在工作区的右侧画一个矩形,现在我们指定了起始帧为圆形,结束帧却为矩形,如何变化呢?5、这是最关键的一步,使它动起来!在第1帧到第15帧之间任一帧处双击鼠标,弹了帧数浮动面板,如图2-4-11(a)所示.在对话框中的变化下拉列表从第1帧第15帧之间出现了一个长箭头,如图2-4-11(b)所示.表明在这两个关键帧之间将产生形状过渡.图2-4-11所示表明在这两个关键帧之间将产生形状过渡;表示由第1帧过渡到第15帧,中间那些则由程序自动生成.图2-4-12是通过捕捉其运行的轨迹所得,可帮助我们全面地理解运动中的变形情况.完成之后你可以按回车键测试结果,怎么样?是不是是很有意思!思考:1、综合上面几个例子,我们使用过插入关键帧和空白关键帧的操作,试问它们的区别是什么?2、在测试动画效果时,我们使用过按ctrl+enter键和enter键的操作,试问它们的区别是什么?3、在地形状变化过程中施加点其他效果变化可以吗?第三章制作简单动画【课 题】制作简单动画【节 标 题】3.1 flash mx图层3.2 帧并帧动画3.3 形状渐变动画3.4 创建运动渐变动画3.5 遮罩层动画3.6 引导层动画【教学目标】理解层的概念及作用理解帧的概念及作用了解帧并帧动画熟练形状渐变动画掌握创建运动渐变动画学会应用引导层和遮罩层的功能掌握动画的制作入门【教学要点】层的基本操作，层的状态及属性各种层的应用初步帧的基本操作，帧的属性设置，关键帧过渡帧的应用进阶实例中的关键步骤【教学模式】基于任务驱动法，结合演示引导启发式的教学模式及教材的自主探究学习的教学模式【课前准备】1.制作教学辅助课件，引导学生认真阅读教材，为学生自主探究学习提供帮助。2.将教学辅助课件及实例素材发给每位学生。3.班级学生按“组内异质，组间同质”的原则分好各合作学习小组，每组45人组成。【教学重、难点】重点：flash mx软件绘图中编辑对象的一般方法。难点：flash mx软件绘制图形的操作技能。【课时安排】（26课时）3.1 flash mx图层（一课时）3.2 帧并帧动画（三课时）3.3 形状渐变动画（四课时）3.4 创建运动渐变动画（六课时）3.5 遮罩层动画（六课时）3.6 引导层动画（六课时）3.1 flash mx图层层是flash mx中的一个重要概念，掌握好层的作用，你的flash技术就路上了一个新台阶。3.1.1层的概念及作用一个层，就好比一张透明的薄纸，每张纸上面画着一些图形和文字，而一幅画就是由许多张这样的薄纸叠合在一起而成的，在最上面的一层看得到最下面的一层，见图3-1-1(a)所示。若修改其中的任一层却不会影响其余任何一层，见图3-1-1(b)所示。这是层的概念的核心，又是层的作用所在。层的特点：1，在每一层里，除了画有图形或文字的地方以外，画布的其余部分是透明的，即层之间是可以透视的。2，你试着修改其中的任意一层，可看到其余的层丝毫没有受影响。关于层的部分图标及按钮含义在2，2，1小节中已有叙述。3.1.2层的建立，编辑和删除一，新建一个层每次打开一个新的flash时都会有一个默认的层“图层”，我们可以在这个层上加入各种对象，例如，图形或文字。若要加入一个新层，单击左下角的图标，就看到新增的“图层2”了。用鼠标双击，还可以为该层改名，当动画中包含了许多层时，我们有必要为每一个新建层取一个相应的名字，才不到混乱。经验可知，对场景中的静态对象和动态对象应用不同层分割开来。图标是用来添加引导层的。二、选择一个层可以用以下三种方式来选择一个层：1， 单击该层的名称2， 选择属于该层的帖序列中的其中一个或多个帖；3， 在编辑区选择一个对象或组件。选中后的层，即为当前层，在时间线窗口内对应层的所有帧均被选中，在编辑区中该层对应帧的对象也均被选中。按住shift键还可以同时选择多个层。三，复制一个层选中要复制的层，选择菜单“编辑”|“复制帧”命令，然后，建立一个新层，并设为当前层，选择菜单“编辑”|“粘贴帧”命令即可。四、删除一个层选中要删除的层，然后用快捷方法：单击右下角的图标即可。五、改变层的次序有时层的默认次序会不合我们的要求，这时就需要改变层的次序。指向要移动的层，按住鼠标左键不放把它拖曳到合适的地方。313层的状态及属性设置一、 层的状态层有隐藏、锁定、外面显示模式等六种可能状态，有的已在2.2。1小节中叙述。其余的状态介绍一下：图标1：表明该层处于活动状态，该层是当前层，可以对该层进行各种操作。注意：只有当前层处于活动状态时才可以被编辑或修改。图标2：表明该层处于活动状态，但却不能对它进行任何修改，因为该层当前被设置为锁定或隐藏状态。图标3：表明该层在编辑区内是隐藏的，即在编辑的时候是看不见的，但在测试和输出视频时却是看得见的。当一个层隐藏时，是不能对它进行修改的。当我们想编辑某个层而不想被其他层干扰时，就可以使用该功能隐藏其他层。图标4：表明该层处于正常状态，即无任何特殊设置。二、 层的属性在层控制区中，按鼠标右键单击任意一个层，都会弹出一个层的操作菜单，如图312（a）所示。全部显示：表示将所有层设置为可视的状态。锁定其他图层：表示将该层以外的其他层设置为锁定状态。隐含其他图层：表示将该层以外的其他层设置为隐藏状态。属性：用对话框显示图层的参数设置，见图312（b）所示。一般说来图层的很多属性都可以在这里修改。修改后的结果会即时反应在时间线窗口的层控制区中对应位置上：，其实也要直接在层控制区的相应图标位置上单击或双击便可实现相应操作。从图层显示不难看出，该图层是一个普通图层，名称为“buttons”、不显示、不锁定、图层高度为100%。3.2 帧并帧动画帧是一个和层不同的概念同等重要的概念，在制作flash动画的时候，帧的应用贯穿于其中，可以说如果不懂的概念和用途，基本上就可以说还不会用flash。因此我们在学习的时候，应该真正地掌握帧的概念和应用。321帧的基本概念一、帧帧，即一幅图像。在flash的时间线窗口用小方格代表。有点类似于电影胶片中的影像格。在flash中采用定义帧的方法来制作动画，不过flash采用的技术避免了人工将一幅幅图像组合起来的繁琐工作，只要定义起始关键帧，再定义结束关键帧，flash就会根据指令，模拟中间的变化过程，如缩放，旋转，变形等，这一机制使我们的工作变得轻松而简便。flash mx中各种帧的形状和定义如图3-2-1所示。二、关键帧关键帧在制作动画的过程中是非常关键的，只有定义了关键帧，才可能定义动画的每一个图像，关键帧定义了一个过程起始和终结，又可以是另外一个过程的开始，那么如何定义关键帧呢？插入关键帧：点击一帧格或空白关键帧或过渡帧格，使其变为的颜色，然后f6快捷键，或单击鼠标右键在弹出快捷菜单中选择“插入关键帧”即可。注意此时后一个关键帧与前一个关键帧的内容是完全一致的。因此，只需要很简单的两个关键帧，就可以制作很多有趣的动画了。空白关键帧：在一个关键帧里面什么对象也不添加。点击一帧格使变为颜色，然后，单击鼠标右键在弹出快捷菜单中选择“插入空白关键帧”，或从菜单栏的“插入”菜单中也能选择。新建图层的第1帧初始为空白关键帧。清除关键帧：选定一个或多个关键帧，单击右键，选择”清除关键帧“或按shift+f5快捷键即可。三、普通帧普通帧的存在必须附于关键帧，普通帧中的内容延续了前一个关键帧的内容。一般利用普通帧的插入来处长各种对象的显示时间。按f5快捷键。或单击鼠标右键在弹出快捷菜单中选择“插入帧”。四、过渡帧在关键帧之间一般来说要用过渡来连接。过渡帧可能会呈现各种不同的状态，有移动过渡形式，也有有问题的过渡形式，甚至可以是空白关键之间的过渡形式。flash mx的机制让过渡能够适合关键帧的变化，从而平滑地连接过渡关键帧之间的影格。过渡帧一般是由过渡方式来决定的。过渡方式有3种：没有运动形状。如图3-2-2所示。说明：“shape单词在汉化时有的翻译为“图形”，有的翻译为“形状”其实都是指同一个单词。五、复制与粘贴帧在制作动画的过程中，有一些帧是需要重复利用的。选定这些帧后直接单击鼠标右键，在弹出的快捷菜单中选择“复制帧”命令将之复制，到剪贴板中，然后在要粘贴的帧位位置上单击右键，在弹出的快捷菜单中“粘贴帧”命令就可实现粘贴。反转帧，它可以使选定的一组帧按照顺序反过来，最后一帧变为第一帧，播放顺序也刚好掉转。例如，有一个椭圆旋转的同时并缩小的动画，若使用反帧功能，其结果是椭圆反旋转的同时也放大了动画。322帧属性设置帧属性的设置一个基本知识。通过对帧属性的设置来改变帧的一些基本设置，从而很好地控制帧在动画制作过程中的就应用。在时间线窗口有有效帧内双击鼠标，便自动弹出成果个浮动面板：帧动作声音帧数。各个窗口内容如图3-2-3(c)所示。一、标签有时为了控制影片播放的流程，或为了在制作过程中标识一些重要的关键帧，我们还设定标签。在“帧数”面板中标签输入框中填写帧的名字，名字自定，只要容易，标志明显，就可以。二、帧变化类型在“帧数”面板中没有“变化”列表框，提供了三种变化类型：没有运动形状，以决定相应的过渡方式，形成典型的过渡帧。这就是运动过渡帧和形状过渡帧。所谓“运动”过渡是指在变化过程中，可以改变对象的大小位置颜色透明度等等，但必须符合限制条件：运动过渡的起止对象一定都是层叠对象，且必须引用的是同一个对象。所谓”形状”过渡是指在变化过程中，可以改变对象的形状位置颜色透明度等等。同样，必须符合限制条件：形状过渡的起止对象一定都是舞台对象；否则，事来的后果生成了一个无效的过渡帧。当然了舞台对象与层叠对象的转换是非常方便的。3.2.3逐帧动画:小脚丫脚印逐帧动画实际上就是采用手工绘制的传统动画.对于较为复杂的动画如人物的行走,表情等等,由计算机自动生成显然实现比较困难,但是在flash中肯定是不能自动形成的.倘若一定要达到这种目的,那么就只能由逐帧动画实现,也就是必须手工一帧一帧地绘制,而且要求帧与帧之间的对象有细微的变化.显然,同样一个动作要求做做得越细腻,那么需要绘制的帧也就相对越多,如此制作难度,时间也随之大大增加.逐帧动画只须要按照创建关键帧画出当前帧的画面的方法就可以了,现在制作一个小脚丫脚印的例子。一、绘制一双小脚丫1在当前层的第1帧处，使用刷子工具在工作区中画出一个脚丫的样子来，如图334左图所示。选中整个脚丫，选择菜单“修改”“群组”命令，或按ctrl+g将对象组合。2 选中组合脚丫，然后选择菜单“修改“转换”“水平翻转”命令，就得到一个右脚丫。如图334中图所示。3 同时选中两个脚印，选择菜单“窗口”“面板”“转换”命令。打开了“转换”浮动面板，将旋转的值设为45，并移动到画面的左上角。如图334右图所示。一、 绘制一双双小脚丫1、 现将鼠标定位在经5帧处，按f6键创建关键帧。用选取工具选中左脚丫，同时按住ctrl键不放，拖动脚便得到左脚丫的副本，将它移动适当的位置松开。2、 鼠标定位在第10帧处，按照上一个步骤介绍的方法再复制一个右脚脚丫。3、 如此下去，大约再增加六七个脚丫就可以了。按ctrl+enter键观看一下动画效果，如图335左图所示。二、 修饰小脚丫脚印为了使动画的效果更加逼真，看起来就好像脚印真的在雪地上慢慢消失一样，可以使用改变填充颜色的来达到减淡脚印的效果。这个操作需要对每一关键帧进行修饰才好。1、 鼠标定位在第5帧，选中最初的一双小脚丫，按ctrl+b键，将其打散，再选择菜单“窗口”“面板”“填充”命令，打开“填充”浮动面板，按面板上的颜色按钮改变选中对象的填充颜色。2、 鼠标定位在第10帧上，选中最初的一双脚印，按ctrl+b键，将其打散，再选择菜单“窗口”“面板”“填充”命令，打开“填充”浮动面板，按面板上的颜色按钮改变选中的图像的填充颜色；再重新选择迈出第一步的脚印，按ctrl+b键，将其打散，改变其填充颜色。3、 如此下去，对每一个关键帧，都要将走过的脚印其填充颜色改变一下，到最后一帧，最初的一双脚印的填充颜色为eeeeee，其他的脚印填充颜色依次为dddddd,#cccccc,#bbbbbb,#aaaaaa,#ffffff.最终动画效果如图335右图所示。使用逐帧动画可以随心所欲地创建各种动画效果，缺点就是制作起来十分费时费力，而且生成的动画体积偏大。因此，建议不要过度地应用逐帧动画，否则flash制作动画的优势就不能显示出来。3.3 形状渐变动画形状渐变在flash动画的制作中独具特色，大部分应用于文字、图形间相互变化。可以说，形状在过渡变化上比运动过渡更加随意。不管运动过渡中的对象在外形和效果如何变化，都可以发现对象的影子；而形状过渡则不然，可以有很大的任意性只要是形状都可以以形状过渡的方式定义过渡帧。在此，以形状过渡为例，我们做一个圆球变文字。具体操作步骤如下：一、 新建一个“ball”组件1、 新建一个动画.按ctrl+m快捷键，打开“影片属性“窗口，设定动画的播放时间为每秒12帧，高度为300，宽度为150。设置背景白色。2、 按ctrl+f8快捷键，新建一个图形组件，并起名为“ball”，进入组件编辑环境。3、 在绘图工具栏内选取画圆工具，打开线段“颜色”窗口，选择颜色为无色，即。再打开填充颜色窗口，选择“渐变”一行中的第1种渐层颜色。4、 在作图区中心画一个实心圆，画完以后用对齐工具以使它的中心和作图区的中心重合。二、 建立第一个字的形状过渡1、 单击“场景1”标签，返回到主场景，将图层1改名为“ball”。按ctrl+l快捷键，打开“图库”将组件“ball”拖入到场景中。2、 新建一图层，改名为“字1“。在第2帧上按f6快捷键插入一个关键帧，在“ball”图层的第1帧处单击鼠标右键，在弹出的菜单中选择“复制帧”，再到“字1”图层的第2帧处单击鼠标右键，在弹出的菜单中选择“粘贴帧”。这时，“字1”图层的第2帧上就有了一个小球的图形。3、 选中小球，按ctrl+b快捷键，或选择菜单“修改”|“分解组件”命令，打散图形。此时小球变成矢量图形，呈灰色网格选择状态。4、 单击“字1”图层的第10帧，按f6快捷键，插入一个关键帧，此时将在工作区显示的小球删去。5、 在工具箱中选择文字编辑工具a，单击启动面板上的a图标，打开“字符”浮动面板，在其中选择“黑体”字体，大小为55，颜色选所喜欢的一种，然后，单击工具区在文本框内输入一个字，例如：旅游的“旅”字。6、 这是很关键的一步。单击洋葱皮按钮的第1个帧，这时，前一帧的小球以半透明的方式出现在当前的帧中，如图3-3-14所示。选中“旅”字，将其移到正对小球的位置。按ctrl+b快捷键，打散图形。此时字变成矢量图形，呈灰色网格选择状态。7、 双击“字1”图层的第2-10之间任一帧处，在弹出的“帧数”浮动面板上设置“变化”类型为“图形”，结果是第2-10之间生成了形状过渡帧。如图3-3-15扭不。三、 建立第二个字的形状过渡1 在“ball”图层的第10帧处，按ctrl+l快捷键，打开“图库”窗口，将组件“ball”拖入到场景中。2 新建一个层，并改名为“字2”。在第10帧上按f6快捷键插入一个关键帧。在“ball”图层的第10处单击鼠标右键，在弹出的菜单中选择”复制帧“，再到“字2”图层的第10帧处单击鼠标右键，在弹出的菜单中选择“粘贴帧”。这时“字2”图层的第10帧上也有了一个小球的图形。3 选中小球，按ctrl+b快捷键，打散图形。4 单击“字2”图层的第20帧，按f6快捷键，此时将在工作区的小球删去。5 同样，完成第二个字“游”的输入。6 单击洋葱按钮的第1个按钮，这时，第2个小球也以半透明的方式出现在当前帧中，选中“游”字，将其移到正对小球的位置。按ctrl+b快捷键，打散图形。7 双击“字2”图层的第10-20之间任一帧处，在弹出的“帧数”浮动面板上设置“变化”类型为“图形”，结果第10-20帖之间生成了一形状过渡帧。见图3-3-15所示。此时，单击回车键便可看到小球变化成“游”字的动态过程了。8、别忘了，最后要在“字1”图层的第20帧处插入一个空白关键帧。技巧：为能将文字位置精确的调整与小球重合，可用4个方向的光标键作上、下、左、右移动微调操作。思考：1、能否取其他形状例如任意几何形状作最初的对象？2、 是否可以让两文字变回去？若发生形状过渡有错误，应该从哪方面着手去检查？3.4 创建运动渐变动画在flash制作中，运动过渡的应用是最常用的，可以说绝大多数的flash动画中都大量应用了运动过渡。在此，以运动过渡为例，我们做一个蹦跳的皮球。为了模拟真实的情况，皮球的下落要近似一个自由落体运动，并且在皮球落地的时候还会变形，然后，再弹起、步骤如下：一、 制作小球组件1、 新建一个动画。按ctrl+m快捷键，打开“影片属性”窗口，设定动画的播放时间为每秒12帧，高度为300，宽度为150。设置背景白色。2、 打开菜单“查看”“网格”“显示网格”选项，使编辑窗口中显示网格，同时，再次选择菜单“查看”“网格“显示网格”选项，使得所建对象的定位总是贴近在网格线上。3、 按ctrl+f8快捷键，新建一个图形组件，并起名为“皮球”，进入组件编辑环境。4、 在绘图工具栏内选取画圆工具，打开线段“颜色”窗口，选择“颜色”窗口，选择颜色为无色，即。再打开填充颜色窗口，选择“渐变