flash基础动画全解课件

1、Flash cs5 动画制作案例教程 第五模块 基础动画第1页，共35页。认识计算机案例10 顽皮的猴子逐帧动画 案例11 神奇的夜晚补间形状 案例12 秋天来了认识元件案例13 童年的记忆传统补间动画案例14 海底世界补间动画第2页，共35页。案例10 顽皮的猴子逐帧动画图5-1 “顽皮的猴子”效果图 案例10 顽皮的猴子逐帧动画案例描述 用逐帧动画打造顽皮的猴子效果，如图5-1所示。第3页，共35页。案例10 顽皮的猴子逐帧动画操作步骤 1、启动CS5，新建一个3.0文档，保存为“顽皮的猴子”2、把“图层1”改名为“椰子树”，执行“文件导入导入到舞台”，选择“椰子树”3、复制7棵椰子树4、

2、使用“选择工具”和“变形”按钮，将“缩放宽度”、“缩放高度”均设为50%，调整位置如图第4页，共35页。案例10 顽皮的猴子逐帧动画5、选择右下方的椰子树，执行“修改变形水平翻转”6、新建一个图层，命名为“猴子”7、执行“文件导入导入到舞台”，选择“猴子1”，放到合适位置8、在“猴子”图层的第10帧单击右键选择“空白关键帧”（或按F7），执行“文件导入导入到舞台”，选择“猴子2”，导入舞台。9、用同样的方法在第20帧、30帧分别导入“猴子3”、“猴子4”10、调整“猴子1”到“猴子4”四张图片的大小和位置11、按Ctrl+S保存，按Ctrl+Enter测试第5页，共35页。案例分析利用“变形工

3、具”对提供的椰子树和猴子的图片进行一系列的调整。制作关键帧，利用“变形工具”和“编辑多个帧”逐帧调整猴子的位置和大小，实现顽皮猴子 的效果。 5.1 时间轴的基本操作案例10 顽皮的猴子逐帧动画1. 时间轴的基本操作(1) 更改时间轴中的帧显示第6页，共35页。(2) 绘图纸外观通常情况，在某个时间舞台上仅显示动画序列的一个帧。为便于定位和编辑逐帧动画，可以在舞台上一次查看多个帧，播放头下面的帧彩色不透明显示，而其它帧是暗淡透明显示。 在舞台上同时查看动画的多个帧。 控制绘图纸外观的显示。 更改绘图纸标记的5种形式。2. 播放头 播放头是在“时间轴”面板上用于指示动画播放的指针。要转到某帧，可

4、单击该帧在时间轴标题中的位置，或将播放头拖到所需的位置。 要使时间轴以当前帧为中心，单击时间轴底部的“帧居中”按钮。 3图层 图层可以帮助组织文档中的插图，可以在图层上绘制和编辑对象，而不会影响其它图层上的对象。在图层上没有内容的舞台区域中，可以透过该图层看到下面的图层。对图层的相关操作 （1）创建图层和图层文件夹（2）编辑图层（3）查看图层案例10 顽皮的猴子逐帧动画第7页，共35页。4帧。帧分为普通帧、关键帧和过渡帧三种类型，可以对帧进行如下修改。 （1）选择帧（2）插入帧（3）复制或粘贴帧（4）删除帧（5）移动关键帧及其内容（6）将关键帧转换为帧案例10 顽皮的猴子逐帧动画第8页，共35

5、页。5.2 创建逐帧动画 逐帧动画是一种常见的动画手法，其原理是在“连续的关键帧”中分解动画动作，即每一帧中的内容不同，连续播放而成动画。由于逐帧动画的帧序列内容不同，不仅增加制作负担而且最终输出的文件量也很大，但逐帧动画的优势也很明显，其与电影播放模式相似，很适合于表现细腻的动画，如3D效果、人物或动物急剧转身等等效果。案例10 顽皮的猴子逐帧动画1逐帧动画的概念和在时间帧上的表现形式2创建逐帧动画的方法 用导入的静态图片建立逐帧动画第9页，共35页。案例11神奇的夜晚补间形状案例描述制作补间形状动画，实现从图5-2到图5-3的变形效果 图5-2案例11神奇的夜晚补间形状图5-3第10页，共

