（中职）flash-cs6动画制作案例教第7章　网站动画制作课件

1、YCF正版可修改PPT（中职）flash_cs6动画制作案例教第7章网站动画制作ppt课件第7章网站动画制作【课程导入】 导入案例:基本网站导航 导入案例:简单组合菜单 拓展案例:楼盘介绍菜单7.1导入案例:基本网站导航7.1.1制作要点首先为影片剪辑元件设置实例名称,再利用ActionScript脚本控制影片剪辑元件的播放。7.1.2制作步骤(1)新建一个尺寸为51063像素,背景为白色的文档。(2)新建“名称”为“椭圆”的图形元件,使用“椭圆工具”,设置“笔触颜色”为“无”,“填充颜色”为“#bce1f9”,在场景中绘制正圆。利用同样的方法在场景中绘制其他圆,如图712所示。(3)新建“名

2、称”为“首页动画”的影片剪辑元件,选择“文本工具”,在“属性”面板上进行设置。在场景中输入文本,并将文本分离成图形。将文本转换成“名称”为“首页”的图形元件。(4)在第10帧位置插入关键帧,在“属性”面板上进行设置。使用“任意变形工具”将元件等比例扩大,设置第1帧上的“补间类型”为“传统补间”。(5)在第5帧位置插入关键帧,使用“任意变形工具”将元件等比例扩大并调整位置。在第25帧位置插入帧,新建“图层2”,在第5帧位置插入关键帧,将“椭圆”元件从库中拖入场景中,使用“任意变形工具”将元件等比例缩小并旋转。(6)在第20帧位置插入关键帧,使用“任意变形工具”将元件等比例扩大。设置第5帧上的“补

3、间类型”为“传统补间”,将“图层2”拖动到“图层1”的下面。(7)根据“图层2”的制作方法制作出“图层3”。在“图层1”上新建“图层4”,使用“矩形工具”,设置“笔触颜色”为“无”,“填充颜色”为“0%”的“#cbcbcb”,在场景中绘制图形。新建“图层5”,在第25帧位置插入关键帧,分别选择第1帧和第25帧,依次在“动作”面板中输入“stop();”脚本。(8)根据“首页动画”元件的制作方法,制作出“活动内容动画”、“活动奖品动画”、“填写资料动画”和“互联网公证”元件。(9)返回“场景1”的编辑状态,导入背景图片到舞台中。新建“图层2”,将“首页动画”元件从库中拖入场景中。设置“实例名称”

4、为“a1”,并在“动作”面板中输入脚本。(10)根据“图层2”的制作方法,制作出“图层3”“图层6”。(11)至此,基本网站导航的动画制作完成,测试满意后保存文件。7.2导入案例:简单组合菜单7.2.1制作思路(1)导入背景素材,然后填充半透明的反射渐变。(2)使用传统补间动画来控制菜单并加入声音素材。(3)使用程序来控制菜单。7.2.2制作步骤(1)新建一个尺寸为600300像素的空白文档,然后导入背景素材。接着按“F8”键将其转换为图形元件,最后进入该元件的编辑区域。(2)新建一个图层,并命名为“高光”,使用“矩形工具”绘制一个与舞台大小相同的矩形,然后设置填充类型为“径向渐变”,第1个色

5、标颜色为“R:0,G:0,B:0”,“Alpha”值为“0%”;第2个色标颜色为“R:0,G:0,B:0”。(3)新建图层,并命名为“按钮”,然后使用“矩形工具”绘制一个大小合适的矩形,设置填充类型为“线性渐变”,第1个色标颜色为“R:112,G:225,B:0”,第2个色标颜色为“R:46,G:93,B:0”,第3个色标颜色为“R:112,G:225,B:0”。(4)使用“线条工具”绘制一条直线,然后设置填充类型为“线性渐变”,第1个色标颜色为“R:112,G:225,B:0”,第2个色标颜色为“R:230,G:220,B:241”,第3个色标颜色为“R:112,G:225,B:0”。最后复

6、制一份线条到左侧。(5)使用“矩形工具”绘制一个矩形高光区域,然后设置填充类型为“线性渐变”,第1个色标颜色为“R:225,G:225,B:225”,“Alpha”值为“20%”;第2个色标颜色为“R:225,G:225,B:225”,“Alpha”值为“80%”。(6)选中按钮所在部分,按“Ctrl+G”组合键将其组合在一起,然后按“F8”键将其转换为按钮元件,双击此元件进入其编辑区域,然后在“指针经过”、“按下”、“点击”帧中插入关键帧,并在各帧上绘制出图形。(7)将“指针经过”帧中的图形转换为影片剪辑,进入该影片剪辑的编辑区域,创建一个由完全不透明到完全透明的传统补间动画。(8)返回按钮

7、元件编辑区域,新建一个“声音”图层,在“指针经过”和“按下”帧中插入关键帧,然后按“Ctrl+R”组合键导入音频文件,再将其分别添加到按钮的“指针经过”和“按下”帧中。(9)返回“场景1”,然后复制3个按钮。(10)新建一个“文字”图层,然后创建4个静态文本对象。(11)将4个静态文本对象转换为影片剪辑(名称为“ButtonText”),然后在库中选中3个元件,并分别为其添加元件类。(12)新建一个AS图层,编写代码来创建4个按钮对象,并组合成一个菜单所需的按钮。(13)最后创建按钮文字,并设置其精确位置。(14)至此,完成菜单制作,测试满意后保存即可。7.3拓展案例:楼盘介绍菜单7.3.1制

8、作思路本实例使用脚本、传统补间制作关于楼盘介绍的菜单导航动画。实现使用脚本控制鼠标跟随的效果。7.3.2制作步骤(1)新建一个尺寸为244375像素,帧频为40,背景颜色为白色的空白文档。(2)将准备好的素材导入场景中。在第45帧位置插入关键帧,新建“名称”为“小草”的图形元件,将准备好的图像导入舞台中。(3)新建“名称”为“小草动画”的影片剪辑元件,将“小草”元件从库中拖入场景,在第10帧位置插入关键帧。(4)设置第1帧上的元件的“Alpha”值为“0%”,并创建传统补间动画。设置“属性”面板。新建“图层2”,在第10帧位置插入关键帧,输入“stop();”脚本。(5)新建“名称”为“圆”的

9、图形元件,使用“椭圆工具”,在“属性”面板中设置“填充颜色”为“#f13a77”,绘制圆形。(6)新建“名称”为“圆动画”的影片剪辑元件,将“圆”元件从库中拖入场景,在第25帧位置插入关键帧,设置第1帧上的元件的“Alpha”值为“0%”,并创建传统补间动画。新建“图层2”,在第25帧位置插入关键帧,并在“动作”面板中输入脚本“stop();”。(7)新建“名称”为“按钮动画”的按钮元件,在“指针经过”状态下插入关键帧,将“小草动画”元件从库中拖入场景,在“点击”状态下插入空白关键帧,绘制反应区。(8)新建“名称”为“项目简介”的影片剪辑元件,将准备好的图像素材导入舞台中。(9)新建“图层2”,选择“文本工具”,在“属性”面板中设置各项参数,输入文字。(10)新建“图层3”,选择“文本工具”,在“属性”面板中设置各项参数,输入文字。(11)新建“图层4”,将“按钮动画”元件从库中拖入场景。使用相同的方法制作其他元件。(12)返回“场景1”,新建“图层2”,将“项目简介”元件从库中拖入场景。在第5帧位置插入关键帧,设置第