永宁中学八年级信息技术Flash教案.doc

中山市永宁中学八年级信息技术教案 执教：ZHUHONGWEIFlash 8.0信息技术八年级教 案任教班级： 初二年级1278910学 期： 2012学年下学期任课教师： 朱红卫 2012年6月备课节次 2 第 1 节FLASH简介概述教学目的：1、动画的应用领域2、了解动画的制作流程。重点： 动画的制作流程难点： 动画的制作流程教学方法：讲授法教学过程:讲授新知:一、动画的应用领域Flash是美国的MACROMEDIA公司于1999年6月推出的优秀网页动画设计软件。它是一种交互式动画设计工具，用它可以将音乐，声效，动画以及富有新意的界面融合在一起，以制作出高品质的网页动态效果。 大家知道，HTML语言的功能十分有限，无法达到人们的预期设计，以实现令人耳目一新的动态效果，在这种情况下，各种脚本语言应运而生，使得网页设计更加多样化。然而，程序设计总是不能很好地普及，因为它要求一定的编程能力，而人们更需要一种既简单直观又功能强大的动画设计工具，而Flash的出现正好满足了这种需求。 FLASH的特点1. 使用矢量图形和流式播放技术。与位图图形不同的是，矢量图形可以任意缩放尺寸而不影响图形的质量；流式播放技术使得动画可以边播放边下载，从而缓解了网页浏览者焦急等待的情绪。 2. 通过使用关键帧和图符使得所生成的动画(.swf)文件非常小，几K字节的动画文件已经可以实现许多令人心动的动画效果，用在网页设计上不仅可以使网页更加生动，而且小巧玲珑下载迅速，使得动画可以在打开网页很短的时间里就得以播放。 3. 把音乐，动画，声效，交互方式融合在一起，越来越多的人已经把Flash作为网页动画设计的首选工具，并且创作出了许多令人叹为观止的动画(电影)效果。而且在Flash4.0的版本中已经可以支持MP3的音乐格式，这使得加入音乐的动画文件也能保持小巧的身材。 4. 强大的动画编辑功能使得设计者可以随心所欲地设计出高品质的动画，通过ACTION和FS COMMAND可以实现交互性，使Flash具有更大的设计自由度，另外，它与当今最流行的网页设计工具Dreamweaver配合默契，可以直接嵌入网页的任一位置，非常方便。 总之，Flash已经慢慢成为网页动画的标准，成为一种新兴的技术发展方向。二、了解动画制作流程1、前期策划在制作动画之前，首先应该想清楚制作这个动画要达到什么样的目的和效果，通过怎样的手法制作动画的角色和形工等。2、素材搜集前期策划完成后，就可以对动画中需要使用的素材进行搜集。在搜集时应用注意目的性，主要根据动画策划的所规划好的素材类型进行搜集，这样能有效地节约时间和精力。3、动画制作Flash动画的制作中很关键的一步就是制作动画的过程，在对动画进行前期策划和素材搜集之后，动画的最终品质将很大程度上取决于动画的制作过程。4、后期测试与发布动画制作完成后，需对动画进行测试，以保证动画作品的最终质量。巩固练习:1、 动画有能应用到哪些领域？2、 Flash动画的制作过程大致可分为哪些？小结：完成一部优秀的Flash动画作品需要经过很多的制作环节，其中每一环节的质量都直接关系到作品的最终效果，因此应该认真地把握每个环节的制作。作业： 上机熟悉Flash 8.0的工作环境备课节次 2 第 2节 动画的基本创作流程一、 要求掌握以下实习内容：1、 动画创作的通用工作流程2、 如何新建文档和设置文档的属性3、 如何导入、调整、转换图形素材4、 插入普通帧和关键帧并设置帧的类型5、 创建补间动画6、 绘图纸外观和编辑多帧的使用7、 测试和发布FLASH影片二、 实例演练模拟客机从滑行到起飞以至降落的全过程操作步骤：1、 新建FLASH文档。2、 导入背景图像。（调整图像与舞台同样大小，X730，Y244，并将图层名称改为“背景”。3、 新建图层，改名为“飞机”，导入飞机素材，将对象转换为元件。4、 在“背景”层的130帧处插入帧。（F5键）5、 在“飞机”层的第10、30、70、90、110帧处分别插入关键帧。并调整飞机在各点的方向。在130帧处插入帧。6、 设置各帧标签。7、 在各帧之间分别创建补间动画。8、 在1-10帧设置加速。90-110处设置减速。（负值表示加速，正值表示减速）。9、 测试影片。（2种方法）10、 导出和发布影片。三、 练一练1、 尝试绘制球体，插入帧和关键帧来模仿球体弹跳的过程。备课节次2 第 3节 图形的绘制和编辑一、教学内容：1、 用钢笔工具绘制心形操作流程概念：贝赛尔曲线：用钢笔工具绘制的矢量图形，图形具有节点，并且这些线条的角度、长度、曲度是可以通过节点上的手柄进行调节的。操作步骤：1） 新建FLASH文档，调整舞台大小，设置背景色为蓝色。调出标尺，拖出一条辅助线。2） 在工具箱中选择钢笔工具，在辅助线的下部，单击鼠标不放往舞台左上方拖出一根方向线。3） 将鼠标对齐辅助线，在上方向右下角拖出一条方向线。4） 回到起始锚点，往左下方拖，封闭图形。5） 使用部分选取工具，单击节点，按下ALT键拖动右侧手柄，调整成心形。（注意，按ALT键是只控制一侧）6） 用颜料桶为心形上色。并删除线条色。练习：利用钢笔工具绘制苹果的形状。 2、 创建形状补间动画区分：形状补间动画：在一个关键帧中绘制一个形状，然后在另一个关键帧中更改该形状或绘制另一个形状，FLASH根据二者之间的形状来创建的动画称为“形状补间动画”。它可以实现两个图形之间颜色、形状、太小、位置的相互变化。时间帧面板的背景色变为淡绿色。如果是对象是图形元件、按钮、文字则必先“打散”。 动作补间动画：在一个关键帧上放置一个元件，然后在另一个关键帧改变这个元件的大小、颜色、位置、透明度等。FLASH根据二者之间的帧创建的动画称为“动作补间动画”。构成动作动画的元素是元件，不能是形状，只有把形状“组合”或者转换成“元件”后才可以做“动作补间动画”。时间帧面板的背景色变为淡紫色。1） 选择心形，按F8键将其转换为一个影片剪辑，名为“heart”。2） 双击进入影片剪辑，在第5帧插入一个关键帧，使用任意变形工具按下ALT从上下往中间缩小，（两个方向同时缩小）3） 选择该层第1帧，调出“属性”检查器，在补间列表中选择“形状”4） 保存。练习：制作一个红色圆形变为蓝色多边形的动画。备课节次 2 第 4节图形的绘制和编辑一、教学内容：1、用钢笔工具绘制心形操作流程概念：贝赛尔曲线：用钢笔工具绘制的矢量图形，图形具有节点，并且这些线条的角度、长度、曲度是可以通过节点上的手柄进行调节的。操作步骤：1） 新建FLASH文档，调整舞台大小，设置背景色为蓝色。调出标尺，拖出一条辅助线。2） 在工具箱中选择钢笔工具，在辅助线的下部，单击鼠标不放往舞台左上方拖出一根方向线。3） 将鼠标对齐辅助线，在上方向右下角拖出一条方向线。4） 回到起始锚点，往左下方拖，封闭图形。5） 使用部分选取工具，单击节点，按下ALT键拖动右侧手柄，调整成心形。（注意，按ALT键是只控制一侧）6） 用颜料桶为心形上色。并删除线条色。练习：利用钢笔工具绘制苹果的形状。 2、 创建形状补间动画（11-12节）区分：形状补间动画：在一个关键帧中绘制一个形状，然后在另一个关键帧中更改该形状或绘制另一个形状，FLASH根据二者之间的形状来创建的动画称为“形状补间动画”。它可以实现两个图形之间颜色、形状、太小、位置的相互变化。时间帧面板的背景色变为淡绿色。如果是对象是图形元件、按钮、文字则必先“打散”。动作补间动画：在一个关键帧上放置一个元件，然后在另一个关键帧改变这个元件的大小、颜色、位置、透明度等。FLASH根据二者之间的帧创建的动画称为“动作补间动画”。构成动作动画的元素是元件，不能是形状，只有把形状“组合”或者转换成“元件”后才可以做“动作补间动画”。时间帧面板的背景色变为淡紫色。7） 选择心形，按F8键将其转换为一个影片剪辑，名为“heart”。8） 双击进入影片剪辑，在第5帧插入一个关键帧，使用任意变形工具按下ALT从上下往中间缩小，（两个方向同时缩小）9） 选择该层第1帧，调出“属性”检查器，在补间列表中选择“形状”10） 保存。区别之处 动作补间动画 形状补间动画 在时间轴上的表现 淡紫色背景加长箭头 淡绿色背景加长箭头 组成元素 影片剪辑、图形元件、按钮形状，如果使用图形元件、按钮、文字，则必先打散再变形。 完成的作用 实现一个元件的大小、位置、颜色、透明等的变化。 实现二个形状之间的变化，或一个形状的大小、位置、颜色等的变化。 练习：制作一个红色圆形变为蓝色多边形的动画。备课节次 2 第 5节制作会飞的心操作步骤：1、 使用椭圆工具绘制一个椭圆，按照上面的方法，有规律地绘制四个椭圆，并错开。2、 使用选择工具将对象原左侧区域圈选，按DELETE，删除左侧区域。3、 使用选择工具，拖出一个翅膀样子。4、 选择翅膀形状，按F8键将其转换为一个名为“wing”的图形元件，再次按F8键转换该图形元件为一个名为“wings”的影片剪辑。形成一个元件嵌套。5、 双击“wings”影片剪辑实例，进入后对“wing”图形元件实例进行编辑。选择任意变形工具，将图形元件实例翅膀旋转呈垂下状态，并拖动中心点至左侧。6、 在该层第10帧插入一个关键帧，使用任意变形工具将翅膀抬起。回到第1帧，“创建补间动画”。7、 回到场景1，选择影片剪辑实例“wings”确定中心点在心形中间，CTRL+T调出变形面板，产生一个翅膀副本。选择两个翅膀，CTRL+ 将对象移至下层，另外将三个对象一起选定，按F8键，把三者转换为”flyheart”,将三者组为一个更高级的嵌套。 备课节次 2 第 6节图形绘制一、教学目的：1、 掌握椭圆工具的使用2、 掌握箭头工具的使用3、 灵活运用变形工具及变形面板4、 掌握混色器中的色调二、教学内容及步骤：（一）绘制树叶 1、 调整舞台属性2、 选择椭圆工具，设置笔触颜色为淡绿，填充颜色为深绿，在舞台中间先画一个椭圆。3、 按下CTRL键，将椭圆拖出一个叶尖，并调整好叶子的形态。4、 用直线工具依次画好叶脉。5、 将画好的叶子复制多个。6、 使用变形工具调整好各叶子的形态。7、 将树叶转成组件。练习：1、画一片树叶3、 画一株树。（注意：画树干使用刷子工具）（二）绘制花朵1、 调整舞台大小2、 使用椭圆工具，采用线性填充，绘一个椭圆。3、 将中心点移至下面。4、 按CTRL+T打开变形面板，将对象复制并应用变形，成为一朵花的形状。5、 将对象转成组件。6、 在60帧处插入一个关键帧。7、 创建运动动画，并调整旋转状态为顺时针或逆时针。8、 新建一个图层，使用矩形工具画好一个杆子。9、 移至对象的中心。练习：绘制大风车动画片的图标。备课节次 2 第7、8节文字的处理一、 教学目的：1、 掌握工具箱中的文字工具的使用2、 掌握如何调整文字的格式3、 掌握七彩字的制作4、 掌握透视字的制作5、 掌握波浪字的制作6、 掌握立体字的制作7、 掌握霓红灯字的制作二、 教学内容及步骤：（一）七彩字的制作1、 选择文本工具在舞台中输入“圣诞节快乐”2、 选择箭头工具，调出属性面板，调整大小和方向。3、 转换为图形，按CTRL+B两次。4、 选中文字，选择填充颜色中的七彩颜色。然后填充即可。练习（二）透视字的制作1、选择文本工具在舞台中输入祝福：圣诞节快乐1、 选中，将文字打散，填充七彩颜色2、 选择变形工具，在选项工具组里选择扭曲，调整字的形状。练习（三）波浪字的制作1、 选择文本工具输入“你是我心中的唯一”2、 将文字打散3、 选择变形工具，在选项组里选择封套。4、 然后利用点来调整文字成波浪形状。练习（四）立体文字的制作1、 选择文本工具输入“一”2、 选择，打散。再复制一个。调整。填充成另外一种颜色。3、 使用放大镜放大，使用箭头工具调整。练习将自己的名字制作成立体文字。（五）霓红灯字的制作1、 选择文本工具输入“元旦快乐”2、 打散。3、 将线条颜色填上另外一种颜色。将填充颜色删除。4、 选择文字。执行修改变形将线条转化为填充。5、 选择文字。执行修改变形将柔化填充边缘。练习备课节次 2 第9、10节创建文字变色效果1. 创建文字变色效果 2. 创建文字改变大小效果 3. 创建文字改变透明度效果 4. 制作步骤 （1）创建影片文档 5. 1、 设置影片文档属性 6. 执行【文件】|【新建】命令，在弹出的面板中选择【常规】|【Flash文档】选项后，点击【确定】按钮，新建一个影片文档，在【属性】面板上设置文件大小为520*60象素，【背景色】为白色。如图3-4-8所示。 图3-4-8 启航Banner文档属性 2、 设置背景图层执行【文件】|【导入到场景】命令，将本实例中名为“启航banner.bmp”图片导入到场景中，在第205帧处按F5，加普通帧，如图3-4-9所示。 图3-4-9 设置背景 （2）创建元件1、 创建“电脑动画”元件 执行【插入】|【新建元件】命令，新建一个图形元件，名称为“电脑动画”。在“新元件编辑窗口”中选择第一帧，单击工具栏上的文字工具 ，在场景中点击一下，然后在【属性】面板上设置【文本类型】为静态文本、【字体】为隶书、【字体大小】32、【颜色】#FF9900，最后在场景中写下“电脑动画”四个字，如图3-4-10所示。2、创建“网页设计”元件执行【插入】|【新建元件】命令，新建一个图形元件，名称为“网页设计”。在编辑窗口选择第一帧，按上面的方法,在场景中写下“网页设计”四个字，参数同上。3、 创建“图象制作”元件执行【插入】|【新建元件】命令，新建一个图形元件，名称为“图象制作”。在编辑窗口选择第一帧，按上面的方法，在场景中写下“图象制作”四个字，参数同上。4、 创建“闪客启航”元件执行【插入】|【新建元件】命令，新建一个图形元件，名称为“闪客启航”。在编辑窗口选择第1帧，单击工具栏上的文字工具 ，在【属性】面板上设置【文本类型】为静态文本、【字体】为隶书、【字体大小】为50、【颜色】为#FF6600,在场景中写下“闪客沙龙”四个字，如图3-4-11所示。 5、 创建“语音教学”执行【插入】|【新建元件】命令，新建一个图形元件，名称为“语音教学”。在编辑窗口选择第1帧，单击工具栏上的文字工具 ，文字属性不变,在场景中写下“语音教学”四个字。 （3）创建动画 1、 创建“电脑动画”文字效果 在场景中新建一个图层。先在第1帧中，把库里的“电脑动画”元件拖到场景的外面，在【属性】面板上设置元件的【W】值为300，【H】值为76, 【X】值为47，【Y】值为27, 【Alpha】值为3，然后在第20帧处加关键帧，把“电脑动画”元件拖到场景的中间，设置【属性】面板的【W】值为141,【H】值为36，【X】值为127，【Y】值为12,【颜色】选项为“无”。 图3-4-12是“电脑动画”元件在【属性】面板的第1、20帧处的位置设置。 在第28帧处加关键帧，不改参数，这是为了给该文字对象一个停顿，让别人能看清楚。 在第48帧加关键帧，设置【属性】面板上参数【W】值84，【H】值21,【X】值9, 【Y】值3，【颜色】选色调，黑色。 在第1和第28帧处分别动建立动作补间动画，在第205帧添加普通帧使帧内容延续。 2、 创建“网页设计”文字效果 。在场景中新建一个图层。在此图层的第49帧加关键帧，把库里的“网页设计”元件拖到场景的外面，在【属性】面板上设置元件的【W】值为300，【H】值为83, 【X】值为43，【Y】值为20, 【Alpha】值为6,然后在第71帧处加关键帧，把“网页设计”元件拖到场景的中间，设置【属性】面板的【W】值为135,【H】值为36，【X】值为131，【Y】值为11,【颜色】选项为“无”，如图3-4-13所示。 图3-4-13 “网页设计”元件在第49、71帧的位置 再在第78帧处加关键帧，不改参数，在第97帧加关键帧，设置【属性】面板上参数【W】值81，【H】值22,【X】值18, 【Y】值20，【颜色】选色调，黑色。最后在第49和第78帧处分别建立动作补间动画，在第205帧添加普通帧。 3、 创建“图象制作”文字效果 。在场景中新建一个图层。先在第98帧加关键帧，把库里的“图象制作”元件拖到场景的外面，在【属性】面板上设置元件的【W】值为360，【H】值为90, 【X】值20, 【Y】值23，【Alpha】值为5,然后在第119帧处加关键帧，把“图象制作”元件拖到场景的中间，设置【属性】面板的【W】值为144,【H】值为36，【X】值128, 【Y】值10，【颜色】选项为“无”,再在第126帧处加关键帧，不改参数，在第146帧加关键帧，设置【属性】面板上参数【W】值86，【H】值22,【X】值27, 【Y】值35，【颜色】选色调，黑色，最后在第98和第126帧处分别建立动作补间动画，在第205帧添加普通帧，如图 3-4-14所示。 图3-4-14 “图象制作”元件在第126、146帧的位置 4、 创建“闪客启航”文字效果 。在场景中新建一个图层。先在第147帧处加关键帧，把库里的“闪客启航”元件拖到场景的外面，在【属性】面板上设置元件的【W】值为487，【H】值为124, 【X】值-28, 【Y】值-144，【Alpha】值为3，然后在第166帧处加关键帧，把“闪客启航”元件拖到场景的中间，设置【属性】面板的【W】值为212,【H】值为54，【X】值123, 【Y】值5，【颜色】选项无。最后在第147帧处建立动作补间动画，在第173帧添加普通帧。5、 创建“语音教学”文字效果。 在场景中新建一个图层。先在第174帧处加关键帧，把库里的“语音教学”元件拖到场景的外面，在【属性】面板上设置元件的【W】值为450，【H】值为115, 【X】值-20, 【Y】值29，【Alpha】值为3。然后在第194帧处加关键帧，把“语音教学”元件拖到场景的中间，设置【属性】面板的【W】值为210,【H】值为54，【X】值123, 【Y】值3，【颜色】选项无。最后在第174帧处动作建立补间动画，顺时钟旋转一圈，在第205帧添加普通帧，如图3-4-15所示。 图3-4-15 “语音教学”元件在第174帧的【属性】面板参数 完成后的部分时间线情况如图3-4-16所示。 在实际制作中，本例中各图形元件的大小、位置均不必拘束于书中所示的数字，您可自行调整至满意为止。 备课节次 2 第10、11节遮罩动画在Flash8.0的作品中，我们常常看到很多眩目神奇的效果，而其中不少就是用最简单的“遮罩”完成的，如水波、万花筒、百页窗、放大镜、望远镜等等。 那么，“遮罩”如何能产生这些效果呢？ 在本节，我们除了给大家介绍“遮罩”的基本知识，还结合我们的实际经验介绍一些“遮罩”的应用技巧，最后，提供二个很实用的范例，以加深对“遮罩”原理的理解。 在Flash8.0中实现“遮罩”效果有二种做法，一种是用补间动画的方法，一种是用actions指令的方法，在本节中，我们只介绍第一种做法。 1遮罩动画的概念（1）什么是遮罩 “遮罩”，顾名思义就是遮挡住下面的对象。 在Flash8.0中，“遮罩动画”也确实是通过“遮罩层”来达到有选择地显示位于其下方的“被遮罩层”中的内容的目地，在一个遮罩动画中，“遮罩层”只有一个，“被遮罩层”可以有任意个。 （2）遮罩有什么用 在Flash8.0动画中，“遮罩”主要有2种用途，一个作用是用在整个场景或一个特定区域，使场景外的对象或特定区域外的对象不可见，另一个作用是用来遮罩住某一元件的一部分，从而实现一些特殊的效果。 2创建遮罩的方法（1）创建遮罩 在Flash8.0中没有一个专门的按钮来创建遮罩层，遮罩层其实是由普通图层转化的。你只要在要某个图层上单击右键，在弹出菜单中把“遮罩”前打个勾，该图层就会生成遮罩层，“层图标”就会从普通层图标变为遮罩层图标，系统会自动把遮罩层下面的一层关联为“被遮罩层”,在缩进的同时图标变为，如果你想关联更多层被遮罩，只要把这些层拖到被遮罩层下面就行了，如图3-5-1所示。 图3-5-1 多层遮罩动画 （2）构成遮罩和被遮罩层的元素 遮罩层中的图形对象在播放时是看不到的，遮罩层中的内容可以是按钮、影片剪辑、图形、位图、文字等，但不能使用线条，如果一定要用线条，可以将线条转化为“填充”。 被遮罩层中的对象只能透过遮罩层中的对象被看到。在被遮罩层，可以使用按钮，影片剪辑，图形，位图，文字，线条。 （3）遮罩中可以使用的动画形式 可以在遮罩层、被遮罩层中分别或同时使用形状补间动画、动作补间动画、引导线动画等动画手段，从而使遮罩动画变成一个可以施展无限想象力的创作空间。 3应用遮罩时的技巧遮罩层的基本原理是：能够透过该图层中的对象看到“被遮罩层”中的对象及其属性（包括它们的变形效果），但是遮罩层中的对象中的许多属性如渐变色、透明度、颜色和线条样式等却是被忽略的。比如，我们不能通过遮罩层的渐变色来实现被遮罩层的渐变色变化。 1. 要在场景中显示遮罩效果，可以锁定遮罩层和被遮罩层。 2. 可以用“AS”动作语句建立遮罩，但这种情况下只能有一个“被遮罩层”，同时，不能设置_alpha属性。 3. 不能用一个遮罩层试图遮蔽另一个遮罩层。 4. 遮罩可以应用在gif动画上。 5. 在制作过程中，遮罩层经常挡住下层的元件，影响视线，无法编辑，可以按下遮罩层时间轴面板的显示图层轮廓按钮，使之变成，使遮罩层只显示边框形状，在种情况下，你还可以拖动边框调整遮罩图形的外形和位置。 6. 在被遮罩层中不能放置动态文本。 实例：红星闪闪图3-5-2 红星闪闪 知识提要 1. 将线条转化为填充 2. 创建遮罩动画 3. 使用变形面板 4. 任意变形工具中“注册点”的应用 5. 学习使用橡皮工具中的“水笼头”工具和擦除线条 6. 创建影片文档 7. 设置影片文档属性 8. 执行【文件】|【新建】命令，在弹出的面板中选择【常规】|【Flash文档】选项后，点击【确定】按钮，新建一个影片文档，在【属性】面板上设置文件大小为400*400象素，【背景色】为黑色。（在教程中，我们为了更好的显示场景中的内容，背景色设为了深蓝色），如图3-5-3所示。 图3-5-3 文档【属性】面板 （2）创建元件1、创建“闪光线条”元件 执行【插入】|【新建元件】命令，新建一个图形元件，名称为“闪光线条”。选择工具栏上的直线工具，在场景中画一直线，在【属性】面板上作如图3-5-5设置。 图3-5-5 闪光线条的【属性】面板参数设置如图3-5-6所示。2、创建“闪光线条组合”元件 执行【插入】|【新建元件】命令，新建一个图形元件，名称为“闪光线条组合”，图3-5-6 创建闪光线条元件从库中将名为“闪光线条”的元件拖入新元件编辑窗口的场景中，在X轴上的位置为-200，Y轴为20。然后单击工具栏上的任意变形工具，此时元件的中心会出现一个小白点，它就是对象的“注册点”，用鼠标左键按住它，拖到场景的中心处松手。 图3-5-7中的“1”显示的是注册点在元件的中心时的情形，“2”显示的是注册点已拖到场景中心时的情形。图3-5-7 移动注册点到场景的中心 然后执行【窗口】|【设计面板】|【变形】命令，打开变形面板，选中【旋转】，角度为15度，连续按下【复制并应用变形】按钮，在场景中复制出的效果如图3-5-8所示。 图3-5-8 变形面板及复制好的元件图3-5-9 创建“闪光”元件 在时间轴的关键帧上点一下，选中全部图形，执行【修改】|【分散】命令，把线条打散，再执行【修改】|【形状】|【将线条转化为填充】命令，将线条转变为形状。 3、 创建“闪光”元件 执行【插入】|【新建元件】命令，新建一个影片剪辑，名称为“闪光”，如图3-5-9所示。 单击【确定】后进行“新元件编辑窗口”，接着把库里名为“闪光线条组合”的元件拖到场景中，对齐中心点，复制此元件，在第30帧处加关键帧，再回到第1帧中建立补间动作动画，【属性】面板上设置顺时针旋转一周。 然后新建一层，在第1帧中执行【编辑】|【粘贴到当前位置】命令，使二层中的“闪光线条组合”完全重合，再执行【修改】|【变形】|【水平翻转】命令，让复制过来的线条和第一层的线条方向相反，在场景中形成交叉的图形。 在第30帧处建立关键帧，在第1帧中建立动作补间动画，【属性】面板上设置逆时针旋转一周，最后将此层设为遮罩层，如图3-5-10所示。图中显示的是“闪光”元件的时间轴面板和各图层中的动画设置。 图3-5-10“闪光”元件编辑界面图3-5-11 红星的九步画法 4、 创建“红星”元件 执行【插入】|【新建元件】命令，新建一个图形元件，名称为“红星”。我们要在这个元件中画一个漂亮的红星，为了画好红星，我们分九步来叙述具体的画法，图3-5-11中的“1-9”的数字表示这九个步骤。 第一步，按住shift键，从场景中心向上画一根黄色的线条，如图3-5-11中的“1”所示。 第二步，选择工具箱中的任意变形工具,在画好的线条上点一下，这里，线条的中心出现一个白色的小园点，我们叫它“注册点”。如图3-5-11中的“2”所示。 第三步，鼠标左键按住这个小白点，拖到线条的最下端，这是因为我们要让线条要以下端为中心旋转复制。如图3-5-11中“3”所示。 第四步，执行【窗口】|【设计面板】|【变形】，打开变形面板，各参数设置如图3-5-12。 按下【复制并应用变形】按钮四次，就会在场景中每隔72度复制出一根线条，五个线条的顶端构成五角星的五个顶点。如图3-5-11中的“4”所示。 图3-5-12 变形面板 第五步，用绿色线条分别连接五根线条的顶端，五角星的模样已经出来了，如图3-5-11中“5”所示。 第六步，用白色线条分别连接五角星中心和上一步连线的中点，如图3-5-11中“6”所示。 第七步，选择工具栏上的橡皮工具 ，在工具栏下面的选项中选择“水笼头”工具，在多余的线段上点一下，去除线段，修整好的五角星如图3-5-11中的“7”所示。 第八步，用油漆筒工具给五角星上色，每个角的左右颜色可略有区别，增加立体感，如图3-5-11中的“8”所示。 第九步：再选择橡皮工具，点开旁边的小三角，在“擦除线条”前打勾，如图3-5-13所示。 图3-5-13 擦除线条图3-5-14 多角星形工具图3-5-15 多角星形工具选项设置面板用橡皮工具擦去红星上的线条，一颗漂亮的红星就做成了，如图3-2-11中“9”所示。 技巧：在Flash8.0中，还可以用更简单的方法画红星，选择工具栏上的多角星形工具，如图3-5-14。（3）创建动画 回到主场景中，把“闪光”元件拖入第二层，新建二层，第三层中拖入“红星”元件，在场景的下方写下白色的“闪客启航电影制片厂”的文字，完成后的时间帧面板及场景如图3-5-16所示。 图3-5-16 时间轴及场景 按Ctrl+Enter组合键，测试动画。此时，你欣赏着自己亲手做的“闪闪红星”动画，心中再回想一下“遮罩”在动画中的作用，是否已经感受到“遮罩”这一功能的神奇？备课节次 2 第 12、13节引导路径动画在学校的网站192.168.9.200 点击下载素材单纯依靠设置关键帧，有时仍然无法实现一些复杂的动画效果，有很多运动是弧线或不规则的，如月亮围绕地球旋转、鱼儿在大海里遨游等，在Flash中能不能做出这种效果呢？ 答案是肯定的，这就是“引导路径动画”。 将一个或多个层链接到一个运动引导层，使一个或多个对象沿同一条路径运动的动画形式被称为“引导路径动画”。这种动画可以使一个或多个元件完成曲线或不规则运动。1创建引导路径动画的方法（1）创建引导层和被引导层 一个最基本“引导路径动画”由二个图层组成，上面一层是“引导层”，它的图层图标为，下面一层是“被引导层”，图标同普通图层一样。 在普通图层上点击时间轴面板的“添加引导层”按钮，该层的上面就会添加一个引导层，同时该普通层缩进成为“被引导层”，如图3-6-1所示。 图3-6-1 引导路径动画图（2）引导层和被引导层中的对象 引导层是用来指示元件运行路径的，所以“引导层”中的内容可以是用钢笔、铅笔、线条、椭圆工具、矩形工具或画笔工具等绘制出的线段。 而“被引导层”中的对象是跟着引导线走的，可以使用影片剪辑、图形元件、按钮、文字等，但不能应用形状。 由于引导线是一种运动轨迹，不难想象，“被引导”层中最常用的动画形式是动作补间动画，当播放动画时，一个或数个元件将沿着运动路径移动。（3）向被引导层中添加元件 “引导动画”最基本的操作就是使一个运动动画“附着”在“引导线”上。所以操作时特别得注意“引导线”的两端，被引导的对象起始、终点的2个“中心点”一定要对准“引导线”的2个端头，如图3-6-2所示。 图3-6-2 元件中心十字星对准引导线3-6-3 路径调整和对齐在图3-6-2中，我们特地把“元件”的透明度设为50%，使你可以透过元件看到下面的引导线，“元件”中心的十字星正好对着线段的端头，这一点非常重要，是引导线动画顺利运行的前提。 2应用引导路径动画的技巧（1）“被引导层”中的对象在被引导运动时，还可作更细致的设置，比如运动方向，把【属性】面板上的【路径调整】前打上勾，对象的基线就会调整到运动路径。而如果在【对齐】前打勾，元件的注册点就会与运动路径对齐，如图3-6-3所示。（2）引导层中的内容在播放时是看不见的，利用这一特点，可以单独定义一个不含“被引导层”的“引导层”，该引导层中可以放置一些文字说明、元件位置参考等，此时，引导层的图标为。（3）在做引导路径动画时，按下工具栏上的【对齐对象】功能按钮，可以使“对象附着于引导线”的操作更容易成功。（4）过于陡峭的引导线可能使引导动画失败，而平滑圆润的线段有利于引导动画成功制作。（5）被引导对象的中心对齐场景中的十字星，也有助于引导动画的成功。（6）向被引导层中放入元件时，在动画开始和结束的关键帧上，一定要让元件的注册点对准线段的开始和结束的端点，否则无法引导，如果元件为不规则形，可以按下工具栏上的任意变形工具，调整注册点。（7）如果想解除引导，可以把被引导层拖离“引导层”，或在图层区的引导层上单击右键，在弹出的菜单上选择【属性】，在对话框中选择“正常”作为图层类型，如图3-6-4所示。图3-6-4 图层【属性】面板图3-6-19 海底 （8）如果想让对象作圆周运动，可以在“引导层”画个圆形线条，再用橡皮擦去一小段，使圆形线段出现2个端点，再把对象的起始、终点分别对准端点即可。（9）引导线允许重叠，比如螺旋状引导线，但在重叠处的线段必需保持圆润，让Flash能辨认出线段走向，否则会使引导失败。实例:海底世界实例简介 海底是很多人向往的神秘世界，今天，我们就用Flash来试着描绘这个世界。这个实例中包括了补间运动动画、补间形状动画、遮罩动画、引导路径动画等四种动画形式，制作上要比前面几课中的实例难度大一些，不过，它能综合复习前面学过的内容，操作原理也是我们熟悉的，相信你一定能顺利完成这个实例，其运行效果如图3-6-19所示。 知识提要 综合应用四种动画形式 创建透明水泡 创建多层遮罩 制作步骤 （1）创建影片文档 新建一个影片文档，舞台尺寸设置为450*300象素，【背景色】设置为深蓝色，如图3-6-20所示。 图3-6-20 文档属性图3-6-21 水泡（放大400倍）、填充位置及混色器面板参数 （2）创建元件 本例中的元件较前面的实例要多一些，我们把它们分成“水泡部分”、“海底部分”、“游鱼部分”三个部分来叙述。先来创建和水泡有关的部分。1、 创建“单个水泡”元件执行【插入】|【新建元件】命令，新建一个图形元件，名称为“单个水泡”。先在场景中画一个无边的园，颜色任意，大小为30*30，再设置混色器面板的参数，四个调节手柄全为白色，Alpha值从左向右依次为100、40、10、100，如图3-6-21所示，用油漆筒工具在画好的圆的中心偏左上的地方点一下，如对填充的颜色不满意，可以用填充变形工具 进行调整。 2、 创建“一个水泡及引导线”元件执行【插入】|【新建元件】命令，新建影片剪辑，名称为“一个水泡及引导线”。点击添加引导层按钮 添加一个引导层，在此层中用铅笔工具 从场景的中心向上画一条曲线并在第60帧处加普通帧。在其下的被引导层的第一帧，拖入库中的名为“单个水泡”的元件，放在引导线的下端，在第60帧加关键帧，把“单个水泡”元件移到引导线的上端并设置Alpha值为50，如图3-6-22所示。 图 3-6-22 水泡及引导线图3-6-23 成堆的水泡（放大200倍）3、 创建“成堆的水泡”元件执行【插入】|【新建元件】命令，新建一个影片剪辑，名称为“成堆的水泡”。从库里拖入数个“一个水泡及引导线”元件，任意改变大小位置，图3-6-23仅供参考。4 、创建“鱼及引导线”元件执行【插入】|【新建元件】命令，新建一个影片剪辑，名称为“鱼及引导线”。此元件只有引导层和被引导层二层，点击时间轴面板上的添加引导层图标，新建引导层，在引导层中用铅笔工具画一条曲线作鱼儿游动时的路径，在被引导层中执行【文件】|【导入到场景】命令，将本实例中的名为“鱼”的元件导入到场景中，在第1帧及第100帧中分别置于引导线的两端，在第一帧中建立补间运动动画，在【属性】面板上的【路径调整】、【同步】、【对齐】三项前均打勾，如图3-6-25所示。 图3-6-25 鱼及引导线 下面我们来创建海底实例中“水波荡漾”效果所需的元件。 5、 创建“海底”元件执行【插入】|【新建元件】命令，新建一个图形元件，名称为“海底”。选择第一帧，然后再执行【文件】|【导入到场景】命令，将本实例中的名为“海底.bmp”的图片导入到场景中。6、创建“遮罩矩形”元件执行【插入】|【新建元件】命令，新建一个图形元件，名称为“遮罩矩形”。在场景中画一个500*4的无边矩形，因为“遮罩层”中的图形在播放时不会显示，所以颜色任意。 复制并粘贴这个矩形，向下移一点位置，使其变成二个，再复制并粘贴这二个矩形，再向下移一点位置，使其变为四个，如此循环，直至创建出一个500*540的矩形，如图3-6-26所示。 7、创建“水波效果”元件 水波荡漾的效果是用遮罩动画的手法做的，看着挺漂亮，实际制作却很简单，只用三层就完成了，里面有二个小技巧，在下面的讲解过程中会着重介绍。执行【插入】|【新建元件】命令，新建一个影片剪辑，名称为“水波效果”，如图3-6-27所示。图3-6-27 创建“水波效果”元件图3-6-28 两张图片在场景中的位置对比先把最下面图层作为当前编辑图层，从库里拖入名为“海底”的图形元件，在【属性】面板上设置元件的X值为0，Y值为0，在时间帧上点一下右键，在弹出菜单中选择【复制帧】，在第100帧加普通帧。 然后新建一个图层，在这层的第一帧上点一下右键，在弹出菜单中选择【粘贴帧】，就把刚才的元件粘到第二层里了，在【属性】面板上设置此元件的X值为0，Y值为1，Alpha值为80，在第100帧加普通帧。 注意：这里是一个技巧：第二层图片与第一层图片的位置差决定水波荡漾的大小！位置差越大，水波越大，其Alpha值的大小决定水波的清晰程度，Alpha值越大，水波越清晰，反之越模糊。图3-6-28是第一层和第二层中两张图片在X，Y轴的位置的不同的对比。 要实现水波荡漾，光有二层图片是不行的，还要用遮罩动画实现光线的明暗变化才行,这样，才能产生水的流动感。 新建一层，在第1帧上拖入库中名为“遮罩矩形”的元件，注意下面的边缘对着“海底图片”的下边缘。在第100帧上加关键帧，拖动“遮罩矩形”，使其上边缘对着“海底图片”的上边缘，在第1帧创建补间动作动画。如图3-6-29所示。 图3-6-29 遮罩层中矩形元件的位置 至此，这个动画所需的基本构件已经制作完成，大功告成，接下来还必需在场景中把各个构件“组装”起来。 在主场景中一共需要5个图层，我们由下而上一层一层地叙述，请随时参考图3-6-32。 （3）创建动画 1、 创建背景层 从库中把名为“水波效果”的元件拖到场景中，在第134帧加普通帧，该层命名为“背景”。 2、 创建水泡层 新建名为“水泡”的图层，在第1帧，第30帧从库里把名为“成堆的水泡”的元件拖到场景中来，数目、大小、位置任意，在第134帧加普通帧。 3、 创建游鱼层 新建名为“鱼”的图层，从库里把名为“鱼及引导线”的元件拖放到场景的左侧，数目、大小、位置任意，在第134帧加普通帧。 图3-6-31 图片、鱼、水泡的位置图3-6-32 遮罩层遮住下面各层 从场景中你是否发现，我