《Flash CS5动画设计项目教程-电子教案-明丽宏 学习情境六 多媒体课件制作》由会员分享，可在线阅读，更多相关《Flash CS5动画设计项目教程-电子教案-明丽宏 学习情境六 多媒体课件制作（91页珍藏版）》请在金锄头文库上搜索。
1、,学习情境六 多媒体课件制作,目录,导入案例一 旋转的太极,导入案例二 卡通图标,导入案例三 What does he do？,项目一 咏鹅课件,项目拓展 选择题课件,1,2,3,4,5,目录,学习情境练习,6,7,学习情境小结,教学要求,1.1 导入案例一 旋转的太极,本案例主要通过使用“选择工具”、“椭圆工具”结合各种快捷键的使用来制作旋转的太极。在Flash CS5中使用对象的矢量模式进行绘图，然后将若干个独立的对象进行组合，利用矢量图可以被切割的特点可以制作出想要得到的图形效果。最终案例效果如图6-1所示。,图 6-1 “五角星”效果,6.1.1 案例效果,在本案例中，主要解决以下问题
2、： 1“选择工具”的使用。 2“椭圆工具”的使用。 3Flash CS5中各种快捷键的使用。,6.1.2 案例目的,1.创建flash文件 （1）按“Ctrl+N”组合键，创建一个名为“旋转的太极”的flash文件。 2.绘制太极的形状 （1）选择“椭圆工具”并将“椭圆工具”的填充颜色设置为“无”，按住“Shift+Alt”组合键的同时，以舞台中央为中心画正圆，如图6-2所示。 （2）使用“选择工具”选中该圆形，在属性面板中设置其宽、高均为200；单击“窗口对齐”打开对齐面板，勾选“与舞台对齐”后选择“水平中齐”、“垂直中齐”，使圆位于舞台的中央。 （3）继续使用“椭圆工具”在舞台的其他位置绘
3、制较小的圆形，设置其宽、高均为100.5，按住“Ctrl”键的同时选中小圆拖拽，制作小圆的一个副本。 （4）将这两个小圆分别拖入到大圆中，使三者相切，得到如图6-3所示的图形。,6.1.3 案例操作步骤,（5）使用“选择工具”并按住“shift”键将上圆左半边和下圆的右半边选中，按“Delete”键进行删除，效果分别如图6-4和6-5所示。,图6-2 绘制圆形,图 6-3 三圆相切,图6-4 选择曲线,图 6-5 删除后的效果,（6）使用“椭圆工具”在舞台上绘制两个笔触和填充均为黑色、宽高均为50的圆形。 （7）选择“颜料桶工具”，设置其颜色为黑色，单击如图6-5中的左半边图形，将其填充为黑色
4、；然后将颜料桶颜色设置为白色，单击右半边图形进行填充。 （8）将舞台中的一个圆形全部选中（包括线条和内部填充），移动到右半边圆形中。 （9）同样将另一个圆形选中，移动到左半边圆形中，修改该圆形的笔触和填充颜色均为白色，至此太极图案制作完成，效果如图6-6所示。,图 6-6 太极图,3. 制作旋转效果 下面开始设置太极图的旋转动画效果： （1）选中整个太极图，选择“修改|转换为元件”命令；在弹出的对话框中输入元件的名称“太极图”，“影片剪辑”类型。 （2）选中图层1的第72帧，按“F6”，在该帧上插入关键帧，按照帧频为24fps的速度计算，太极旋转一周的速度是3s。 （3）选中图层1，单击右键选
5、择“创建传统补间”，然后在属性选项卡中设置“顺时针”旋转。 （4）保存文件，按“Ctrl+Enter”组合键测试效果。,相关知识,1. 执行“修改变形垂直（水平）翻转”，可将选中的对象垂直（水平）翻转。 2. 对象的倾斜：选中“变形”面板中的“倾斜”单选按钮，即可将选中对象旋转或复制一个倾斜的对象。,相关知识,1. 按住Shift键可以绘制正圆，同时按住Shift键和Alt键可以以鼠标所在点为基准绘制正圆。 2.矢量图形具有可切割性质，它包括两部分：外部形状部分和内部填充部分。,相关知识,6.2 导入案例二 卡通图标,本案例主要通过使用“选择工具”、“椭圆工具”、“线条工具”、“任意变形工具”
6、结合各种菜单命令来完成卡通图标的绘制。在Flash CS5中使用对象的矢量模式进行绘图，然后使用“选择工具”、“任意变形工具”调整图形得到最终的效果；在本案例中要注意矢量模式图形和绘制模式图形的区别。最终案例效果如图6-7所示。,图 6-7 “卡通图标”效果图,6.2.1 案例效果,在本案例中，主要解决以下问题： 1“选择工具”、“”任意变形工具的使用。 2“矩形工具”、“椭圆工具”、“线条工具”的使用。 3理解“编辑|粘贴到当前位置”命令的使用。,6.2.2 案例目的,（1）新建Flash文档，设置文档尺寸为250px*200px。 （2）新建一个名为“卡通图标”的图形元件，如图6-8所示。
7、 （3）单击工具箱中的“椭圆工具”，设置笔触颜色无，填充颜色为#007700，不透明度100%，取消绘制对象模式，在图形元件“卡通图标”的图层1的舞台中绘制一个正圆形，如图6-9所示。 （4）单击工具箱中的“矩形工具”，设置填充颜色为黑色，在图形元件“卡通图标”的图层1的舞台中绘制矩形，如图6-10所示。,6.2.3 案例操作步骤,图 6-8 卡通元件图,图 6-9 正圆形,图 6-10 圆和矩形,（5）选中刚刚绘制的矩形，执行“编辑|清除”命令，将刚刚创建的矩形删除；使用“选择工具”对半圆形图像进行调整，图形元件“卡通图标”的图层1的最终效果如图6-11所示。 （6）执行“编辑|复制”命令，
8、在图形元件“卡通图标”中新建图层2，执行“编辑|粘贴到当前位置”命令；使用“任意变形工具”将粘贴图像选中并缩小该图形的比例。 （7）选中较小的半圆形，打开“颜色”面板，设置一个从浅绿色到深绿色的线性渐变，具体效果如图6-12所示。,（8）使用相同的方法，绘制矩形调整出卡通图标的脸庞；绘制椭圆调整出卡通图标的眼睛、嘴巴以及其他效果，需要注意的是每部分都是在单独的一个图层上面绘制的，完成效果如图6-13所示。 （9）调整图形的显示比例为200%。在图形元件“卡通图标”中新建图层8，单击工具箱中的“多角星形工具”，设置填充颜色为深绿色，在舞台中绘制一个多边形，移动到卡通图标上，调整位置并使用“选择工
9、具”进行相应的调整，如图6-14所示。 （10）选中刚刚编辑的图形，执行“编辑|复制”命令；在图形元件“卡通图标”中新建图层9，执行“编辑|粘贴到当前位置”命令粘贴该图形，将新图形等比例进行缩小，设置其填充颜色为浅一点的绿色，如图6-15所示。,图 6-11 调整后的半圆,图 6-12 线性渐变填充的半圆,图 1-13 卡通图标的五官,图 1-14 卡通图标的头饰,图 1-15 头饰的渐变效果,（11）使用相同的方法，使用“椭圆工具”、“线条工具”绘制卡通图标的其他部分，重新将图形的显示比例设置为100%，图形元件“卡通图标”的最终效果如图6-16所示。,图 1-16 卡通图标图,1. 执行“
10、编辑粘贴到当前位置”，可将选中对象的副本粘贴到场景中同样的位置。 2.矢量模式图形具有可切割的特性，同时使用“选择工具”可以将矢量图形调整为需要的形状。,相关知识,（12）返回场景1，单击工具箱中的“矩形工具”，设置填充颜色为由浅绿到深绿的线性渐变填充，在舞台中绘制一个矩形，并调整舞台的显示比例为240%。 （13）使用“任意变形工具”顺时针旋转90，调整矩形的渐变效果。 （14）打开“库”面板，将图形元件“卡通元件”拖入场景中；调整舞台的显示比例为100%，将文件保存为“卡通图标.fla”。,1.3 导入案例三 What does he do？,本案例主要通过使用“任意变形工具”、“文本工具
11、”、“对齐面板”及Flash CS5公共库中按钮元件来完成实例的制作过程。在Flash CS5中使用库中按钮素材并对其添加ActionScript语句，可以制作出简单的多媒体课件；在本案例中要求读者掌握on(release)语句、gotoAndStop()语句的用法。本课件首页效果如图6-17所示。,图 6-17 课件首页效果图,6.3.1 案例效果,在本案例中，主要解决以下问题： 1“任意变形工具”、“文本工具”、“对齐面板”的使用。 2Flash CS5公共库中按钮的使用。 3ActionScript语句的使用。,6.3.2 案例目的,1.制作课件 （1）新建一个版本为ActionScri
12、pt2.0的flash文件，并将其保存为“What does he do.fla”。 （2）选择“文件导入导入到库”命令，在弹出的“导入到库”对话框中选择“学习情境6素材What does he do”文件夹下的所有素材文件，单击“打开”按钮，这些图片都被导入到“库”面板中。 （3）从“库”面板中将“背景1”图片拖曳到场景中；打开“对齐”面板，勾选“与舞台对齐”后，选择“水平中齐”、“垂直中齐”及“匹配宽和高”。 （4）选择“文本工具”，设置字体为黑体，字号大小为36，字体颜色为黑色，输入多媒体课件的题目“What does he do?”；调整字体为楷体，字号大小为20，输入“制作人：*”。
13、 （5）单击“窗口|公用库|按钮”命令，将buttons circle bubble中的“circle bubble grey”按钮拖曳到舞台场景中。,6.3.3 案例操作步骤,（6）选中图层1的第1帧，单击右键选择“动作” 命令，弹出“动作帧”面板，在面板的左上方将脚本语言版本设置为“ActionScript 1.0&2.0”,单击“将新项目添加到脚本中”按钮，在弹出的菜单中选择“全局函数时间轴控制Stop”命令，如图6-18所示；在脚本窗口中显示出选择的脚本语言；设置完成动作脚本后，关闭“动作帧”面板；在图层1的第1帧上显示出标记“a”,第1帧的画面效果如图6-19所示。,图 6-18 输
14、入语句,图 6-19 第一帧效果图,（7）选中图层的第2帧，按“F7”，在该帧上插入空白关键帧，将素材“背景2”、“村长1”、“喜洋洋1”、“对话框”拖曳场景中，并摆放到合适的位置。 （8）单击“窗口|公用库|按钮”命令，将buttons bar capped中的“bar capped blue”按钮拖曳到舞台场景中，双击按钮进入编辑状态，将按钮上的字母“Enter”修改为“上一页”；将buttons bar capped中的“bar capped grey”按钮拖曳到舞台场景中，将字母“Enter”修改为“下一页”。 （9）选择“文本工具”，设置字体为宋体，字号大小为18，字体颜色为黑色，在
15、“对话框”中输入内容“Good morning！”；第2帧的效果如图6-20所示。,图 6-20 第二针效果图,（10）选中图层的第3帧，按“F6”，在该帧上插入关键帧，将素材“喜洋洋1”删掉，将素材“喜洋洋2” 拖曳到场景中并调整到合适的位置；修改对话框中的内容为“What are you doing?”并调整位置；第3帧的效果如图6-21所示。 （11）选中图层的第4帧，按“F6”，在该帧上插入关键帧，修改对话框中的内容为“I am painting!”并调整其位置；第4帧的效果如图6-22所示。,图 6-21 输入字母“A” 图 6-22 绘制“椭圆形”,（12）选中图层的第5帧，按“F
16、7”，在该帧上插入空白关键帧，将素材“背景2”、“村长2”、“对话框”拖曳到场景中摆放到合适的位置，在对话框中输入内容“Question: What does he do?”。 （13）单击“窗口|公用库|按钮”命令，将buttons bar中的“bar blue”按钮拖曳到舞台场景中，并将字母“Enter”修改为“上一页”；将buttons bar中的“bar grey”按钮拖曳到舞台场景中，并将字母“Enter”修改为“返回”；第5帧的效果如图6-23所示。,图 6-23 第5帧效果图,图 6-24 第1帧按钮的动作语句,2.添加ActionScript语句 （1）选中第1帧上的“Enter”按钮，单击右键选择“动作”命令，弹出“动作按钮”，面板，在面板的左上方将脚本语言版本设置为“ActionScript 1.0&2.0”,单击“将新项目添加到脚本中”按钮，在弹出的菜单中选择“全局函数影片剪辑控制on(relea