6、35页。案例11神奇的夜晚补间形状案例分析初步认识形状补间的应用对象。熟悉绘制简单形状。学习“翻转帧”功能的用法。操作步骤 1、启动CS5，打开“神奇的夜晚”，“图层1”命名为“黑夜背景”。新建一个图层，命名为“月亮”。选择“椭圆工具”，笔触颜色设为无，填充颜色设为黄色：FFFF33，单击“月亮”图层的第1帧，在舞台左上角画一个圆，如图。锁定“黑夜背景”图层第11页，共35页。案例11神奇的夜晚补间形状2、在“月亮”图层的第20帧单击右键选择“插入关键帧”命令，使用“选择工具”改变月亮的形状，如上图3、继续调整月亮的形状，将月亮的两段调尖。将鼠标移动到月亮的上尖角处，按Ctrl 键同时拖动鼠标

7、，调整月亮的两端如下图第12页，共35页。案例11神奇的夜晚补间形状4、单击“月亮”图层的第20帧，将月亮图形拖动舞台右边，如图15、将鼠标置于“月亮”图层第120帧的位置上，单击右键，选择“创建补间形状”如图26、在“月亮”图层第25帧处单击右键，选择“插入帧”命令，或按F5，如下图3图2图1图3第13页，共35页。案例11神奇的夜晚补间形状7、选择“月亮”图层的第125帧，单击右键，选择“复制帧”，在第26帧处单击右键，选择“粘贴帧”命令，如下图所示8、选择“月亮”图层的第2650帧，单击右键，选择“翻转帧”命令。9、按Ctrl+S保存文件，按Ctrl+Enter测试第14页，共35页。5

8、.4 补间形状制作1补间形状的特点（1）组成元素（2）在时间轴面板上的表现形式 案例11神奇的夜晚补间形状图5-4形状补间在时间轴上的表现 2补间形状的制作方法 （1）准备工作（2）创建补间形状图5-5变形的过程 第15页，共35页。5.5 使用形状提示1形状提示的作用案例11神奇的夜晚补间形状图5-6起始形状和结束形状中的形状提示2使用形状提示应遵循的准则 在复杂的补间形状中，需要创建中间形状然后再进行补间，而不要只定义起始和结束的 形状。确保形状提示是符合逻辑的。例如，在一个三角形中使用三个形状提示，则在原始三角形和要补间的三角形中它们的顺序应相同。按逆时针顺序从形状的左上角开始放置形状提

9、示，补间的效果最好。 3使用形状提示的方法第16页，共35页。图5-7起始形状提示 图5-8结束形状提示 图5-9提示点分布案例11神奇的夜晚补间形状第17页，共35页。4查看所有形状提示5删除形状提示案例11神奇的夜晚补间形状第18页，共35页。案例12 秋天来了认识元件案例12 秋天来了认识元件案例描述使用元件，创建如图5-10所示的不停摆动的小草的效果。图5-10“秋天来了”动画效果 第19页，共35页。案例分析通过调用影片剪辑元件，从而体会到元件的在动画制作中起到的作用。通过改变元件实例的“色调”、“大小”等属性，练习元件属性的初步设置。案例12 秋天来了认识元件5.6元件的分类与创建

10、1.元件概念图5-11“库”中的元件第20页，共35页。2.元件的分类在FLASH中，有“图形元件”、“影片剪辑元件”和“按钮元件”三种元件类型。3.创建元件（1）直接创建影片剪辑元件 案例12 秋天来了认识元件图5-12创建元件对话框 图5-13元件编辑模式 练一练 创建“小草”影片剪辑 绘制小草图形制作摆动的小草第21页，共35页。4.转换元件（1）将现有对象转换为影片剪辑（2）将现有对象转换为按钮元件（3）将现有对象转换为图形元件5.编辑元件通过以下方式编辑元件：（1）在当前位置编辑元件案例12 秋天来了认识元件图5-14“在当前位置编辑”的显示效果（2）在新窗口中编辑元件 （3）在元件

11、编辑模式下编辑元件图5-15元件编辑模式窗口第22页，共35页。案例12 秋天来了认识元件5.7使用库面板1.“库”面板概述图5-16“库”面板2.调整库面板大小3.更改列宽4.排序库项目 5.重命名库项目6.复制库中的元件第23页，共35页。7.使用文件夹8.更新库中的导入文件9.删除库项目10.使用库项目 图5-17打开文件夹 图5-18“更新”面板图 11.使用公用库 案例12 秋天来了认识元件第24页，共35页。案例12 秋天来了认识元件图5-19将“公用库”项目buttons.fla拖入到当前库5.8.元件的实例1. 创建实例 图5-20用同一元件创建的多个小草实例第25页，共35页

