《flash8动画设计实例教程》第五

机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业机械工业出版社《Flash8动画设计实例教程》目标技能理解遮罩动画的概念和原理学会遮罩动画的建立方法能够熟练运用遮罩技术制作遮罩动画第5章遮罩动画实例机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业机械工业出版社《Flash8动画设计实例教程》本章目录5.1遮罩动画实例15.2遮罩动画实例25.3遮罩动画实例3机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业机械工业出版社《Flash8动画设计实例教程》•本章重点：遮罩动画建立的方法•本章难点：运用遮罩技术制作遮罩动画。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业机械工业出版社《Flash8动画设计实例教程》5.1遮罩动画实例１5.1.1概念介绍•遮罩动画遮罩动画是Flash中的一个很重要的动画类型，在Flash的作品中，很多生动的画面都是通过遮罩画实现的。例如：探照灯效果、水波、用放大镜将小物体放大以及百叶窗式图片的切换等等。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业机械工业出版社《Flash8动画设计实例教程》•遮罩层及被遮罩层最简单的遮罩动画需要上、下两个图层，上面的图层称为遮罩层，下面的图层称为被遮罩层。•遮罩层对象按钮、影片剪辑、图形、位图、文字、经过处理的线条可作为遮罩层对象。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业机械工业出版社《Flash8动画设计实例教程》5.1.2建立遮罩层步骤：1）打开Flash8，新建一个Flash文档。2）双击图层名称，将文档中名称为图层1的普通图层重新命名为遮罩层。3）在遮罩层名称框上单击右键，从弹出的快捷菜单中选择【遮罩层】命令，这时命令的左边出现一个小勾，该普通图层就成为了遮罩层。4）此时，层图标就从普通图层图标变为“遮罩层”图标。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业机械工业出版社《Flash8动画设计实例教程》机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业机械工业出版社《Flash8动画设计实例教程》5.1.3添加被遮罩层添加被遮罩层有多种方式。最常用的方式是：1）打开Flash8，新建一个Flash文档。2）单击插入图层按钮，建立两个普通图层。3）将上面的图层重新命名为遮罩层，下面的图层重新命名为被遮罩层。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业机械工业出版社《Flash8动画设计实例教程》4）在遮罩层名称框上单击右键，从弹出的快捷菜单中选择【遮罩层】命令，这时命令的左边出现一个小勾，该普通图层就成为遮罩层。5）在建立遮罩层后，系统会自动把遮罩层下面的一层关联为被遮罩层。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业机械工业出版社《Flash8动画设计实例教程》5.1.4实现遮罩效果制作遮罩动画：探照灯效果。步骤：1）打开Flash8，新建一个Flash文档，设置影片尺寸为“400px×200px”,背景颜色为“黑色”，帧频为“12”。2）单击插入图层按钮，建立两个图层，分别命名为：遮罩层和被遮罩层，遮罩层在上，被遮罩层在下。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业机械工业出版社《Flash8动画设计实例教程》3）选择工具箱中的文本工具，在文本工具的属性面板中设置文本的属性：字体为“宋体”，字号为“96”，颜色为：“红色。4）单击被遮罩层的第1帧，用鼠标在场景中拖出一个文本框，在其中输入文字——遮罩动画，适当调整文本的位置。5）单击遮罩层的第1帧，选择工具箱中的椭圆工具，设置填充色为绿色。按住Shift键，用椭圆工具在场景中画一个绿色的圆，调整圆的大小和文本一样高，调整圆的位置，将它放在文字的左边。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业机械工业出版社《Flash8动画设计实例教程》6）单击被遮罩层的第50帧，单击鼠标右键，从弹出的快捷菜单选择【插入帧】命令。7）单击遮罩层的第50帧，单击鼠标右键，从弹出的快捷菜单选择【插入关键帧】命令，选择工具箱中的箭头工具，将圆拖到文字的右边。8）选中遮罩层的第1帧，单击鼠标右键，从弹出的快捷菜单中选择【创建补间动画】命令，设置遮罩层中的圆的补间为动画补间。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业机械工业出版社《Flash8动画设计实例教程》9）在遮罩层名称框上单击鼠标右键，从弹出的快捷菜单中选择【遮罩层】命令，这时将看不到场景中的对象，遮罩层和被遮罩层自动被锁定。10）按【Ctrl】+【Enter】键预览动画效果。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业机械工业出版社《Flash8动画设计实例教程》5.2遮罩动画实例25.2.1制作遮罩动画：水波步骤：1）打开Flash8，新建一个Flash文档，影片尺寸为“500px×400px”,背景颜色为“黑色”，帧频为“12”。2）选择图层1第1帧，选择菜单栏“文件”“导入”命令，导入一幅图片（此图片就是光盘中的水波.jpg）到舞台，设置图片的宽和高分别为500px×400px，与舞台大小相同。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业机械工业出版社《Flash8动画设计实例教程》3）选择菜单栏“插入”“新建元件”命令，创建一个名称为水波的影片剪辑。4）在水波元件的编辑模式下，导入水波.jpg图片到图层1的第1帧，将该图片作为水波元件的背景，设置图片的大小为500px×400px，调整图片的位置至中心。5）在水波元件的编辑模式下，更改图层1名称为被遮罩层，在该图层的上面新建一个图层，命名为遮罩层。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业机械工业出版社《Flash8动画设计实例教程》6）选择被遮罩层的第23帧，单击鼠标右键，从弹出的快捷菜单选择【插入帧】命令。7）选择遮罩层的第1帧，选择工具箱中的椭圆工具，设置笔触颜色为白色，轮廓线粗细为1，去掉填充色。8）拖动鼠标，绘制一个小圆形，调整小圆形到适当的位置。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业机械工业出版社《Flash8动画设计实例教程》9）选中此圆，选择菜单栏“修改”“形状”“将线条转换为填充”命令，对线条进行转换填充处理。这是因为此圆将作为遮罩层中的对象，而在遮罩层中的图形对象不能使用线条，如果一定要用线条，需要将线条转化为“填充”。10）选择遮罩层第23帧，单击鼠标右键，从弹出的快捷菜单选择【插入关键帧】命令。11）选择工具箱“任意变形工具”，在第23帧放大该圆。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业机械工业出版社《Flash8动画设计实例教程》12）选择遮罩层第1帧，设置属性面板中的【补间】选项为形状，将该层中对象的第1至23帧设为形状渐变。13）在遮罩层上单击右键，从弹出的快捷菜单中选择【遮罩层】命令。14）单击返回按钮，回到场景1。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业机械工业出版社《Flash8动画设计实例教程》15）选择图层1的第27帧，单击鼠标右键，从弹出的快捷菜单选择【插入帧】命令。16）单击插入图层按钮，建立图层2，选中该图层的第1帧，选择菜单栏“窗口”库”命令，打开“库”面板，拖动“水波”影片剪辑到场景1中合适的位置。17）单击插入图层按钮，新建图层3，选中图层3的第8帧，单击鼠标右键，从弹出的快捷菜单选择【插入关键帧】命令。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业机械工业出版社《Flash8动画设计实例教程》18）单击【插入图层】按钮，新建图层4，选中图层4的第14帧，单击鼠标右键，从弹出的快捷菜单选择【插入关键帧】命令。选中图层2的第1帧，选择菜单栏“编辑”“复制”命令，再选中图层4的第14帧，选择菜单栏“编辑”“粘帖到当前位置”命令，将图层2中水波影片剪辑实例复制并原地粘贴过来。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业机械工业出版社《Flash8动画设计实例教程》19）单击【插入图层】按钮，新建图层5，选中图层5的第21帧，单击鼠标右键，从弹出的快捷菜单选择【插入关键帧】命令。用上面的方法，将图层2中水波影片剪辑实例复制并原地粘贴到图层5的第21帧。20）按【Ctrl】+【Enter】键预览动画效果。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业机械工业出版社《Flash8动画设计实例教程》21）选择菜单栏“文件”“保存”命令，将该文件保存为“水波.fla”。22）选择菜单栏“文件”“发布”命令，生成“水波.swf”。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业机械工业出版社《Flash8动画设计实例教程》5.3遮罩动画实例35.3.1制作遮罩动画：红星闪闪步骤：1）打开Flash8，新建一个Flash文档，影片尺寸为“400px×400px”,背景颜色为“黑色”，帧频为“12”。2）选择工具箱中的矩形工具按钮，设置笔触颜色为无，填充颜色为“放射状”渐变色，在场景中绘制出一个“400px×400px”的无边正方形，调整它的位置与场景重叠。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业机械工业出版社《Flash8动画设计实例教程》3）选择菜单栏“插入”“新建元件”命令，新建一个图形元件，命名为线条。4）在线条元件编辑模式下，选择工具箱中的线条工具按钮，在线条元件的“属性”面板中，设置笔触颜色为黄色，笔触高度为3，设置线条宽为：200，线条高为：0，设置线条的位置：X为-200，Y为20。拖动鼠标在场景中画一条直线。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业机械工业出版社《Flash8动画设计实例教程》5）选择菜单栏“插入”“新建元件”命令，新建一个图形元件，命名为线条组合。6）选择菜单栏“窗口”“库”命令，打开“库”面板，将线条元件拖到线条组合元件场景中。7）选中场景中的线条元件，在“属性”面板中,设置X为-200，Y为20。单击工具箱中的任意变形工具，此时该元件实例的中心会出现一个小白点，它就是对象的“变形点。用鼠标左键按住它，拖到场景的中心“+”处松手。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业机械工业出版社《Flash8动画设计实例教程》8）选择菜单栏“窗口”“变形”命令，打开“变形”面板，选择旋转单选按钮，每次旋转角度设为15度。9）连续单击复制并应用变形按钮，在场景中复制出的效果。10）在时间轴的第1帧上单击一下，选中全部图形，执行菜单栏“修改”“分离”命令，把线条打散。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业机械工业出版社《Flash8动画设计实例教程》11）执行菜单栏“修改”“形状”“将线条转化为填充”命令，将线条转变为填充。这是因为这些线条将被用作为遮罩层的对象，而遮罩层中的对象可以是按钮、影片剪辑、图形、位图、文字等，但不能使用线条，如果一定要用线条，要将线条转化为填充。12）选择菜单栏“插入”“新建元件”命令，新建一个影片剪辑，命名为闪光。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业机械工业出版社《Flash8动画设计实例教程》13）在闪光元件编辑场景中，选择“窗口”“库”命令，打开“库”面板，将库中线条组合元件拖到闪光元件场景中，并使线条组合元件实例的中心点与闪光元件场景中心点“+”符号对齐。14）在闪光元件编辑模式下，选择图层1第30帧，单击鼠标右键，从弹出的菜单中选择【插入关键帧】命令，再用鼠标右键单击图层1第1帧，在弹出的菜单中选择【创建补间动画】命令。机械工业出版社中等职业教育“十一五”规划教材۰电子商务专业机械工业出版社《Flash8动画设计实例教程》15）选择图层1第1帧，在“属性”面板，设置【旋转】为【顺时针】，旋转1次。16）选择图层1的第1帧，选择菜单栏“编辑”“复制”命令。17）单击