《八年级上信息技术Flash教案_计算机-Flash-Flex.pdf》由会员分享,可在线阅读,更多相关《八年级上信息技术Flash教案_计算机-Flash-Flex.pdf(27页珍藏版)》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、学习必备 欢迎下载 第一节 走进新天地认识 flash界面 一、教学目标 知识目标 1、了解 Flash 的功能特点。2、掌握 Flash 启动方法。能力目标 了解 Flash 中各面板的组成及各部分主要功能。情感目标 培养学生对 Flash 更浓厚的兴趣。教学重点与难点:Flash 动画产生原理 2、掌握 Flash 的工作环境 三、教学方法:演示法、观察法、自学法 四、教学课时:1 课时 五、教学过程:一 导入:1.什么是 FLASH Flash 是美国 Macromedia 公司出品的一个矢量图形和交互式动画制作软件.主要应用于网页设计和多媒体动画创作领域.它可以将文字、图画、声音和视频
2、融于一体,最终构成有声有色,品位独特的具有交互功能的动画效果。使用 Flash 可以作出梦幻般的动画效果.2、Flash 动画的特点:a.动画文件非常小,适合在网络上传输。b.易学易用,功能强大。c.交互功能强大,使用 flash制作出的影片可以是观赏者轻松地参与到故事情节中,因此使用 flash可开发出许多好玩的游戏。d.流媒体格式。可以边下载边观看(无需完全下载完在进行播放)e.用 Flash 作出来的动画是矢量动画(当把它放大时,它依然很清晰),而不象一般的 gif 格式和 jpf 格式的图象,放大时,看到的是一个个方形的色块.3、Flash 动画的应用:a、引领多媒体课件制作的新概念。
3、b.Flash还可以应用于产品展示,宣传广告方面。c.制作 MTV。d.开发各种交互式游戏 4、Flash 动画产生的原理:一幅幅静态图象(帧)形成连续运动的动画。快速播放 原理:图象迅速播放使得人眼很难觉察出短暂的时间间隔。5、FlashMX的三种文件格式:a.fla 源文件,可在 flash中打开修改。b.swf 发布文件,不包括原始的冗余的信息,只包含与动画播放有的必要信息。所以,swf 文件不可用 flash在重新打开修改.c.exe 文件中包含了 flash播放器和 swf 内容的程序,它不需要播放器就可直学习必备 欢迎下载 接浏览。二演示讲解 1.菜单栏 菜单栏位于主界面的顶部,它
4、由 9 组菜单命令组成。掌握了菜单栏中命令的使用,就掌握了 FLASH MX 饿基本操作。2.工具箱 工具箱位于主界面的左侧。工具箱中提供了选择、绘画、文字及修改的常用工具。以后我们在学习中不断对工具箱中的工具做介绍。3.时间轴 时间轴位于菜单栏的下面,它由两部分组成,左边的不凡用来对图层进行操作;右边的部分对帧进行操作。在时间轴中可以很方便地对层或帧进行选择、编辑、控制以及设置。4.舞台 舞台是进行动画创作的工作区域,它位于主界面的中央,占据了比较大的空间。在舞台中可以对当前帧的内容进行编辑。5.面板 面板位于主界面的底部和右侧,每一个面板都提供某一方面的功能。其中,位于主界面底部的是属性面
5、板,是我们经常用到的面板,它可以根据当前对象的不一样,显示不同的属性面板。三、练习 观察 FLASH 菜单与 WORD 菜单的区别与联系。熟悉 FLASH MX 的工作环境 四、小结:教学后记:第二节 绘图工具 一、教学目标:知识目标:1.绘图工具的种类 2.绘图工具的使用方法 能力目标 能够熟练使用各种绘图工具 情感目标 培养学生浓厚的学习兴趣,引导学生探索性自主学习,培养学生创新精神及能力。二、教学重点与难点:学习使用绘图工具 三、教学方法:实例演示法 四、教学手段与教学媒体 多媒体网络教室。五、教学课时:1 课时 五、教学过程:导入:各面板的组成及各部分主要功能情感目标培养学生对更浓厚的
6、兴趣教学重点与难点动画产生原理掌握的工作环境三教学方法演示法观察法自学法四教学课时课时五教学过程一导入什么是是美国公司出品的一个矢量图形和交互式动画独特的具有交互功能的动画效果使用可以作出梦幻般的动画效果动画的特点动画文件非常小适合在网络上传输易学易用功能强大交互功能强大使用制作出的影片可以是观赏者轻松地参与到故事情节中因此使用可开发出许多好玩的游晰而不象一般的格式和格式的图象放大时看到的是一个个方形的色块动画的应用引领多媒体课件制作的新概念还可以应用于产品展示宣传广告方面制作开发各种交互式游戏动画产生的原理一幅幅静态图象帧形成连续运动的动画快速学习必备 欢迎下载 Flash 基础绘图工具 在
7、计算机绘图领域中,根据成图原理和绘制方法的不同,分为矢量图和位图两种类型。矢量图形是由一个个单独的点构成的,每一个点都有其各自的属性,如位置、颜色等。因此,矢量图与分辨率无关,对矢量图进行缩放时,图形对象仍保持原有的清晰度和光滑度,不会发生任何偏差.如位图图像是由象素点构成的,象素点的多少将决定位图图像的显示质量和文件大小,位图图像的分辨率越高,其显示越清晰,文件所占的空间也就越大。基 Flash 提供了各种工具来绘制自由形状或准确的线条、形状和路径,并可用来对填充对象涂色。在本节里,我们学习线条工具、滴管工具、墨水瓶工具、箭头工具、刷子工具、任意变形工具、颜料桶等工具的基本用法。1绘制和处理
8、线条 【线条工具】是 Flash 中最简单的工具。现在我们就来画一条直线。鼠标单击【线条工具】,移动鼠标指针到舞台上,在你希望直线开始的地方按住鼠标拖动,到结束点松开鼠标,一条直线就画好了。【线条工具】能画出许多风格各异的线条来。打开【属性】面板,在其中,我们可以定义直线的颜色、粗细和样式,如图 2-1-2所示。在图 2-1-2所示的【属性】面板中,单击其中的【笔触颜色】按钮,会出现一个调色板对话框,同时光标变成滴管状。用滴管直接拾取颜色或者在文本框里直接输入颜色的 16 进制数值。颜色以#开头,如#99FF33。现在来画出各种不同的直线。单击【属性】面板中的【自定义】按钮,会弹出一个【笔触样
9、式】对话框,如图 2-1-4所示。方便观察,我们把粗细定为 3 象素(pts),选择不同的线型和颜色,来看看我们画出的线条,如图 2-1-5所示。试一试改变它的各项参数,会对你的绘图有很大帮助。【滴管工具】和【墨水瓶工具】可以很快地将一条直线的颜色样式套用到别的线条上。用【滴管工具】单击上面的直线,看看【属性】面板,它显示的就是该直线的属性,而且工具也自动变成了【墨水瓶工具】,如图 2-1-6所示。使用【墨水瓶工具】单击其它线条,看看什么结果:所有线条的属性都变成了和滴管工具选中的直线一样了。如果你需要更改这条直线的方向和长短,Flash 也为我们提供了一个很便捷的工具:【箭头工具】。【箭头工
10、具】的作用是选择对象、移动对象、改变线条或对象轮廓的形状。单击选择【箭头工具】,然后移动鼠标指针到直线的端点处,指针右下角变成直角状,这时拖动鼠标可以改变直线的方向和长短,如图 2-1-7所示。如果鼠标指针移动到线条中任意处,指针右下角会变成弧线状,拖动鼠标,可以将直线变成曲线。这是一个很有用处的功能,在我们鼠标绘图还不能随心所欲时,它可以帮助我们画出所需要的曲线,如图 2-1-8所示。2实例演练画一片树叶 现在我们就来实践一下,练习画一片树叶。打开 FALSH 软件,系统会自动建立一个 FLASH 文档,在这里我们不改变文档的属性,直接使用其默认值。各面板的组成及各部分主要功能情感目标培养学
11、生对更浓厚的兴趣教学重点与难点动画产生原理掌握的工作环境三教学方法演示法观察法自学法四教学课时课时五教学过程一导入什么是是美国公司出品的一个矢量图形和交互式动画独特的具有交互功能的动画效果使用可以作出梦幻般的动画效果动画的特点动画文件非常小适合在网络上传输易学易用功能强大交互功能强大使用制作出的影片可以是观赏者轻松地参与到故事情节中因此使用可开发出许多好玩的游晰而不象一般的格式和格式的图象放大时看到的是一个个方形的色块动画的应用引领多媒体课件制作的新概念还可以应用于产品展示宣传广告方面制作开发各种交互式游戏动画产生的原理一幅幅静态图象帧形成连续运动的动画快速学习必备 欢迎下载(1)新建图形元件
12、 执行【插入】|【新建元件】命令,或者按快捷键 CTRL+F8,弹出创建新元件对话框,在【名称】文本对话框中输入元件名称“树叶”,【行为】选择“图形”,单击【确定】按钮,如图 2-1-9所示。这时工作区变为“树枝”元件的编辑状态,如图 2-1-10所示。说明:图形元件是 Flash 的基本元素,有关它的详细内容请参阅第 4 章的有关内容。(2)绘制树叶图形 在“树叶”图形元件编辑场景中,首先用【线条工具】画一条直线,【笔触颜色】设置为深绿色,如图 2-1-11所示。然后用【箭头工具】将它拉成曲线,如图 2-1-12所示。再用【线条工具】绘制一个直线,用这条直线连接曲线的两端点,如图 2-1-1
13、3所示 用【箭头工具】将这条直线也拉成曲线,如图 2-1-14所示。一片树叶的基本形状已经出来了,现在我们画叶脉,在两端点间画直线,然后拉成曲线,如图 2-1-15和图 2-1-16所示。边的细小叶脉,可以全用直线,也可以略加弯曲,这样,一片简单的树叶就画好了,如图 2-1-17所示。(3)编辑和修改树叶 如果在画树叶的时候出现错误,比如说,画出的叶脉不是你所希望的样子,你可以执行【编辑】|【撤销】命令撤销前面一步的操作,也可以选择下面更简单的方法:用【箭头工具】单击你想要删除的直线,这条直线变成网点状,说明它已经被选取,你可以对它进行各种修改,如图 2-1-18所示。要移动它,就按住鼠标拖动
14、,要删除它,就直接按 DEL键。按住 SHIFT键连续单击线条,可以同时选取多个对象。如果要选取全部的线条,是否得按住 SHIFT键挨个点击呢?不需要,我们用黑色箭头工具拉出一个选取框来,就可以将其全部选中了,如图 2-1-19所示。说明:在一条直线上双击,也可以将和这条直线相连并且颜色、粗细、样式相同的整个线条范围全部选取。(4)给树叶上色 接下来我们要给这片树叶填上颜色。在工具箱中看到这个【颜色】选项了吗?如图 2-1-20所示 单击【填充颜色】按钮,会出现一个调色板,同时光标变成吸管状,如图 2-1-21所示。说明:你除了可以选择调色板中的颜色外,还可以点选屏幕上任何地方吸取你所需要的颜
15、色。如果你觉得调色板的颜色太少不够选,单击一下调色板右上角的【颜色选择器】按钮,会弹出一个【颜色】对话框,其中有更多的颜色选项,在这里,你能把选到的颜色添加到自定义颜色中,如图 2-1-22所示。在【自定义颜色】选项下单击一个自定义色块,该色块会被虚线包围,在【颜色】对话框右边的【调色板】中单击你喜欢的颜色,上下拖动右边颜色条上的箭头,移到你需要的深浅度上,单击【添加到自定义颜色】按钮,这个色块就被你收藏起来了。下一次要使用时,打开这个【颜色】面板,在自定义色中可以方便的选取你中意的颜色。各面板的组成及各部分主要功能情感目标培养学生对更浓厚的兴趣教学重点与难点动画产生原理掌握的工作环境三教学方
16、法演示法观察法自学法四教学课时课时五教学过程一导入什么是是美国公司出品的一个矢量图形和交互式动画独特的具有交互功能的动画效果使用可以作出梦幻般的动画效果动画的特点动画文件非常小适合在网络上传输易学易用功能强大交互功能强大使用制作出的影片可以是观赏者轻松地参与到故事情节中因此使用可开发出许多好玩的游晰而不象一般的格式和格式的图象放大时看到的是一个个方形的色块动画的应用引领多媒体课件制作的新概念还可以应用于产品展示宣传广告方面制作开发各种交互式游戏动画产生的原理一幅幅静态图象帧形成连续运动的动画快速学习必备 欢迎下载 好了,现在我们在调色板里选取绿色,单击工具箱里【颜料桶工具】,在画好的叶子上单击
17、一下,看看什么效果,如图 2-1-23所示。只有一小块颜色?原来,这个颜料桶只能在一个封闭的空间里填色。取消刚刚的填色,现在我们用【橡皮工具】将线条擦出一个缺口,再看效果,如图 2-1-24所示。你看,残缺线条的两边都填上了颜色。好,我们还是一块一块的填上颜色吧。但是在填充颜色前,你一定要将树叶图形恢复到使用【橡皮工具】擦除操作前的模样哦。这时,你可能会想,如果我们刚才先填充颜色再画叶脉就省事多了。是的,你想得一点没错!没关系,随着操作的增加,我们的经验会越来越丰富的。最后填充完的效果如图 2-1-25所示。至此,一个树叶图形就绘制好了。请你执行【窗口】|【库】命令,打开【库】面板,你将发现【
18、库】面板中出现一个“树叶”图形元件,如图 2-1-26所示。说明:【库】面板是存储 Flash 元件的场所,我们所创建的元件对象以及从外部导入的图像、声音等对象都保存在这里,这里的元件可以拖放到场景中重复使用。有关【库】面板的详细内容请你参阅第 4 章的相关内容。(5)【颜料桶工具】选项 单击【颜料桶工具】后,在工具箱下边的【选项】里有四个选项,可以根据自己的需要来确定,读者可以自己试一下,如图 2-1-26所示。说明:【颜料桶工具】是对某一区域进行单色、渐变色或位图进行填充,注意不能作用于线条。选择【颜料桶工具】后,在【工具箱】下边的【选项】中单击【空隙大小】按钮,会弹出四个选项,如图 1-
19、2-11所示。其中,【不封闭空隙】表示要填充的区域必须在完全封闭的状态下才能进行填充;【封闭小空隙】表示要填充的区域在小缺口的状态下可以进行填充;【封闭中等空隙】表示要填充的区域在中等大小缺口状态下进行填充;【封闭大空隙】表示要填充的区域在较大缺口状态下也能填充。但在 Flash 中,即使中大缺口,值也是很小的,所在要对大的不封闭区域填充颜色,一般用笔刷。3【刷子工具】的用法【刷子工具】可以随意地画色块。当你单击工具箱中的【刷子工具】后,工具箱下边就会显示它的【选项】,我们先看看它的【选项】,如图 2-1-27所示。在这里,我们可以选定画笔的大小和样式以及它的填色模式。读者可以自己选取不同的大
20、小和样式练习练习,先找一找感觉。下面我们利用刚刚画成的树叶来详细讲解它的填色模式。在图 2-1-27所示的【选项】下单击【填充模式】按钮,则弹出填充模式下拉列表,如图 2-1-28所示。(1)标准绘画 选择【刷子工具】,并将【填充颜色】设置为黄色,当然也可以是其它色。先选择【标准绘画】模式,移动笔刷(当选择了【刷子工具】后,鼠标指针就变为刷子形状)到舞台的树叶图形上,拖动鼠标在叶子上乱抹几下,观察一下效果,如图 2-1-29所示。你能发现,不管是线条还是填色范围,只要是画笔经过的地方,都变成了画笔的颜色。(2)颜料填充 选择【颜料填充】模式,它只影响了填色的内容,不会遮盖住线条,如图(3)后面
21、绘画 选择【后面绘画】模式,无论你怎么画,它都在图像的后方,不会影响前景图像,如图 2-1-3所示。各面板的组成及各部分主要功能情感目标培养学生对更浓厚的兴趣教学重点与难点动画产生原理掌握的工作环境三教学方法演示法观察法自学法四教学课时课时五教学过程一导入什么是是美国公司出品的一个矢量图形和交互式动画独特的具有交互功能的动画效果使用可以作出梦幻般的动画效果动画的特点动画文件非常小适合在网络上传输易学易用功能强大交互功能强大使用制作出的影片可以是观赏者轻松地参与到故事情节中因此使用可开发出许多好玩的游晰而不象一般的格式和格式的图象放大时看到的是一个个方形的色块动画的应用引领多媒体课件制作的新概念
22、还可以应用于产品展示宣传广告方面制作开发各种交互式游戏动画产生的原理一幅幅静态图象帧形成连续运动的动画快速学习必备 欢迎下载(4)颜料选择 选择【颜料选择】模式,你先用画笔抹几下,好象丝毫不起作用。这是因为我们没有选择范围。用【箭头工具】选中叶片的一块,再使用画笔,你看,颜色就上去了,如图 2-1-32所示。(5)内部绘画 选择【内部绘画】模式,在绘画时,画笔的起点必须是在轮廓线以内,而且画笔的范围也只作用在轮廓线以内.小结 教学后记:第三节 五彩斑斓的文字世界文字效果 一、教学目标:知识目标:学习 Flash 中文本工具和渐变色的使用,掌握文字制作的一些基本技巧。能力目标 能够学会各种文字制
23、作的方法 情感目标 培养学生浓厚的学习兴趣,引导学生探索性自主学习.二、教学重点与难点:掌握文字制作的基本技巧 三、教学方法:实例演示法 四、教学手段与教学媒体 多媒体网络教室。五、教学课时:3 课时 六、教学过程:导入:彩虹文字 第一步:打开 Flash 建立一个新文档,把舞台设为黑色。建立二个图层,把图层 1命名为“彩虹条”,图层 2 命名为“文字”。(因为文字不动一定要把它放在一层,我们要条动,通过彩虹条动过把文字秀出来,所以要把它放在下层)。第二步:单击“文字”图层第一帧,单击“文本工具”转入文字,我这里转入的是“欢迎来到山里人网站”,然后调整好文字大小和位置,然后 在 15 帧处“插
24、入帧”(不是关键帧啊,因为文字不动又不用建立动画,不必要插入关键帧的)。第三步:单击“彩虹条”图层第一帧,单击“矩形工具”在“颜色”栏中“笔触颜色”选无,“填充色”选“五彩色”画出一块彩虹条(画好的彩虹条宽要能复盖住文字,长要长出文字一点),然后打开“混色器”按照你的爱好增加色彩块。我做的是下面这个样子的,见下图:第四步:把制作好的“彩虹条”放在文字上,让它复盖住文字,右边横的一头长出文字一点。然后在 15 帧处插入“关键帧”,第 5 帧、第 10 帧处同样插入“关键帧”,并分别创建“补间动画”。单击“第二个关键帧”,把“彩虹条”向左移动一点,单击“第四个关键帧”把“彩虹条”向右移动一点。(注
25、意:移动“彩虹条”时不要让“彩虹条”超出文字,最好你用键盘“方向键”来操作。我这里是加了 4 个关键帧,你也各面板的组成及各部分主要功能情感目标培养学生对更浓厚的兴趣教学重点与难点动画产生原理掌握的工作环境三教学方法演示法观察法自学法四教学课时课时五教学过程一导入什么是是美国公司出品的一个矢量图形和交互式动画独特的具有交互功能的动画效果使用可以作出梦幻般的动画效果动画的特点动画文件非常小适合在网络上传输易学易用功能强大交互功能强大使用制作出的影片可以是观赏者轻松地参与到故事情节中因此使用可开发出许多好玩的游晰而不象一般的格式和格式的图象放大时看到的是一个个方形的色块动画的应用引领多媒体课件制作
26、的新概念还可以应用于产品展示宣传广告方面制作开发各种交互式游戏动画产生的原理一幅幅静态图象帧形成连续运动的动画快速学习必备 欢迎下载 可以加 3 个就得了。你想要文字闪动快点,你就选短点帧数,想要闪慢点你就选长点帧数啰)。第五步:导出影片看结果。是不是很爽?不像我制作的?呵呵,差点忘记,请你在“文字”图层上右击,在弹出的菜单中选“庶罩层”,好 OK了,(一般制作歌词时,最好在后台里做好 MC然后 中空文字 组织教学 复习提问 上节课所学的内容。知识点:1 文字工具的使用:2 墨水瓶的应用。制作过程:1.新建一个 FLA文档,属性 400*150,背景黑色,其他默认,确定。2.点一下时间轴中图层
27、 1 的第一贞,然后再点一下工具栏里的文字 工具A,在属性中选黑体字,大小 90,颜色红色。如图:3.在工作区输入缘分天空四个字。点窗口对齐面版,水平中齐,垂直中齐。4.选黑尖头工具,到场景中选中这四个字。点修改分离分离(或 CTRL+B 2 次),打散。如图:5.点墨水瓶工具,属性笔触颜色绿色,实线,笔触高度2。6.在工作区中每一个字的边缘点一下,效果如图 7.选黑尖头工具,将文字中间的填充部分删除,只留下文字边框。8.保存 FLASH 文件和 SWF文件。组织教学 复习提问 上节课所学的内容。此实例的实现的是带荧光文字效果,在制作过程中主要使用了渐变填充等工具,通过简简单单几样工具便创造出
28、了漂亮的文字特效。难点就在于图形、色彩编辑的技巧和填充工具的使用。通过对文字边框进行柔化处理,产生具有霓虹灯效果的荧光文字。最终播放效果如图 1 所示,要实现这一效果,具体制作过程如下:1.新建一个电影,在属性面板中设置其尺寸为 480pxX150px,选择一种颜色(本例为#000099)作为背景色。2.从工具箱中选取文本工具,在属性面板中设置字体类型设置成 VladimirScrD,字体大小设置成 100,在舞台上输入“Flashghost”。选择工具栏中箭头工具,将文字移动到工作区中间。按键盘的“Ctrl+B”键,将文字打碎。分离文本 3.选择工具栏中墨水瓶工具,将墨水瓶工具参数栏中线条颜
29、色设置成明黄色,线条宽度设置成 1.0,将鼠标移动到工作区中,鼠标光标将变成墨水瓶形状,用鼠标依次点击文字边框,文字周围将出现明黄色边框。为文本描边 2.按 Delete 删除填充区域 删除坛区域 4.选择工具栏中的箭头工具,按住键盘上的 Shift键,依次双击每个字母外的明各面板的组成及各部分主要功能情感目标培养学生对更浓厚的兴趣教学重点与难点动画产生原理掌握的工作环境三教学方法演示法观察法自学法四教学课时课时五教学过程一导入什么是是美国公司出品的一个矢量图形和交互式动画独特的具有交互功能的动画效果使用可以作出梦幻般的动画效果动画的特点动画文件非常小适合在网络上传输易学易用功能强大交互功能强
30、大使用制作出的影片可以是观赏者轻松地参与到故事情节中因此使用可开发出许多好玩的游晰而不象一般的格式和格式的图象放大时看到的是一个个方形的色块动画的应用引领多媒体课件制作的新概念还可以应用于产品展示宣传广告方面制作开发各种交互式游戏动画产生的原理一幅幅静态图象帧形成连续运动的动画快速学习必备 欢迎下载 黄色边框,将他们全部选中,选择菜单“修改/形状/将线条转换为扩充”菜单命令,黄色边框被转变成可填充区域。5.选择菜单“修改/形状/柔化填充边缘”,再按照如图所示的参数设“置柔化填充边缘”对话框,进行如图 5 所示,点击“确定”按钮,关闭对话框。6.选择工具栏中箭头工具,在工作区的空白处点击鼠标,取
31、消对文字边框的选择。这时可以看到,明黄色边线两边出现了模糊渐变,保存作品,按“Ctrl+Enter”预览最终效果,就可以看见漂亮的荧光文字效果。小结 本章通过学习 Flash 的设计工具,再结合一个个生动有趣的案例来熟悉 Flash 工具箱中各种工具的使用方法及相关属性的设置,通过对这些案例的学习,使学生在乐趣中学到知识,掌握知识,运用知识,为将后的动画制作打下牢固的基础。教学后记:第二章 小试身手简单动画 第一节 步步为营逐帧动画 一、教学目标:知识目标:1.创建逐帧动画的几种方法教学 2.简单动画的制作方法 能力目标 学会用绘制的图形来制作“逐帧动画 情感目标 体会创作的乐趣,进一步培养制
32、作动画的兴趣;培养学生创新能力与探究问题的能力;培养创造性思维能力。二、教学重点与难点:简单动画的制作方法 三、教学方法:演示教学法 四、教学手段与教学媒体 多媒体网络教室。五、教学课时:2 课时 六、教学过程:导入:从本单元起,我们将逐渐给大家介绍 Flash 中的五种常见的动画形式:逐帧动画、形状补间动画、动作补间动画、遮罩动画、引导线动画。本节着重介绍逐帧动画(FrameBy Frame),这是一种常见的动画手法,它的原理是在“连续的关键帧”中分解动画动作,也就是每一帧中的内容不同,连续播放而成动画。由于逐帧动画的帧序列内容不一样,不仅增加制作负担而且最终输出的文件量也很大,但它的优势也
33、很明显:因为它相似与电影播放模式,很适合于表演很细腻的动画,如 3D效果、人物或动物急剧转身等等效果。各面板的组成及各部分主要功能情感目标培养学生对更浓厚的兴趣教学重点与难点动画产生原理掌握的工作环境三教学方法演示法观察法自学法四教学课时课时五教学过程一导入什么是是美国公司出品的一个矢量图形和交互式动画独特的具有交互功能的动画效果使用可以作出梦幻般的动画效果动画的特点动画文件非常小适合在网络上传输易学易用功能强大交互功能强大使用制作出的影片可以是观赏者轻松地参与到故事情节中因此使用可开发出许多好玩的游晰而不象一般的格式和格式的图象放大时看到的是一个个方形的色块动画的应用引领多媒体课件制作的新概
34、念还可以应用于产品展示宣传广告方面制作开发各种交互式游戏动画产生的原理一幅幅静态图象帧形成连续运动的动画快速学习必备 欢迎下载 1逐帧动画的概念和在时间帧上的表现形式 在时间帧上逐帧绘制帧内容称为逐帧动画,由于是一帧一帧的画,所以逐帧动画具有非常大的灵活性,几乎可以表现任何想表现的内容。逐帧动画在时间帧上表现为连续出现的关键帧。逐帧动画 2创建逐帧动画的几种方法(1)用导入的静态图片建立逐帧动画 用 jpg、png 等格式的静态图片连续导入 Flash 中,就会建立一段逐帧动画。(2)绘制矢量逐帧动画 用鼠标或压感笔在场景中一帧帧的画出帧内容。(3)文字逐帧动画 用文字作帧中的元件,实现文字跳
35、跃、旋转等特效。(4)导入序列图像 可以导入 gif 序列图像、swf 动画文件或者利用第 3 方软件(如 swish、swift 3D等)产生的动画序列。3绘图纸功能(1)绘画纸的功能 绘画纸是一个帮助定位和编辑动画的辅助功能,这个功能对制作逐帧动画特别有用。通常情况下,Flash 在舞台中一次只能显示动画序列的单个帧。使用绘画纸功能后,你就可以在舞台中一次查看两个或多个帧了。如图 3-2-2所示,这是使用绘画纸功能后的场景,可以看出,当前帧中内容用全彩色显示,其它帧内容以半透明显示,它使我们看起来好像所有帧内容是画在一张半透明的绘图纸上,这些内容相互层叠在一起。当然,这时你只能编辑当前帧的
36、内容。(2)绘图纸各个按钮的介绍 1、绘图纸外观按钮 按下此按钮后,在时间帧的上方,出现 绘图纸外观标记。拉动外观标记的两端,可以扩大或缩小显示范围。2、绘图纸外观轮廓 按下此按钮后,场景中显示各帧内容的轮廓线,填充色消失,特别适合观察对象轮廓,另外可以节省系统资源,加快显示过程。3.3、绘图纸显示多帧按钮,按下后可以显示全部帧内容,并且可以进行“多帧同时编辑”。4、修改绘图纸标记 按下后,弹出菜单,菜单中有以下选项:“总是显示标记”选项会在时间轴标题中显示绘图纸外观标记,无论绘图纸外观是否打开。“锚定绘图纸外观标记”选项会将绘图纸外观标记锁定在它们在时间轴标题中的当前位置。通常情况下,绘图纸
37、外观范围是和当前帧的指针以及绘图纸外观标记相关的。通过锚定绘图纸外观标记,可以防止它们随当前帧的指针移动。“绘图纸 2”选项会在当前帧的两边显示两个帧。“绘图纸 5”选项会在当前帧的两边显示五个帧。“绘制全部”选项会在当前帧的两边显示全部帧。上面,我们全面介绍了逐帧动画的特点和创建方法,现在,我们来动手制作二个逐帧动画实例,以加深对逐帧动画的认识。第 2 课时 组织教学 复习提问 各面板的组成及各部分主要功能情感目标培养学生对更浓厚的兴趣教学重点与难点动画产生原理掌握的工作环境三教学方法演示法观察法自学法四教学课时课时五教学过程一导入什么是是美国公司出品的一个矢量图形和交互式动画独特的具有交互
38、功能的动画效果使用可以作出梦幻般的动画效果动画的特点动画文件非常小适合在网络上传输易学易用功能强大交互功能强大使用制作出的影片可以是观赏者轻松地参与到故事情节中因此使用可开发出许多好玩的游晰而不象一般的格式和格式的图象放大时看到的是一个个方形的色块动画的应用引领多媒体课件制作的新概念还可以应用于产品展示宣传广告方面制作开发各种交互式游戏动画产生的原理一幅幅静态图象帧形成连续运动的动画快速学习必备 欢迎下载 上节课所学的内容。奔跑的豹子 茫茫雪原上,有一只矫健的豹子在奔跑跳跃,这是一个利用导入连续位图而创建的逐帧动画.1、创建影片文档 执行【文件】|【新建】命令,在弹出的面板中选择【常规】|【F
39、lash 文档】选项后,点击【确定】按钮,新建一个影片文档,在【属性】面板上设置文件大小为 400*260象素,【背景色】为白色,如图 3-2-4 所示。2、创建背景图层 选择第一帧,执行【文件】|【导入到场景】命令,将本实例中的名为“雪景.bmp”图片导入到场景中。在第 8 帧按 F5,加过渡帧使帧内容延续。3、导入 gif 动画 新建一层,选择第一帧,执行【文件】|【导入到场景】命令,将本教程中的“奔跑的豹子”系列图片导入。此时,会弹出一个对话框,如图 3-2-5所示。选择【是】按钮,Flash 会自动把 gif 中的图片序列按序以逐帧形式导入场景的左上角,如图 3-2-7所示。导入的 g
40、if 动画在场景的上方形成帧帧动画 导入后的动画序列,它们被 Flash 自动分配在 8 个关键帧中。4、调整对象位置 此时,时间帧区出现连续的关键帧,从左向右拉动播放头,就会看到一头勇猛的豹子在向前奔跑,但是,被导入的动画序列位置尚未处于我们需要的地方,缺省状况下,导入的对象被放在场景坐标“0,0”处,我们必须移动它们。你当然可以一帧帧调整位置,完成一幅图片后记下其坐标值,再把其它图片设置成相同坐标值,如果你有足够耐性和时间,也无妨,那么,我们何不试试“多帧编辑”功能呢?先把“雪景”图层加锁,然后按下时间轴面板下方的【绘图纸显示多帧】按钮 ,再单击【修改绘图纸标记】按钮 ,在弹出的菜单中选择
41、【显示全部】选项.最后执行【编辑】|【全选】命令,此时时间轴和场景效果如图 3-2-10所示。用鼠标左键按住场景左上方的豹子拖动,就可以一次把 8 帧中的图片一次全移动到场景中了。5、设置标题文字 在场景中新建一个图层,单击工具栏上的文字工具按钮 ,设置【属性】面板上的文本参数如下,【文本类型】为静态文本;【字体】为隶书;【字体大小】35;【颜色】为深蓝色。如图 3-2-11 所示。在文本框输入“奔跑的豹子”五个字,居中放置。6、测试存盘 执行【控制】|【测试影片】命令,观察本例 swf 文件生成的动画有无问题,如果满意,执行【文件】|【保存】命令,将文件保存成“奔跑的豹子.fla”文件存盘,
42、如果要导出 Flash 的播放文件,执行【导出】|【导出影片】命令保存成“奔跑的豹子.swf”文件。教学后记:第二节 形状渐变动画 各面板的组成及各部分主要功能情感目标培养学生对更浓厚的兴趣教学重点与难点动画产生原理掌握的工作环境三教学方法演示法观察法自学法四教学课时课时五教学过程一导入什么是是美国公司出品的一个矢量图形和交互式动画独特的具有交互功能的动画效果使用可以作出梦幻般的动画效果动画的特点动画文件非常小适合在网络上传输易学易用功能强大交互功能强大使用制作出的影片可以是观赏者轻松地参与到故事情节中因此使用可开发出许多好玩的游晰而不象一般的格式和格式的图象放大时看到的是一个个方形的色块动画
43、的应用引领多媒体课件制作的新概念还可以应用于产品展示宣传广告方面制作开发各种交互式游戏动画产生的原理一幅幅静态图象帧形成连续运动的动画快速学习必备 欢迎下载 一、教学目标:知识目标:1.掌握形状渐变动画制作的原理 2.制作简单的三形互变动画 3.自由变形工具 能力目标 1.根据形变类型分析,能完成典型形变小动画制作 2.根据技能掌握程度,能力争完成综合应用实例 3.能在实践过程中学会思考并归纳小结 情感目标 1.增加学生对课程的专业情感,为后面的技能学习作铺垫 2.在技能实践中,增强同学间的互助意识,培养合作精神 二、教学重点与难点:形状渐变动画制作的原理 三、教学方法:演示比较法 自主探究法
44、、总结归纳法 四、教学手段与教学媒体 多媒体网络教室。五、教学课时:2 课时 五、教学过程:导入:实例说明:本例制作一个三形互变的动画。其效果是手形变成圆形,圆形变成方形。实例中应用了形变动画的制作技巧,如果掌握了本例就掌握了形变动画的制作方法。技术要点:使用直线工具,椭圆工具和颜料桶工具绘制手形,圆形、方形;自由变形工具的功能和形变动画制作的方法 教学步骤:一、形状渐变动画原理 形状渐变是动画制作的常用手法,它只能应用于打散的图形。其计算方法是在相近的特征处平滑变换。作者可以充分发挥想象力,创作出构思巧妙的动画作品。原理:Flash 自动变形技术可以将一种形状自动变形为另一种形状.制作者只需
45、要指定起始的图形和结束的图形,中间的过渡部分就可由 Flash 自动完成.二、自由变形工具(Free Transform Tool)自由变形工具用来对选中的对象进行各种变形,包括缩放、旋转、歪斜及扭曲,等等。该工具有 5 种变形模式,分别是:自由变形模式、旋转和歪斜变形模式、缩放变形模式、扭曲模式和环绕变形模式。三、操作步骤:1.新建一个 Flash 文件,2.选中第 1 帧,然后选择铅笔工具,在舞台中央绘制一手形轮廓,填充颜色为橘黄色,并将其打散。3.选中第 10 帧,插入关键帧,然后选择椭圆工具,在舞台中央绘制一圆,填充颜色为橘黄色。4.选中第 20 帧,插入关键帧,然后选择正方形工具,在
46、舞台中央绘制一正方形,各面板的组成及各部分主要功能情感目标培养学生对更浓厚的兴趣教学重点与难点动画产生原理掌握的工作环境三教学方法演示法观察法自学法四教学课时课时五教学过程一导入什么是是美国公司出品的一个矢量图形和交互式动画独特的具有交互功能的动画效果使用可以作出梦幻般的动画效果动画的特点动画文件非常小适合在网络上传输易学易用功能强大交互功能强大使用制作出的影片可以是观赏者轻松地参与到故事情节中因此使用可开发出许多好玩的游晰而不象一般的格式和格式的图象放大时看到的是一个个方形的色块动画的应用引领多媒体课件制作的新概念还可以应用于产品展示宣传广告方面制作开发各种交互式游戏动画产生的原理一幅幅静态
47、图象帧形成连续运动的动画快速学习必备 欢迎下载 填充颜色为橘黄色。5.选中第 30 帧,插入帧,使得方形在屏幕上停顿几秒钟。6.选中第 1 帧,在属性面板中设置如下:Tween-Shape(设置形状渐变动画)7.依次在第 10、20 帧处设置运动属性为:shape(形状渐变动画)8.按住 Ctrl+Enter,预览动画。四、练习 1.做一个三形互变动画。2.练习使用自由变形工具,将图形做缩放,扭曲变形。第 2 课时 颜色形状渐变动画 教学目标:1.掌握颜色形状渐变动画的制作 2.了解由大变小、由小变大动画的制作方法 3.填充调整工具的使用 教学重点与难点:1.颜色渐变动画的制作 2.填充调整工
48、具的使用 实例说明:本例制作一个颜色不断变化的球体。颜色由绿色变为红色,在从红色变为兰色,反光部分随之移动。技术要点:绘制基本图形,填色及使用填充调整工具调整填充效果;使用形变动画技术制作色彩变化效果 教学方法:实例演示法 教学课时:1 课时 教学步骤:一、填充调整工具(Fill Transform Tool)填充调整工具可以编辑的填充方式有 3 种:线性渐变填充、辐射渐变填充和位图填充。下面以线性渐变填充的调整为例来说明该工具的使用方法。1.从工具箱中选择填充调整工具 2.在舞台中选中要调整填充的对象,这时在该对象上将会出现控制柄,3.拖动中心控制柄可以调整填充中心的位置。(在 flash
49、中为学生演示起效果)4.拖动旋转控制柄可以调整填充的方向 5.拖动比例控制柄可以调整线型的填充范围。二、操作步骤:1.新建 flash文档 2.选中第 1 帧,从工具箱中选择椭圆工具,在属性面板中选择颜色按钮,打开拾色器。按住 shift 键在场景中绘制一个圆形。3.选择颜料桶工具,打开拾色器。选择拾色器底部第 2 个色块,然后将鼠标移动到圆形上方为图形填色。4.选择填充调整工具,单击场景中的圆形。这时在圆形周围出现调节句柄,使用鼠标移动句柄,就可以修改图形反光部分。各面板的组成及各部分主要功能情感目标培养学生对更浓厚的兴趣教学重点与难点动画产生原理掌握的工作环境三教学方法演示法观察法自学法四
50、教学课时课时五教学过程一导入什么是是美国公司出品的一个矢量图形和交互式动画独特的具有交互功能的动画效果使用可以作出梦幻般的动画效果动画的特点动画文件非常小适合在网络上传输易学易用功能强大交互功能强大使用制作出的影片可以是观赏者轻松地参与到故事情节中因此使用可开发出许多好玩的游晰而不象一般的格式和格式的图象放大时看到的是一个个方形的色块动画的应用引领多媒体课件制作的新概念还可以应用于产品展示宣传广告方面制作开发各种交互式游戏动画产生的原理一幅幅静态图象帧形成连续运动的动画快速学习必备 欢迎下载 5.选中第 15 帧,插入关键帧 6.打开颜料桶工具的拾色器。选择拾色器底部第 3 个色块,然后将鼠标