12、。案例12 秋天来了认识元件2. 设置实例的属性为实例命名更改实例类型 更改实例颜色应用混合模式 交换实例5.9 影片剪辑与图形元件的关系1.二者的关系在Flash的元件中，图形元件和影片剪辑元件都可以包含动画片段，二者也可以相互嵌套、转换类型和相互交换实例，但它们之间也存在很多的差别 2.验证方法图5-21实例的属性和时间轴第26页，共35页。案例描述 制作传统补间动画，实现照片的透明度及形状的变化如图5-22所示。案例13童年的记忆传统补间动画图5-22童年的记忆第27页，共35页。案例13童年的记忆传统补间动画案例分析制作传统补间动画实现照片的透明度及形状的变化。在传统补间动画“属性面板

13、”中设置顺时针旋转效果。5.10 传统补间动画制作传统补间动画也是Flash中非常重要的表现手段之一，与“形状补间动画”不同的是，补间动画的对象必需是“元件”或“成组对象”。运用补间动画，可以设置元件的大小、位置、颜色、透明度、旋转等属性。1补间动画的特点 （1）组成元素 （2）在时间轴面板上的表现形式 图5-23 创建补间动画 图5-24 补间没有成功 第28页，共35页。案例13童年的记忆传统补间动画2补间形状和补间动画的区别 3补间动画的制作方法5.11 补间动画的属性1补间动画属性面板图5-25 “自定义缓入/缓出”对话框 图5-26设置动画的缓入/缓出值 第29页，共35页。案例13

14、童年的记忆传统补间动画2.位移动画图5-27第1帧花朵位置 图5-28第30帧花朵位置3.透明度渐变动画 图5-29第1帧星星的位置第30页，共35页。案例14海底世界补间动画案例14海底世界补间动画案例描述制作补间动画，实现“鱼”实例位置与旋转方向的变化如图5-30所示。图5-30海底世界第31页，共35页。案例14海底世界补间动画案例分析制作补间动画实现“鱼”图形实例位置与旋转方向的变化。了解补间动画与传统补间动画的区别。5.12补间动画制作 补间动画功能强大，且易于创建。通过补间动画可对补间的动画进行最大程度的控制。可补间的对象类型包括影片剪辑、图形和按钮元件以及文本字段创建补间动画（1

15、）创建位置补间动画（2）创建非位置属性的补间动画2.编辑补间的运动路径图5-31更改补间对象的位置 图5-32使用选取工具编辑路径 第32页，共35页。案例14海底世界补间动画图5-32更改贝塞尔控制点 图5-33使用“任意变形”工具编辑运动路径 3.使用动画编辑器制作动画动画编辑器是对补间动画进行倾斜、旋转或制作缓动效果的窗口如图5-34所示. 第33页，共35页。案例14海底世界补间动画5.13 补间动画与传统补间动画的区别传统补间使用关键帧，关键帧是显示对象的新实例的帧。补间动画只能有一个与之关联的对象实例，使用属性关键帧而不是关键帧补间动画在补间范围内由一个目标对象组成。补间动画与传统

16、补间都只允许对特定类型的对象进行补间。若应用补间动画则在创建补间时会将所有不允许的对象类型转换为影片剪辑元件，而传统补间动画会把不允许的对象类型转换为图形元件。补间动画会将文本视为可补间的类型，而不会将文本对象转换为影片剪辑。传统补间会将文本转换为形状补间。在补间动画范围上不允许帧脚本。传统补间允许帧脚本。补间目标上的任何对象脚本都无法在补间动画范围的进程中更改。能够在时间轴中对补间动画范围进行拉伸和调整大小，并将它们视为单个对象。传统补间在时间轴中可通过移动关键帧的位置调整传统补间的范围。若要在补间动画范围中选择单个帧，必需按住 Ctrl键单击帧。对于传统补间动画，缓动可应用于补间内关键帧之间地帧组。对于补间动画，缓动可应用于补间动画范围的整个长度。若要仅对补间动画的特定帧应用缓动，则需要创建自定义缓动曲线。