第一章 遨游Flash海洋

文档属性

名称 第一章 遨游Flash海洋
格式 zip
文件大小 63.5KB
资源类型 教案
版本资源 其它版本
科目 信息技术(信息科技)
更新时间 2012-02-14 18:25:39

图片预览

文档简介

第一章 遨游Flash海洋
第一节 走进新天地——认识flash界面
一、教学目标
知识目标
1、了解Flash的功能特点。
2、掌握Flash启动方法。
能力目标
了解Flash中各面板的组成及各部分主要功能。
情感目标
培养学生对Flash更浓厚的兴趣。
教学重点与难点:
Flash 动画产生原理
2、掌握Flash 的工作环境
三、教学方法:
演示法、观察法、自学法
四、教学课时:1课时
五、教学过程:
导入:
1.什么是FLASH
Flash是美国Macromedia公司出品的一个矢量图形和交互式动画制作软件.主要应用于网页设计和多媒体动画创作领域.它可以将文字、图画、声音和视频融于一体,最终构成有声有色,品位独特的具有交互功能的动画效果。使用Flash可以作出梦幻般的动画效果.
2、Flash动画的特点:
a.动画文件非常小,适合在网络上传输。
b.易学易用,功能强大。
c.交互功能强大,使用flash制作出的影片可以是观赏者轻松地参与到故事情节中,因此使用flash可开发出许多好玩的游戏。
d.流媒体格式。可以边下载边观看(无需完全下载完在进行播放)
e.用Flash作出来的动画是矢量动画(当把它放大时,它依然很清晰),而不象一般的gif格式和jpf格式的图象,放大时,看到的是一个个方形的色块.
3、Flash动画的应用:
a、引领多媒体课件制作的新概念。
b.Flash还可以应用于产品展示,宣传广告方面。
c.制作MTV。
d.开发各种交互式游戏
4、Flash动画产生的原理:
一幅幅静态图象(帧)————形成连续运动的动画。
快速播放
原理:图象迅速播放使得人眼很难觉察出短暂的时间间隔。
5、FlashMX的三种文件格式:
a.fla 源文件,可在flash中打开修改。
b.swf 发布文件,不包括原始的冗余的信息,只包含与动画播放有的必要信息。所以,swf文件不可用flash在重新打开修改.
c.exe 文件中包含了flash播放器和swf内容的程序,它不需要播放器就可直接浏览。
第二课时
组织教学
复习提问
上节课所学的内容。
1.菜单栏
菜单栏位于主界面的顶部,它由9组菜单命令组成。掌握了菜单栏中命令的使用,就掌握了FLASH MX饿基本操作。
2.工具箱
工具箱位于主界面的左侧。工具箱中提供了选择、绘画、文字及修改的常用工具。以后我们在学习中不断对工具箱中的工具做介绍。
3.时间轴
时间轴位于菜单栏的下面,它由两部分组成,左边的不凡用来对图层进行操作;右边的部分对帧进行操作。在时间轴中可以很方便地对层或帧进行选择、编辑、控制以及设置。
4.舞台
舞台是进行动画创作的工作区域,它位于主界面的中央,占据了比较大的空间。在舞台中可以对当前帧的内容进行编辑。
5.面板
面板位于主界面的底部和右侧,每一个面板都提供某一方面的功能。其中,位于主界面底部的是属性面板,是我们经常用到的面板,它可以根据当前对象的不一样,显示不同的属性面板。
六、练习
观察FLASH菜单与WORD 菜单的区别与联系。
熟悉FLASH MX的工作环境
七、小结:
教学后记:
第二节 我是小画家——绘图工具
一、教学目标:
知识目标:
1.绘图工具的种类
2.绘图工具的使用方法
能力目标
能够熟练使用各种绘图工具
情感目标
培养学生浓厚的学习兴趣,引导学生探索性自主学习,培养学生创新精神及能力。
二、教学重点与难点:
学习使用绘图工具
三、教学方法:
实例演示法
四、教学手段与教学媒体
多媒体网络教室。
五、教学课时:
1课时
五、教学过程:
导入:
Flash基础绘图工具
在计算机绘图领域中,根据成图原理和绘制方法的不同,分为矢量图和位图两种类型。
矢量图形是由一个个单独的点构成的,每一个点都有其各自的属性,如位置、颜色等。因此,矢量图与分辨率无关,对矢量图进行缩放时,图形对象仍保持原有的清晰度和光滑度,不会发生任何偏差.
如位图图像是由象素点构成的,象素点的多少将决定位图图像的显示质量和文件大小,位图图像的分辨率越高,其显示越清晰,文件所占的空间也就越大。

Flash 提供了各种工具来绘制自由形状或准确的线条、形状和路径,并可用来对填充对象涂色。
在本节里,我们学习线条工具、滴管工具、墨水瓶工具、箭头工具、刷子工具、任意变形工具、颜料桶等工具的基本用法。
1.绘制和处理线条
【线条工具】是Flash中最简单的工具。现在我们就来画一条直线。鼠标单击【线条工具】 ,移动鼠标指针到舞台上,在你希望直线开始的地方按住鼠标拖动,到结束点松开鼠标,一条直线就画好了。
【线条工具】能画出许多风格各异的线条来。打开【属性】面板,在其中,我们可以定义直线的颜色、粗细和样式,如图2-1-2所示。
在图2-1-2所示的【属性】面板中,单击其中的【笔触颜色】按钮 ,会出现一个调色板对话框,同时光标变成滴管状。用滴管直接拾取颜色或者在文本框里直接输入颜色的16进制数值。颜色以#开头,如#99FF33。
现在来画出各种不同的直线。单击【属性】面板中的【自定义】按钮,会弹出一个【笔触样式】对话框,如图2-1-4所示。
方便观察,我们把粗细定为3象素(pts),选择不同的线型和颜色,来看看我们画出的线条,如图2-1-5所示。
试一试改变它的各项参数,会对你的绘图有很大帮助。
【滴管工具】和【墨水瓶工具】可以很快地将一条直线的颜色样式套用到别的线条上。用【滴管工具】单击上面的直线,看看【属性】面板,它显示的就是该直线的属性,而且工具也自动变成了【墨水瓶工具】,如图2-1-6所示。
使用【墨水瓶工具】 单击其它线条,看看什么结果:所有线条的属性都变成了和滴管工具选中的直线一样了。
如果你需要更改这条直线的方向和长短,Flash也为我们提供了一个很便捷的工具:【箭头工具】 。
【箭头工具】的作用是选择对象、移动对象、改变线条或对象轮廓的形状。单击选择【箭头工具】,然后移动鼠标指针到直线的端点处,指针右下角变成直角状 ,这时拖动鼠标可以改变直线的方向和长短,如图2-1-7所示。
如果鼠标指针移动到线条中任意处,指针右下角会变成弧线状,拖动鼠标,可以将直线变成曲线。这是一个很有用处的功能,在我们鼠标绘图还不能随心所欲时,它可以帮助我们画出所需要的曲线,如图2-1-8所示。
2.实例演练——画一片树叶
现在我们就来实践一下,练习画一片树叶。
打开FALSH软件,系统会自动建立一个FLASH文档,在这里我们不改变文档的属性,直接使用其默认值。
(1)新建图形元件
执行【插入】|【新建元件】命令,或者按快捷键CTRL+F8,弹出创建新元件对话框,在【名称】文本对话框中输入元件名称“树叶”,【行为】选择“图形”,单击【确定】按钮,如图2-1-9所示。
这时工作区变为“树枝”元件的编辑状态,如图2-1-10所示。
说明:图形元件是Flash的基本元素,有关它的详细内容请参阅第4章的有关内容。
(2)绘制树叶图形
在“树叶”图形元件编辑场景中,首先用【线条工具】画一条直线,【笔触颜色】设置为深绿色,如图2-1-11所示。
然后用【箭头工具】将它拉成曲线,如图2-1-12所示。
再用【线条工具】绘制一个直线,用这条直线连接曲线的两端点,如图2-1-13所示
用【箭头工具】将这条直线也拉成曲线,如图2-1-14所示。
一片树叶的基本形状已经出来了,现在我们画叶脉,在两端点间画直线,然后拉成曲线,如图2-1-15和图2-1-16所示。
边的细小叶脉,可以全用直线,也可以略加弯曲,这样,一片简单的树叶就画好了,如图2-1-17所示。
(3)编辑和修改树叶
如果在画树叶的时候出现错误,比如说,画出的叶脉不是你所希望的样子,你可以执行【编辑】|【撤销】命令撤销前面一步的操作,也可以选择下面更简单的方法:用【箭头工具】单击你想要删除的直线,这条直线变成网点状,说明它已经被选取,你可以对它进行各种修改,如图2-1-18所示。
要移动它,就按住鼠标拖动,要删除它,就直接按DEL键。按住SHIFT键连续单击线条,可以同时选取多个对象。如果要选取全部的线条,是否得按住SHIFT键挨个点击呢?不需要,我们用黑色箭头工具拉出一个选取框来,就可以将其全部选中了,如图2-1-19所示。
说明:在一条直线上双击,也可以将和这条直线相连并且颜色、粗细、样式相同的整个线条范围全部选取。
(4)给树叶上色
接下来我们要给这片树叶填上颜色。在工具箱中看到这个【颜色】选项了吗?如图2-1-20所示
单击【填充颜色】按钮 ,会出现一个调色板,同时光标变成吸管状,如图2-1-21所示。
说明:你除了可以选择调色板中的颜色外,还可以点选屏幕上任何地方吸取你所需要的颜色。
如果你觉得调色板的颜色太少不够选,单击一下调色板右上角的【颜色选择器】按钮 ,会弹出一个【颜色】对话框,其中有更多的颜色选项,在这里,你能把选到的颜色添加到自定义颜色中,如图2-1-22所示。
在【自定义颜色】选项下单击一个自定义色块,该色块会被虚线包围,在【颜色】对话框右边的【调色板】中单击你喜欢的颜色,上下拖动右边颜色条上的箭头,移到你需要的深浅度上,单击【添加到自定义颜色】按钮,这个色块就被你收藏起来了。下一次要使用时,打开这个【颜色】面板,在自定义色中可以方便的选取你中意的颜色。
好了,现在我们在调色板里选取绿色,单击工具箱里【颜料桶工具】,在画好的叶子上单击一下,看看什么效果,如图2-1-23所示。
只有一小块颜色?原来,这个颜料桶只能在一个封闭的空间里填色。取消刚刚的填色,现在我们用【橡皮工具】将线条擦出一个缺口,再看效果,如图2-1-24所示。
你看,残缺线条的两边都填上了颜色。
好,我们还是一块一块的填上颜色吧。但是在填充颜色前,你一定要将树叶图形恢复到使用【橡皮工具】擦除操作前的模样哦。
这时,你可能会想,如果我们刚才先填充颜色再画叶脉就省事多了。是的,你想得一点没错!没关系,随着操作的增加,我们的经验会越来越丰富的。最后填充完的效果如图2-1-25所示。
至此,一个树叶图形就绘制好了。请你执行【窗口】|【库】命令,打开【库】面板,你将发现【库】面板中出现一个“树叶”图形元件,如图2-1-26所示。
说明:【库】面板是存储Flash元件的场所,我们所创建的元件对象以及从外部导入的图像、声音等对象都保存在这里,这里的元件可以拖放到场景中重复使用。有关【库】面板的详细内容请你参阅第4章的相关内容。
(5)【颜料桶工具】选项
单击【颜料桶工具】后,在工具箱下边的【选项】里有四个选项,可以根据自己的需要来确定,读者可以自己试一下,如图2-1-26所示。
说明:【颜料桶工具】是对某一区域进行单色、渐变色或位图进行填充,注意不能作用于线条。选择【颜料桶工具】后,在【工具箱】下边的【选项】中单击【空隙大小】按钮,会弹出四个选项,如图1-2-11所示。其中,【不封闭空隙】表示要填充的区域必须在完全封闭的状态下才能进行填充;【封闭小空隙】表示要填充的区域在小缺口的状态下可以进行填充;【封闭中等空隙】表示要填充的区域在中等大小缺口状态下进行填充;【封闭大空隙】表示要填充的区域在较大缺口状态下也能填充。但在Flash中,即使中大缺口,值也是很小的,所在要对大的不封闭区域填充颜色,一般用笔刷。
3.【刷子工具】的用法
【刷子工具】 可以随意地画色块。当你单击工具箱中的【刷子工具】后,工具箱下边就会显示它的【选项】,我们先看看它的【选项】,如图2-1-27所示。
在这里,我们可以选定画笔的大小和样式以及它的填色模式。读者可以自己选取不同的大小和样式练习练习,先找一找感觉。
下面我们利用刚刚画成的树叶来详细讲解它的填色模式。在图2-1-27所示的【选项】下单击【填充模式】按钮,则弹出填充模式下拉列表,如图2-1-28所示。
(1)标准绘画
选择【刷子工具】,并将【填充颜色】设置为黄色,当然也可以是其它色。先选择【标准绘画】模式,移动笔刷(当选择了【刷子工具】后,鼠标指针就变为刷子形状)到舞台的树叶图形上,拖动鼠标在叶子上乱抹几下,观察一下效果,如图2-1-29所示。
你能发现,不管是线条还是填色范围,只要是画笔经过的地方,都变成了画笔的颜色。
(2)颜料填充
选择【颜料填充】模式,它只影响了填色的内容,不会遮盖住线条,如图
(3)后面绘画
选择【后面绘画】模式,无论你怎么画,它都在图像的后方,不会影响前景图像,如图2-1-3所示。
(4)颜料选择
选择【颜料选择】模式,你先用画笔抹几下,好象丝毫不起作用。这是因为我们没有选择范围。用【箭头工具】选中叶片的一块,再使用画笔,你看,颜色就上去了,如图2-1-32所示。
(5)内部绘画
选择【内部绘画】模式,在绘画时,画笔的起点必须是在轮廓线以内,而且画笔的范围也只作用在轮廓线以内.
小结
教学后记:
第三节 五彩斑斓的文字世界——文字效果
一、教学目标:
知识目标:
学习Flash 中文本工具和渐变色的使用,掌握文字制作的一些基本技巧。
能力目标
能够学会各种文字制作的方法
情感目标
培养学生浓厚的学习兴趣,引导学生探索性自主学习.
二、教学重点与难点:
掌握文字制作的基本技巧
三、教学方法:
实例演示法
四、教学手段与教学媒体
多媒体网络教室。
五、教学课时:
3课时
六、教学过程:
导入:
彩虹文字
第一步:打开Flash建立一个新文档,把舞台设为黑色。建立二个图层,把图层1命名为“彩虹条”,图层2命名为“文字”。(因为文字不动一定要把它放在一层,我们要条动,通过彩虹条动过把文字秀出来,所以要把它放在下层)。
第二步:单击“文字”图层第一帧,单击“文本工具”转入文字,我这里转入的是“欢迎来到山里人网站”,然后调整好文字大小和位置,然后 在15帧处“插入帧”(不是关键帧啊,因为文字不动又不用建立动画,不必要插入关键帧的)。
第三步:单击“彩虹条”图层第一帧,单击“矩形工具”在“颜色”栏中“笔触颜色”选无,“填充色”选“五彩色”画出一块彩虹条(画好的彩虹条宽要能复盖住文字,长要长出文字一点),然后打开“混色器”按照你的爱好增加色彩块。我做的是下面这个样子的,见下图:
第四步:把制作好的“彩虹条”放在文字上,让它复盖住文字,右边横的一头长出文字一点。然后在15帧处插入“关键帧”,第5帧、第10帧处同样插入“关键帧”,并分别创建“补间动画”。单击“第二个关键帧”,把“彩虹条”向左移动一点,单击“第四个关键帧”把“彩虹条”向右移动一点。(注意:移动“彩虹条”时不要让“彩虹条”超出文字,最好你用键盘“方向键”来操作。我这里是加了4个关键帧,你也可以加3个就得了。你想要文字闪动快点,你就选短点帧数,想要闪慢点你就选长点帧数啰)。
第五步:导出影片看结果。是不是很爽?不像我制作的?呵呵,差点忘记,请你在“文字”图层上右击,在弹出的菜单中选“庶罩层”,好OK了,(一般制作歌词时,最好在后台里做好MC然后
第2课时
中空文字
组织教学
复习提问
上节课所学的内容。
知识点:1文字工具的使用:
2墨水瓶的应用。
制作过程:
1.新建一个FLA文档,属性400*150,背景黑色,其他默认,确定。
2.点一下时间轴中图层1的第一贞,然后再点一下工具栏里的文字
工具‘A’,在属性中选‘黑体’字,大小90,颜色红色。如图:
3.在工作区输入‘缘分天空’四个字。点窗口———对齐面版,
水平中齐,垂直中齐。
4.选黑尖头工具,到场景中选中这四个字。点修改——分离——分离
(或CTRL+B 2次),打散。如图:
5.点墨水瓶工具,属性笔触颜色‘绿色’,实线,笔触高度‘2’。
6.在工作区中每一个字的边缘点一下,效果如图
7.选黑尖头工具,将文字中间的填充部分删除,只留下文字边框。
8.保存FLASH文件和SWF文件。
第3课时
组织教学
复习提问
上节课所学的内容。
此实例的实现的是带荧光文字效果,在制作过程中主要使用了渐变填充等工具,通过简简单单几样工具便创造出了漂亮的文字特效。难点就在于图形、色彩编辑的技巧和填充工具的使用。通过对文字边框进行柔化处理,产生具有霓虹灯效果的荧光文字。最终播放效果如图1所示,要实现这一效果,具体制作过程如下:
1.新建一个电影,在属性面板中设置其尺寸为480pxX150px,选择一种颜色(本例为#000099)作为背景色。
2.从工具箱中选取文本工具,在属性面板中设置字体类型设置成VladimirScrD,字体大小设置成100,在舞台上输入 “Flashghost”。选择工具栏中箭头工具,将文字移动到工作区中间。按键盘的“Ctrl+B”键,将文字打碎。
分离文本
3.选择工具栏中墨水瓶工具,将墨水瓶工具参数栏中线条颜色设置成明黄色,线条宽度设置成1.0,将鼠标移动到工作区中,鼠标光标将变成墨水瓶形状,用鼠标依次点击文字边框,文字周围将出现明黄色边框。
为文本描边
2.按Delete删除填充区域
删除坛区域
4.选择工具栏中的箭头工具,按住键盘上的Shift键,依次双击每个字母外的明黄色边框,将他们全部选中,选择菜单“修改/形状/将线条转换为扩充”菜单命令,黄色边框被转变成可填充区域。
5.选择菜单“修改/形状/柔化填充边缘”,再按照如图所示的参数设“置柔化填充边缘”对话框,进行如图5所示,点击“确定”按钮,关闭对话框。
6.选择工具栏中箭头工具,在工作区的空白处点击鼠标,取消对文字边框的选择。这时可以看到,明黄色边线两边出现了模糊渐变,保存作品,按“Ctrl+Enter”预览最终效果,就可以看见漂亮的荧光文字效果。
小结
本章通过学习Flash 的设计工具,再结合一个个生动有趣的案例来熟悉Flash 工具箱中各种工具的使用方法及相关属性的设置,通过对这些案例的学习,使学生在乐趣中学到知识,掌握知识,运用知识 ,为将后的动画制作打下牢固的基础。
教学后记:
第二章 小试身手——简单动画
第一节 步步为营——逐帧动画
一、教学目标:
知识目标:
1.创建逐帧动画的几种方法教学
2.简单动画的制作方法
能力目标
学会用绘制的图形来制作“逐帧动画
情感目标
体会创作的乐趣,进一步培养制作动画的兴趣;培养学生创新能力与探究问题的能力;培养创造性思维能力。
二、教学重点与难点:
简单动画的制作方法
三、教学方法:
演示教学法
四、教学手段与教学媒体
多媒体网络教室。
五、教学课时:
2课时
六、教学过程:
导入:
从本单元起,我们将逐渐给大家介绍Flash中的五种常见的动画形式:逐帧动画、形状补间动画、动作补间动画、遮罩动画、引导线动画。
本节着重介绍逐帧动画(FrameBy Frame),这是一种常见的动画手法,它的原理是在“连续的关键帧”中分解动画动作,也就是每一帧中的内容不同,连续播放而成动画。
由于逐帧动画的帧序列内容不一样,不仅增加制作负担而且最终输出的文件量也很大,但它的优势也很明显:因为它相似与电影播放模式,很适合于表演很细腻的动画,如3D效果、人物或动物急剧转身等等效果。
1.逐帧动画的概念和在时间帧上的表现形式
在时间帧上逐帧绘制帧内容称为逐帧动画,由于是一帧一帧的画,所以逐帧动画具有非常大的灵活性,几乎可以表现任何想表现的内容。
逐帧动画在时间帧上表现为连续出现的关键帧。
逐帧动画
2.创建逐帧动画的几种方法
(1)用导入的静态图片建立逐帧动画
用jpg、png等格式的静态图片连续导入Flash中,就会建立一段逐帧动画。
(2)绘制矢量逐帧动画
用鼠标或压感笔在场景中一帧帧的画出帧内容。
(3)文字逐帧动画
用文字作帧中的元件,实现文字跳跃、旋转等特效。
(4)导入序列图像
可以导入gif序列图像、swf动画文件或者利用第3方软件(如swish、swift 3D等)产生的动画序列。
3.绘图纸功能
(1)绘画纸的功能
绘画纸是一个帮助定位和编辑动画的辅助功能,这个功能对制作逐帧动画特别有用。通常情况下,Flash 在舞台中一次只能显示动画序列的单个帧。使用绘画纸功能后,你就可以在舞台中一次查看两个或多个帧了。
如图3-2-2所示,这是使用绘画纸功能后的场景,可以看出,当前帧中内容用全彩色显示,其它帧内容以半透明显示,它使我们看起来好像所有帧内容是画在一张半透明的绘图纸上,这些内容相互层叠在一起。当然,这时你只能编辑当前帧的内容。
 (2)绘图纸各个按钮的介绍
1、 绘图纸外观按钮 按下此按钮后,在时间帧的上方,出现 绘图纸外观标记。拉动外观标记的两端,可以扩大或缩小显示范围。
2、 绘图纸外观轮廓 按下此按钮后,场景中显示各帧内容的轮廓线,填充色消失,特别适合观察对象轮廓,另外可以节省系统资源,加快显示过程。3.
3、 绘图纸显示多帧按钮,按下后可以显示全部帧内容,并且可以进行“多帧同时编辑”。
4、 修改绘图纸标记 按下后,弹出菜单,菜单中有以下选项:
“总是显示标记”选项会在时间轴标题中显示绘图纸外观标记,无论绘图纸外观是否打开。
“锚定绘图纸外观标记”选项会将绘图纸外观标记锁定在它们在时间轴标题中的当前位置。通常情况下,绘图纸外观范围是和当前帧的指针以及绘图纸外观标记相关的。通过锚定绘图纸外观标记,可以防止它们随当前帧的指针移动。
“绘图纸 2”选项会在当前帧的两边显示两个帧。
“绘图纸 5”选项会在当前帧的两边显示五个帧。
“绘制全部”选项会在当前帧的两边显示全部帧。
上面,我们全面介绍了逐帧动画的特点和创建方法,现在,我们来动手制作二个逐帧动画实例,以加深对逐帧动画的认识。
第2课时
组织教学
复习提问
上节课所学的内容。
奔跑的豹子
茫茫雪原上,有一只矫健的豹子在奔跑跳跃,这是一个利用导入连续位图而创建的逐帧动画.
1、 创建影片文档
执行【文件】|【新建】命令,在弹出的面板中选择【常规】|【Flash文档】选项后,点击【确定】按钮,新建一个影片文档,在【属性】面板上设置文件大小为400*260象素,【背景色】为白色,如图 3-2-4所示。
2、 创建背景图层
选择第一帧,执行【文件】|【导入到场景】命令,将本实例中的名为“雪景.bmp”图片导入到场景中。在第8帧按F5,加过渡帧使帧内容延续。
3、 导入gif动画
新建一层,选择第一帧,执行【文件】|【导入到场景】命令,将本教程中的“奔跑的豹子”系列图片导入。此时,会弹出一个对话框,如图3-2-5所示。
选择【是】按钮,Flash 会自动把gif中的图片序列按序以逐帧形式导入场景的左上角,如图3-2-7所示。
导入的gif动画在场景的上方形成帧帧动画
导入后的动画序列,它们被Flash自动分配在8个关键帧中。
4 、调整对象位置
此时,时间帧区出现连续的关键帧,从左向右拉动播放头,就会看到一头勇猛的豹子在向前奔跑,但是,被导入的动画序列位置尚未处于我们需要的地方,缺省状况下,导入的对象被放在场景坐标“0,0”处,我们必须移动它们。
你当然可以一帧帧调整位置,完成一幅图片后记下其坐标值,再把其它图片设置成相同坐标值,如果你有足够耐性和时间,也无妨,那么,我们何不试试“多帧编辑”功能呢?
先把“雪景”图层加锁,然后按下时间轴面板下方的【绘图纸显示多帧】按钮 ,再单击【修改绘图纸标记】按钮 ,在弹出的菜单中选择【显示全部】选项.
最后执行【编辑】|【全选】命令,此时时间轴和场景效果如图3-2-10所示。
用鼠标左键按住场景左上方的豹子拖动,就可以一次把8帧中的图片一次全移动到场景中了。
5、 设置标题文字
在场景中新建一个图层,单击工具栏上的文字工具按钮 ,设置【属性】面板上的文本参数如下,【文本类型】为静态文本;【字体】为隶书;【字体大小】35;【颜色】为深蓝色。如图 3-2-11所示。
在文本框输入“奔跑的豹子”五个字,居中放置。
6、 测试存盘
执行【控制】|【测试影片】命令,观察本例swf文件生成的动画有无问题,如果满意,执行【文件】|【保存】命令,将文件保存成“奔跑的豹子.fla”文件存盘,如果要导出Flash的播放文件,执行【导出】|【导出影片】命令保存成“奔跑的豹子.swf”文件。
教学后记:
第二节 形状渐变动画
一、教学目标:
知识目标:
1. 掌握形状渐变动画制作的原理
2. 制作简单的三形互变动画
3. 自由变形工具
能力目标
1.根据形变类型分析,能完成典型形变小动画制作
2. 根据技能掌握程度,能力争完成综合应用实例
3. 能在实践过程中学会思考并归纳小结
情感目标
1.增加学生对课程的专业情感,为后面的技能学习作铺垫
2.在技能实践中,增强同学间的互助意识,培养合作精神
二、教学重点与难点:
形状渐变动画制作的原理
三、教学方法:
演示比较法
自主探究法、总结归纳法
四、教学手段与教学媒体
多媒体网络教室。
五、教学课时:
2课时
五、教学过程:
导入:
实例说明:本例制作一个三形互变的动画。其效果是手形变成圆形,圆形变成方形。实例中应用了形变动画的制作技巧,如果掌握了本例就掌握了形变动画的制作方法。
技术要点:使用直线工具,椭圆工具和颜料桶工具绘制手形,圆形、方形;自由变形工具的功能和形变动画制作的方法
教学步骤:
一、形状渐变动画原理
形状渐变是动画制作的常用手法,它只能应用于打散的图形。其计算方法是在相近的特征处平滑变换。作者可以充分发挥想象力,创作出构思巧妙的动画作品。
原理:Flash自动变形技术可以将一种形状自动变形为另一种形状.制作者只需要指定起始的图形和结束的图形,中间的过渡部分就可由Flash自动完成.
二、自由变形工具(Free Transform Tool)
自由变形工具用来对选中的对象进行各种变形,包括缩放、旋转、歪斜及扭曲,等等。该工具有5种变形模式,分别是:自由变形模式、 旋转和歪斜变形模式、缩放变形模式、扭曲模式和环绕变形模式。
三、操作步骤:
1. 新建一个Flash文件,
2. 选中第1帧,然后选择铅笔工具 ,在舞台中央绘制一手形轮廓,填充颜色为橘黄色,并将其打散。
3. 选中第10帧,插入关键帧,然后选择椭圆工具,在舞台中央绘制一圆,填充颜色为橘黄色。
4. 选中第20帧,插入关键帧,然后选择正方形工具,在舞台中央绘制一正方形,填充颜色为橘黄色。
5. 选中第30帧,插入帧,使得方形在屏幕上停顿几秒钟。
6. 选中第1帧,在属性面板中设置如下:Tween----Shape(设置形状渐变动画)
7. 依次在第10、20帧处设置运动属性为:shape(形状渐变动画)
8. 按住Ctrl+Enter,预览动画。
四、练习
1. 做一个三形互变动画。
2. 练习使用自由变形工具,将图形做缩放,扭曲变形。
第2课时 颜色形状渐变动画
教学目标:
1. 掌握颜色形状渐变动画的制作
2. 了解由大变小、由小变大动画的制作方法
3. 填充调整工具的使用
教学重点与难点:
1. 颜色渐变动画的制作
2. 填充调整工具的使用
实例说明:
本例制作一个颜色不断变化的球体。颜色由绿色变为红色,在从红色变为兰色,反光部分随之移动。
技术要点:绘制基本图形,填色及使用填充调整工具调整填充效果;使用形变动画技术制作色彩变化效果
教学方法:
实例演示法
教学课时:
1课时
教学步骤:
一、填充调整工具(Fill Transform Tool)
填充调整工具可以编辑的填充方式有3种:线性渐变填充、辐射渐变填充和位图填充。下面以线性渐变填充的调整为例来说明该工具的使用方法。
1. 从工具箱中选择填充调整工具
2. 在舞台中选中要调整填充的对象,这时在该对象上将会出现控制柄,
3. 拖动中心控制柄可以调整填充中心的位置。(在flash 中为学生演示起效果)
4. 拖动旋转控制柄可以调整填充的方向
5. 拖动比例控制柄可以调整线型的填充范围。
二、操作步骤:
1. 新建flash文档
2. 选中第1帧,从工具箱中选择椭圆工具,在属性面板中选择颜色按钮,打开拾色器。按住shift 键在场景中绘制一个圆形。
3. 选择颜料桶工具,打开拾色器。选择拾色器底部第2个色块,然后将鼠标移动到圆形上方为图形填色。
4. 选择填充调整工具,单击场景中的圆形。这时在圆形周围出现调节句柄,使用鼠标移动句柄,就可以修改图形反光部分。
5. 选中第15帧,插入关键帧
6. 打开颜料桶工具的拾色器。选择拾色器底部第3个色块,然后将鼠标移动到图形上方为图形填色。使用填充调整工具修改图形反光部分。
7. 选中第1帧,在属性面板中设置运动属性为Shape,在第1帧和第15帧之间创建形变动画。
8. 在第30帧插入关键帧。打开颜料桶工具的拾色器。选择拾色器底部第4个色块,然后将鼠标移动到圆形上方为图形填色。使用填充调整工具修改图形的反光部分。在第15帧和第30帧之间创建形变动画。
9. 在第45帧插入关键帧。打开颜料桶工具的拾色器。选择拾色器底部第5个色块,然后将鼠标移动到圆形上方为图形填色。使用填充调整工具修改图形的反光部分。在第3帧和第45帧之间创建形变动画。
10. 按住Ctrl+Enter,预览动画。
三、练习
1.按教师所讲,制作动感球体动画。
小结.
教学后记:
第三节 移形幻影——移动渐变动画
一、教学目标:
知识目标:
1. 掌握FLASH动画的分类;
2、掌握渐变动画的制作方法;
3、理解关键帧在动画制作中的作用;
4、理解帧面板参数的设置对动画的影响。
能力目标
1、培养学生自主学习的能力;
2、培养学生的动手操作、综合实践的能力;
3、培养学生的创新能力。
情感目标
1.增加学生对课程的专业情感,为后面的技能学习作铺垫
2.在技能实践中,增强同学间的互助意识,培养合作精神
二、教学重点与难点:
1、渐变动画的制作思想;
2、根据动画效果设置帧面板参数;
三、教学方法:
演示比较法、自主探究法、作品点评法
四、教学手段与教学媒体
多媒体网络教室。
五、教学课时:
1课时
六、教学过程:
一、复习旧知
1、点评上次课的作业
(1)以网页方式显示全班同学的FLASH作业及成绩
(2)表扬作品合符要求或具有创意的同学;
(3)指出并纠正学生作品普遍存在的不足。
利用ASP技术制作的“作品评分系统”,让学生了解自己及其他同学的作业情况,通过对比,互相学习、互相促进。
2、复习上次课的主要内容:
(1)帧、关键帧的概念
(2)打字效果的实现思路
上一节课,我们制作的打字效果动画,使用了传统的动画制作方式,每个关键帧放置不同的内容(即,每个关键帧中,增加一个文字),形成了一个关键帧序列,按一定的时间顺序播放,形成了动画。这种动画制作方法称为逐帧法,所制作出的动画称为帧并帧动画。如图(2)、图(3)所示:
从“帧并帧动画”的不足,引入“渐变动画”
二、引入渐变动画
帧并帧动画的优点是变化复杂,可以制作出任何效果,但制作过程比较繁琐,生成的动画比较大,并没有体现Flash的的真正实力,Flash之所以博得众人青睐,在于Flash的特色------渐变动画。(由此引出FLASH动画的两种类型:帧并帧动画与渐变动画)
1、FLASH动画分类:帧并帧动画;渐变动画(移动渐变动画、形状渐变动画)
2、渐变动画欣赏
运用渐变动画轻易就能制作出具有移动、缩放、旋转、形状渐变、色彩渐变效果的动画,还能控制动画行进的速度,看是要变慢或变快,都随您的意思。
下面,请大家欣赏运用移动渐变方法制作出来的动画。
三、移动渐变动画的制作方法
1、渐变动画所形成的时间轴
渐变动画是采用了一种独特的过渡变形技术,在动画制作时只需要做出第一帧与最后一帧的内容,中间帧的动画过程flash会自动为您完成渐变动画有移动渐变和形状渐变两种类型,各自有不同的动画效果以及作用的对象。本节课,我们来学习移动渐变动画。
2、制作移动渐变动画的三个必要条件
(1)至少存在两个关键帧;
(2)在关键帧中包含必要的实体、组合体、文字等;
(3)设定移动渐变的动画过渡。
3、教师示范(以文字对象为例)
提示:文字对象由一个方框包围,是一个组合体。
具体步骤:
(1)设置背景:新建一个FLASH文件,设置“影片属性”:背景:深蓝色;高度:400 px   宽度:200 px
(2)编辑第一个关键帧:选择“文字”工具,在场景的第一帧输入文字“冬”,并把文字拖到场景顶部;
(3)编辑最后一个关键帧:右击时间轴的第20帧,插入关键帧,并把文字“冬”拖到场景的底部;
(4)设置移动渐变过渡:
①在时间轴的第1到19帧任意位置右击鼠标,选择弹出菜单“面板”/“帧”;
②“帧”面板选择“运动”过渡;
③“帧”面板中,设置“加减速”和“旋转”属性:加减速:-100 旋转:顺时针2次
借助“洋葱皮”工具,让学生了解文字运动的轨迹。
演示一些制作精良、效果眩目的渐变动画,从而激发学生的学习兴趣。
通过时间轴,可以明显看出”帧并帧动画”与”渐变动画”的区别,从而使学生对两者的区别有感性认识。
教师以文字对象作示例,而让学生以图形对象做练习,目的是让学生加深记忆:文字对象是组合体,而纸飞机是散状的图形,必须组合才能成功生成动画。
以“洋葱皮工具”强调中间过程会自动生成,不必像“帧并帧动画”那样---每个状态都设立一个关键帧,“渐变动画”简化了制作步骤。
4、学生模仿练习
要求:一架纸飞机从左上角向右下角俯冲
5、教师纠错并示范:
◇错误:有些同学没有把纸飞机组合,因此生成动画失败,帧格以虚线显示,所形成的动画无法实现;
◇解决方法:把纸飞机"编组",形成组合体。
四、实例演练
1、出示任务:一朵飘零的雪花
2、分析任务:
(1)在第一个关键帧制作雪花,并转换成组件;
(2)编辑最后一个关键帧,设置雪花的透明度,并缩小;
小结.
教学后记:
第四节 多姿多彩——多图层动画
一、教学目标:
知识目标:
1、运动动画的初步掌握
2、层概念的理解以及重命名
能力目标
培养学生的动手操作、综合实践的能力;
情感目标
增加学生对课程的专业情感,为后面的技能学习作铺垫
二、教学重点与难点:
多层动画的理解
三、教学方法:
演示比较法、自主探究法、作品点评法
四、教学手段与教学媒体
多媒体网络教室。
五、教学课时:
1课时
六、教学过程:
导入:
一、运动动画
运动动画就是Motion动画,它是一种常见的动画形式。制作运动动画的要点是如何控制物体沿路径作不规则运动。
引导层(Motion Guide)可以在引导层中绘制一条任意形状的路径,然后把其它层链向引导层,使该层中的物体沿引导层中所绘制的路径运动。当然也可以将多个层链向同一个引导层,使多个对象沿同一路径运动。
二、1.层的概念
层可以看成是叠放在一起的透明胶片,如果层上没有任何东西的话,就可以透过它直接看到下一层。所以我们可以根据需要,在不同层上编辑不同的动画而互不影响,并在放映时得到合成的效果。使用图层并不会增加动画文件的大小,相反它可以更好地帮助我们安排和组织图形。
层的属性
隐藏和显示层:当层处于显示状态时,该层名称右边位于图标的那列显示为小黑点;当层处于隐藏状态时,则相应位置显示为。单击处于显示状态的层中的图标那列的小黑点,小黑点将会变为,层中的内容就隐藏起来。相反,单击层中的,相应的位置将会出现小黑点,层中的内容将会显示出来。
锁定和解锁层:当层处于解锁状态时,该层名称的右边位于图标的那列显示为小黑点,这时该层的内容可以被编辑。单击该小黑点,这时小黑点变成,层被锁定,该层中的内容无法进行编辑。在单击图标,即可将该层解锁。
3.层的重命名:
双击层的名称,这时层的名称变为可编辑的文本框,在文本框中输入层的名称,然后按Enter键即可。
三、操作步骤:
新建Flash文档,单击舞台,在属性面板中设置背景颜色为:黑色。帧速率为:6。
2、修改第1层的名字为:地球;选中第1帧,单击椭圆工具,在拾色器中选择第1个颜色,在舞台中画入一个圆;选中该圆,按住组合键CTRL+G(组合功能),将圆组合为一个整体,用兰色矩形选中。
3. 在第10、15、20、30、40帧处插入关键帧。并在第1—10、10—15、15—20、20—30、30—40之间创建运动动画。方法:单击第1帧,在属性面板中设置Tween—Motion。
4. 单击菜单栏上的Insert---Motion Guide,创建引导层。
5. 锁住地球层,选中引导层,单击工具箱中的铅笔工具,将颜色设置为黑色,然后在舞台中央绘制一个椭圆。
锁住引导层,解锁地球层;选中地球层,分别将第1、10、15、20、30、40帧处的地球放置在椭圆的不同的位置处,使得椭圆和引导线相交。
单击引导层,单击菜单栏上的Insert——layer,插入新的一层:layer3,并将layer3重命名为太阳。
锁住引导层和地球层;选中太阳层,在第1帧处,单击椭圆工具,边框颜色为兰色,绘制一个椭圆,并将其填充删除;然后移动到与引导层中椭圆相重合的位置。最后在轨道的中间利用椭圆工具绘制一个太阳,太阳的填充颜色为拾色器中的第二个颜色。
在第10、15、20、30、40帧处插入关键帧。并在每一帧中调整太阳的填充位置(目
的:使得太阳随着阴影的变换形成动的感觉,类似动感球体的制作)。并在第1—10、10—15、15—20、20—30、30—40之间创建形状渐变动画。
锁住引导层、地球层和太阳层;单击菜单栏上的Insert——layer,插入新的一层:layer4,并将layer4重命名为星星。
在星星层中的第1帧,单击工具箱中的刷子工具,刷子样式选择最小,颜色为:黄色;然后在舞台中绘制一个十字;
选中该十字,将鼠标放在选中的十字上,按住左键同时按住Ctrl键,移动鼠标到不同的位置,复制出一个星星。依法在舞台中复制多个星星。
在第20、40帧处插入关键帧;并在第1—20,20—40之间建立形状渐变动画。
选中第20帧,选中全部星星,设置填充颜色为白色。不规则的选中星星,按住小键盘上的箭头键作微小移动。美丽星空图到此完成。
按住Ctrl+Enter,预览动画。
图层的基本操作
图层是什么,它在Flash中起到什么作用?这是初学者迷惑的问题。形象地说,图层可以看成是叠放在一起的透明胶片,如果层上没有任何东西的话,你就可以透过它直接看到下面的层。所以我们可以根据需要,在不同的层上编辑不同的动画而互相不影响,并在放映时得到合成的效果。使用图层不会增加动画文件的大小,相反它可以更好地帮助我们安排和组织图形,文字和动画。图层的概念是Flash中最基本而且重要的内容,因而需要很好的掌握。
1.新增图层
添加图层的方法是执行【插入】/【时间轴】/【图层】菜单命令,或者在【时间轴】面板上,点击插入图层按钮 ,这样就会在事先选定的图层上方出现新建的图层。
2.图层重命名
图层重命名的方法很简单,只要在你想要命名的图层名称上双击两下鼠标左键,就可以更改这个图层的名字了,不难吧?
3.选取图层
图层的选取,只要你将鼠标放到你所需要的图层上,轻轻点击一下鼠标左键就可以了。
4.删除图层
当遇到你不需要的图层时,你可以在【时间轴】面板上,点击删除图层按钮 ,这样就会将事先选定的图层丢掉了。
5.隐藏图层
在有些时候我们需要临时隐藏某些图层上的效果,如果这样的话,你可以将该层右边的眼睛图标 关掉,那样你就看不到它了。
6.锁定图层
这个功能一般在图层文件比较繁多的情况下使用,它可以防止我们在修改过程中不小心破坏其它图层效果的意外发生。
我们在图层的右边找到锁定图层按钮 ,点选它就可以锁定图层了。
7.图层文件夹
图层文件夹主要的作用是用来管理和归类图层用的,合理的利用它可以让你在有限的空间里管理大量的图层,它的作用和磁盘上的文件夹的作用一
我们在【时间轴】面板上,点击 图标,这样就会在时间轴面板上增加图层文件夹了,然后你可以将图层文件拖入到文件夹中。
图层是Flash动画制作中不可缺少的一个环节,图层的管理尤显得非常重要,如果你能养成良好的图层管理和使用的习惯,那将是你迈进Flash大门的关键一步。
四、小结:
教学后记:
第三章 FLASH特效动画
第一节 请跟我来——引导层动画
一、教学目标:
知识目标:
引导层与链接层的理解
能力目标
培养学生的动手操作、综合实践的能力;
情感目标
通过实践操作和评价作品,充分激活学生探究思维和创新思维。培养学的探究精神。
二、教学重点与难点:
1、引导图层的含义和建立方法、作用。
2、运用引导图层,解决径向运动问题
三、教学方法:
演示比较法、自主探究法、作品点评法
四、教学手段与教学媒体
多媒体网络教室。
五、教学课时:
1课时
六、教学过程:
导入:
单纯依靠设置关键帧,有时仍然无法实现一些复杂的动画效果,有很多运动是弧线或不规则的,如月亮围绕地球旋转、鱼儿在大海里遨游等,在Flash中能不能做出这种效果呢?
答案是肯定的,这就是“引导路径动画”。
将一个或多个层链接到一个运动引导层,使一个或多个对象沿同一条路径运动的动画形式被称为“引导路径动画”。这种动画可以使一个或多个元件完成曲线或不规则运动。
1.创建引导路径动画的方法
(1)创建引导层和被引导层
一个最基本“引导路径动画”由二个图层组成,上面一层是“引导层”,它的图层图标为 ,下面一层是“被引导层”,图标 同普通图层一样。
在普通图层上点击时间轴面板的“添加引导层”按钮 ,该层的上面就会添加一个引导层 ,同时该普通层缩进成为“被引导层”,如图3-6-1所示。
(2)引导层和被引导层中的对象
引导层是用来指示元件运行路径的,所以“引导层”中的内容可以是用钢笔、铅笔、线条、椭圆工具、矩形工具或画笔工具等绘制出的线段。
而“被引导层”中的对象是跟着引导线走的,可以使用影片剪辑、图形元件、按钮、文字等,但不能应用形状。
由于引导线是一种运动轨迹,不难想象,“被引导”层中最常用的动画形式是动作补间动画,当播放动画时,一个或数个元件将沿着运动路径移动。
(3)向被引导层中添加元件
“引导动画”最基本的操作就是使一个运动动画“附着”在“引导线”上。所以操作时特别得注意“引导线”的两端,被引导的对象起始、终点的2个“中心点”一定要对准“引导线”的2个端头,如图3-6-2所示。
我们特地把“元件”的透明度设为50%,使你可以透过元件看到下面的引导线,“元件”中心的十字星正好对着线段的端头,这一点非常重要,是引导线动画顺利运行的前提。
2.应用引导路径动画的技巧
(1)“被引导层”中的对象在被引导运动时,还可作更细致的设置,比如运动方向,把【属性】面板上的【路径调整】前打上勾,对象的基线就会调整到运动路径。而如果在【对齐】前打勾,元件的注册点就会与运动路径对齐,
(2)引导层中的内容在播放时是看不见的,利用这一特点,可以单独定义一个不含“被引导层”的“引导层”,该引导层中可以放置一些文字说明、元件位置参考等,此时,引导层的图标为 。
(3)在做引导路径动画时,按下工具栏上的【对齐对象】功能按钮 ,可以使“对象附着于引导线”的操作更容易成功。
(4)过于陡峭的引导线可能使引导动画失败,而平滑圆润的线段有利于引导动画成功制作。
(5)被引导对象的中心对齐场景中的十字星,也有助于引导动画的成功。
(6)向被引导层中放入元件时,在动画开始和结束的关键帧上,一定要让元件的注册点对准线段的开始和结束的端点,否则无法引导,如果元件为不规则形,可以按下工具栏上的任意变形工具 ,调整注册点。
(7)如果想解除引导,可以把被引导层拖离“引导层”,或在图层区的引导层上单击右键,在弹出的菜单上选择【属性】,在对话框中选择“正常”作为图层类型. 图层【属性】面板
(8)如果想让对象作圆周运动,可以在“引导层”画个圆形线条,再用橡皮擦去一小段,使圆形线段出现2个端点,再把对象的起始、终点分别对准端点即可。
(9)引导线允许重叠,比如螺旋状引导线,但在重叠处的线段必需保持圆润,让Flash能辨认出线段走向,否则会使引导失败。
制作步骤
(1)创建影片文档
新建一个影片文档,舞台尺寸设置为450*300象素,【背景色】设置为深蓝色.
文档属性
(2)创建元件
本例中的元件较前面的实例要多一些,我们把它们分成“水泡部分”、“海底部分”、“游鱼部分”三个部分来叙述。先来创建和水泡有关的部分。
1、 创建“单个水泡”元件
执行【插入】|【新建元件】命令,新建一个图形元件,名称为“单个水泡”。先在场景中画一个无边的园,颜色任意,大小为30*30,再设置混色器面板的参数,四个调节手柄全为白色,Alpha值从左向右依次为100%、40%、10%、100%,如图3-6-21所示,用油漆筒工具 在画好的圆的中心偏左上的地方点一下,如对填充的颜色不满意,可以用填充变形工具 进行调整。
水泡(放大400倍)、填充位置及混色器面板参数
2、 创建“一个水泡及引导线”元件
执行【插入】|【新建元件】命令,新建影片剪辑,名称为“一个水泡及引导线”。点击添加引导层按钮 添加一个引导层,在此层中用铅笔工具 从场景的中心向上画一条曲线并在第60帧处加普通帧。在其下的被引导层的第一帧,拖入库中的名为“单个水泡”的元件,放在引导线的下端,在第60帧加关键帧,把“单个水泡”元件移到引导线的上端并设置Alpha值为50%,
水泡及引导线
3、 创建“成堆的水泡”元件
执行【插入】|【新建元件】命令,新建一个影片剪辑,名称为“成堆的水泡”。从库里拖入数个“一个水泡及引导线”元件,任意改变大小位置,。
成堆的水泡(放大200倍)
4 、创建“鱼及引导线”元件
执行【插入】|【新建元件】命令,新建一个影片剪辑,名称为“鱼及引导线”。此元件只有引导层和被引导层二层,点击时间轴面板上的添加引导层图标 ,新建引导层,在引导层中用铅笔工具 画一条曲线作鱼儿游动时的路径,在被引导层中执行【文件】|【导入到场景】命令,将本实例中的名为“鱼”的元件导入到场景中,在第1帧及第100帧中分别置于引导线的两端,在第一帧中建立补间运动动画,在【属性】面板上的【路径调整】、【同步】、【对齐】三项前均打勾,
鱼及引导线
下面我们来创建海底实例中“水波荡漾”效果所需的元件。
5、 创建“海底”元件
执行【插入】|【新建元件】命令,新建一个图形元件,名称为“海底”。选择第一帧,然后再执行【文件】|【导入到场景】命令,将本实例中的名为“海底.bmp”的图片导入到场景中。
6、创建“遮罩矩形”元件
执行【插入】|【新建元件】命令,新建一个图形元件,名称为“遮罩矩形”。在场景中画一个500*4的无边矩形,因为“遮罩层”中的图形在播放时不会显示,所以颜色任意。
复制并粘贴这个矩形,向下移一点位置,使其变成二个,再复制并粘贴这二个矩形,再向下移一点位置,使其变为四个,如此循环,直至创建出一个500*540的矩形,如图3-6-26所示。
遮罩矩形
7、创建“水波效果”元件
水波荡漾的效果是用遮罩动画的手法做的,看着挺漂亮,实际制作却很简单,只用三层就完成了,里面有二个小技巧,在下面的讲解过程中会着重介绍。
执行【插入】|【新建元件】命令,新建一个影片剪辑,名称为“水波效果”,。
创建“水波效果”元件
先把最下面图层作为当前编辑图层,从库里拖入名为“海底”的图形元件,在【属性】面板上设置元件的X值为0,Y值为0,在时间帧上点一下右键,在弹出菜单中选择【复制帧】,在第100帧加普通帧。
然后新建一个图层,在这层的第一帧上点一下右键,在弹出菜单中选择【粘贴帧】,就把刚才的元件粘到第二层里了,在【属性】面板上设置此元件的X值为0,Y值为1,Alpha值为80%,在第100帧加普通帧。
注意:这里是一个技巧:第二层图片与第一层图片的位置差决定水波荡漾的大小!位置差越大,水波越大,其Alpha值的大小决定水波的清晰程度,Alpha值越大,水波越清晰,反之越模糊。
是第一层和第二层中两张图片在X,Y轴的位置的不同的对比。
两张图片在场景中的位置对比
要实现水波荡漾,光有二层图片是不行的,还要用遮罩动画实现光线的明暗变化才行,这样,才能产生水的流动感。
新建一层,在第1帧上拖入库中名为“遮罩矩形”的元件,注意下面的边缘对着“海底图片”的下边缘。在第100帧上加关键帧,拖动“遮罩矩形”,使其上边缘对着“海底图片”的上边缘,在第1帧创建补间动作动画。
遮罩层中矩形元件的位置
至此,这个动画所需的基本构件已经制作完成,大功告成,接下来还必需在场景中把各个构件“组装”起来。
在主场景中一共需要5个图层,我们由下而上一层一层地叙述,请随时参考图.
(3)创建动画
1、 创建背景层
从库中把名为“水波效果”的元件拖到场景中,在第134帧加普通帧,该层命名为“背景”。
2、 创建水泡层
新建名为“水泡”的图层,在第1帧,第30帧从库里把名为“成堆的水泡”的元件拖到场景中来,数目、大小、位置任意,在第134帧加普通帧。
3、 创建游鱼层
新建名为“鱼”的图层,从库里把名为“鱼及引导线”的元件拖放到场景的左侧,数目、大小、位置任意,在第134帧加普通帧。
图片、鱼、水泡的位置
从场景中你是否发现,我们在制作过程中免不了会在场景外放置一些对象,这些“场外对象”在本地播放器中不会出现,而当你在网上发布swf文件时,由于网站(尤其各种论坛)默认的swf文件的尺寸不尽相同,有的会显示出“场外对象”,这好比一个舞台剧演出时,幕后候台演员的情况也暴露出来,非常不美观,怎么办呢?
记得在谈到“遮罩动画”时,我们曾提到过“遮罩”的另外一个作用是“用来遮罩全部场景或某个特殊区域”,那么,下面就试试用遮罩来为我们管理舞台界面!
步骤5 创建遮罩层
在场景中画一个无边矩形,大小为450*300,盖住全部场景,设此层为遮罩层,此时下面的声音层自动缩进被遮罩了,用鼠标左键分别按住下面的各层,向上略移一点点,松手,各层就会自动缩进被遮罩了,这样,在播放时,我们就只能看到场景中的情形了,场景外的元件被遮罩
教学后记:
第二节 不识庐山真面目——遮罩动画
一、教学目标:
知识目标:
1.遮罩动画的概念
2.遮罩”的应用技巧
能力目标
1、通过师生共同分析遮罩的实例,加深学生对于遮罩原理的理解;
2、让学生自主实践,使学生能够迅速掌握遮罩效果的制作方法;
3、培养学生自主学习能力、探索创新能力和综合运用知识的能力。
情感目标
1、感受运用Flash动画软件创造作品的乐趣;
2、体验信息技术蕴含的文化内涵,形成和保持对信息技术的求知欲。二、二、教学重点与难点:
遮罩”的应用技巧
三、教学方法:
演示比较法、自主探究法、作品点评法
四、教学手段与教学媒体
多媒体网络教室。
五、教学课时:
1课时
六、教学过程:
导入:
在Flash的作品中,我们常常看到很多眩目神奇的效果,而其中不少就是用最简单的“遮罩”完成的,如水波、万花筒、百页窗、放大镜、望远镜……等等。
那么,“遮罩”如何能产生这些效果呢?
在本节,我们除了给大家介绍“遮罩”的基本知识,还结合我们的实际经验介绍一些“遮罩”的应用技巧,最后,提供二个很实用的范例,以加深对“遮罩”原理的理解。
在Flash中实现“遮罩”效果有二种做法,一种是用补间动画的方法,一种是用actions指令的方法,在本节中,我们只介绍第一种做法。
1.遮罩动画的概念
(1)什么是遮罩
“遮罩”,顾名思义就是遮挡住下面的对象。
在Flash8.0中,“遮罩动画”也确实是通过“遮罩层”来达到有选择地显示位于其下方的“被遮罩层”中的内容的目地,在一个遮罩动画中,“遮罩层”只有一个,“被遮罩层”可以有任意个。
(2)遮罩有什么用
在Flash8.0动画中,“遮罩”主要有2种用途,一个作用是用在整个场景或一个特定区域,使场景外的对象或特定区域外的对象不可见,另一个作用是用来遮罩住某一元件的一部分,从而实现一些特殊的效果。
2.创建遮罩的方法
(1)创建遮罩
在Flash8.0中没有一个专门的按钮来创建遮罩层,遮罩层其实是由普通图层转化的。你只要在要某个图层上单击右键,在弹出菜单中把“遮罩”前打个勾,该图层就会生成遮罩层,“层图标”就会从普通层图标 变为遮罩层图标 ,系统会自动把遮罩层下面的一层关联为“被遮罩层”,在缩进的同时图标变为 ,如果你想关联更多层被遮罩,只要把这些层拖到被遮罩层下面就行了,如图3-5-1所示。
(2)构成遮罩和被遮罩层的元素
遮罩层中的图形对象在播放时是看不到的,遮罩层中的内容可以是按钮、影片剪辑、图形、位图、文字等,但不能使用线条,如果一定要用线条,可以将线条转化为“填充”。
被遮罩层中的对象只能透过遮罩层中的对象被看到。在被遮罩层,可以使用按钮,影片剪辑,图形,位图,文字,线条。
(3)遮罩中可以使用的动画形式
可以在遮罩层、被遮罩层中分别或同时使用形状补间动画、动作补间动画、引导线动画等动画手段,从而使遮罩动画变成一个可以施展无限想象力的创作空间。
3.应用遮罩时的技巧
1、遮罩层的基本原理是:能够透过该图层中的对象看到“被遮罩层”中的对象及其属性(包括它们的变形效果),但是遮罩层中的对象中的许多属性如渐变色、透明度、颜色和线条样式等却是被忽略的。比如,我们不能通过遮罩层的渐变色来实现被遮罩层的渐变色变化。
2、要在场景中显示遮罩效果,可以锁定遮罩层和被遮罩层。
3、可以用“AS”动作语句建立遮罩,但这种情况下只能有一个“被遮罩层”,同时,不能设置_alpha属性。
4、不能用一个遮罩层试图遮蔽另一个遮罩层。
5、遮罩可以应用在gif动画上。
6、在制作过程中,遮罩层经常挡住下层的元件,影响视线,无法编辑,可以按下遮罩层时间轴面板的显示图层轮廓按钮 ,使之变成 ,使遮罩层只显示边框形状,在种情况下,你还可以拖动边框调整遮罩图形的外形和位置。
7、 层中不能放置动态文本。
知识提要
1、 线条转化为填充
2、 建遮罩动画
3、使用变形面板
4、任意变形工具中“注册点”的应用
5、学习使用橡皮工具中的“水笼头”工具和擦除线条
(1)创建影片文档
1、设置影片文档属性
执行【文件】|【新建】命令,在弹出的面板中选择【常规】|【Flash文档】选项后,点击【确定】按钮,新建一个影片文档,在【属性】面板上设置文件大小为400*400象素,【背景色】为黑色。(在教程中,我们为了更好的显示场景中的内容,背景色设为了深蓝色),如图3-5-3所示。
文档【属性】面板
(2)创建元件
1、 创建“闪光线条”元件
执行【插入】|【新建元件】命令,新建一个图形元件,名称为“闪光线条”。选择工具栏上的直线工具 ,在场景中画一直线,在【属性】面板上作如图3设置。
闪光线条的【属性】面板参数设置
2、 创建“闪光线条组合”元件
执行【插入】|【新建元件】命令,新建一个图形元件,名称为“闪光线条组合”
创建闪光线条元件
从库中将名为“闪光线条”的元件拖入新元件编辑窗口的场景中,在X轴上的位置为-200,Y轴为20。然后单击工具栏上的任意变形工具 ,此时元件的中心会出现一个小白点,它就是对象的“注册点”,用鼠标左键按住它,拖到场景的中心处松手。
中的“1”显示的是注册点在元件的中心时的情形,“2”显示的是注册点已拖到场景中心时的情形。
移动注册点到场景的中心
 然后执行【窗口】|【设计面板】|【变形】命令,打开变形面板,选中【旋转】,角度为15度,连续按下【复制并应用变形】按钮,在场景中复制出的效果。
变形面板及复制好的元件
在时间轴的关键帧上点一下,选中全部图形,执行【修改】|【分散】命令,把线条打散,再执行【修改】|【形状】|【将线条转化为填充】命令,将线条转变为形状。
3、 创建“闪光”元件
执行【插入】|【新建元件】命令,新建一个影片剪辑,名称为“闪光”,
创建“闪光”元件
单击【确定】后进行“新元件编辑窗口”,接着把库里名为“闪光线条组合”的元件拖到场景中,对齐中心点,复制此元件,在第30帧处加关键帧,再回到第1帧中建立补间动作动画,【属性】面板上设置顺时针旋转一周。
然后新建一层,在第1帧中执行【编辑】|【粘贴到当前位置】命令,使二层中的“闪光线条组合”完全重合,再执行【修改】|【变形】|【水平翻转】命令,让复制过来的线条和第一层的线条方向相反,在场景中形成交叉的图形。
在第30帧处建立关键帧,在第1帧中建立动作补间动画,【属性】面板上设置逆时针旋转一周,最后将此层设为遮罩层,如图3-5-10所示。图中显示的是“闪光”元件的时间轴面板和各图层中的动画设置。
“闪光”元件编辑界面
4、 创建“红星”元件
执行【插入】|【新建元件】命令,新建一个图形元件,名称为“红星”。我们要在这个元件中画一个漂亮的红星,为了画好红星,我们分九步来叙述具体的画法中
红星的九步画法
第一步,按住shift键,从场景中心向上画一根黄色的线条,如图3-5-11中的“1”所示。
第二步,选择工具箱中的任意变形工具 ,在画好的线条上点一下,这里,线条的中心出现一个白色的小园点,我们叫它“注册点”。如图3-5-11中的“2”所示。
第三步,鼠标左键按住这个小白点,拖到线条的最下端,这是因为我们要让线条要以下端为中心旋转复制。如图3-5-11中“3”所示。
第四步,执行【窗口】|【设计面板】|【变形】,打开变形面板,各参数设置如图3-5-12。
按下【复制并应用变形】按钮四次,就会在场景中每隔72度复制出一根线条,五个线条的顶端构成五角星的五个顶点。如图3-5-11中的“4”所示。
变形面板
第五步,用绿色线条分别连接五根线条的顶端,五角星的模样已经出来了,如图3-5-11中“5”所示。
第六步,用白色线条分别连接五角星中心和上一步连线的中点,如图3-5-11中“6”所示。
第七步,选择工具栏上的橡皮工具 ,在工具栏下面的选项中选择“水笼头”工具 ,在多余的线段上点一下,去除线段,修整好的五角星如图3-5-11中的“7”所示。
第八步,用油漆筒工具给五角星上色,每个角的左右颜色可略有区别,增加立体感,。
第九步:再选择橡皮工具 ,点开 旁边的小三角,在“擦除线条”前打勾, 
用橡皮工具擦去红星上的线条,一颗漂亮的红星就做成了,
技巧:在Flash8.0中,还可以用更简单的方法画红星,选择工具栏上的多角星形工具,
(3)创建动画
回到主场景中,把“闪光”元件拖入第二层,新建二层,第三层中拖入“红星”元件,在场景的下方写下白色的“闪客启航电影制片厂”的文字,完成后的时间帧面板及场景
时间轴及场景
按Ctrl+Enter组合键,测试动画。此时,你欣赏着自己亲手做的“闪闪红星”动画,心中再回想一下“遮罩”在动画中的作用,是否已经感受到“罩这一功能的神奇.
教学后记:
第四章 你来我往、交互动画
第一节 一触即发——制作按钮
一、教学目标:
知识目标:
制作按钮的方法
能力目标
培养学生自主学习能力、探索创新能力和综合运用知识的能力。
情感目标
体验信息技术蕴含的文化内涵,形成和保持对信息技术的求知欲。
二、教学重点与难点:
如何制作按钮
三、教学方法:
演示比较法、自主探究法
四、教学手段与教学媒体
多媒体网络教室。
五、教学课时:
1课时
六、教学过程:
导入:
按钮元件
按钮元件是Flash的基本元件之一,它具有多种状态,并且会响应鼠标事件,执行指定的动作,是实现动画交互效果的关键对象。
从外观上,按钮可以是任何形式。比如,可能是一幅位图,也可以是矢量图;可以是矩形,也可以是多边形;可以是一根线条,也可以是一个线框;甚至还可以是看不见的“透明按钮”。
影片剪辑在按钮元件中的应用范例-放电按钮
本小节要制作一个放电的按钮,当鼠标放到按钮上,发出夺目的光芒,炫耀无比。
放电按钮
1.创建“放电”影片剪辑元件
(1)新建一个Flash8影片文档,设置舞台尺寸为200×50像素,背景颜色设置为蓝色,其他保持默认设置。
(2)新建一名为“放电”的影片剪辑元件。在这个元件的编辑场景中,选择“线条工具”,笔触颜色为“白色”,在场景中画一段约20像素折线。
3)在第3帧插入关键帧,用“任意变形工具”将场景中的折线向左拉约至60像素。
(4)单击第1帧,打开“属性”面板,创建“补间形状”。在第5帧插入帧。
(5)新建“图层2”。在第3帧插入空白关键帧。选择“椭圆工具”,无笔触颜色。打开“混色器”面板,设置填充样式为“放射状”,左色标为白色,Alpha值100%,右色标也为白色,Alpha值0%,如图4-42所示。
混色器”面板
在场景中画一个圆。打开“属性”面板,将其大小设定为(120×126)。将其拖放到折线的左端。
2.创建“放电按钮”元件
(1)新建一名为“放电按钮”的按钮元件。在这个元件编辑场景中,将“图层1”更名为“按钮”。双击“矩形工具”,在弹出的“矩形设置”对话框中设置“边角半径”为“20点”,
设置矩形的边角半径
设置“笔触颜色”为无,“填充色”任意,在场景中画一个矩形。打开“属性”面板,设置这个矩形的大小为250×45像素,坐标为(0,0)。
(2)选中矩形,打开“混色器”面板,填充类型为“线性”,增加一个色标,自左向右三个色标颜色值为“#000000、#AFB5FA、#333333”,对矩形进行填充。
3)选中矩形,单击“填充变形工具”,旋转“旋转手柄”90度,向下拉动“缩放”手柄,调整填充色如图4-46所示。
调整渐变填充
(4)在“点击”帧按F6插入关键帧。
(5)新建一名为“发光”的图层。右击“按钮”层“弹起”帧,在弹出的快捷菜单中选“复制帧”命令;右击“发光”图层“弹起”帧,在弹出的快捷菜单中选“粘贴帧”命令。选中“发光”层的矩形,打开“混色器”面板,设置如图4-47所示。自左向右色标颜色值为“#FFFFFF、#B7C7FF、#858ABF”。
发光填充色设置
在“指针经过”帧按F6插入关键帧,选中矩形,选择“填充变形工具”,向右稍稍拖动“缩放”手柄。在“点击”帧按F7插入空白关键帧。
(6)新建一名为“白光”的图层。在该图层“弹起”帧,选用“椭圆工具”绘制一个无笔触颜色的圆。选中圆,打开“混色器”面板,设置如图4-48所示,自左向右色标颜色值为“#000000、#AFB5FA、#333333”。打开“属性”面板,设置圆的大小为60×60像素,坐标为(-87,-7)。在“点击”帧按F7插入空白关键帧。
白光填充色设置
(7)新建一名为“圆球”的图层。在该图层“弹起”帧,选用“椭圆工具”绘制一个无笔触颜色的圆。选中圆,打开“混色器”面板,设置如图4-49所示。自左向右色标颜色值为“#DDDFFC、#ABB2FA、#424366”。打开“属性”面板,设置圆的大小为50×50像素,坐标为(-81,-2)。在“点击”帧按F7插入空白关键帧。
圆球填充色设置
(8)新建一名为“动画”的图层。在“指针经过”、“点击”帧按F7插入空白关键帧。选择“指针经过”帧,打开“库”面板,将库中的“放电”元件拖入场景。打开“属性”面板,设置其坐标为(-19,11)。
(9)新建一名为“文字”的图层,在“弹起”帧输入文字“Button”。打开“属性”面板,设置字体为“Arial Black”,字母间距“12”,字体大小“24”,文本颜色“#000000”;在“指针经过”帧插入关键帧,改变字体颜色“#444444”;在“按下”帧插入关键帧,改变字体颜色“#808080”;在“点击”帧插入空白关键帧。
至此,按钮元件制作完毕,其时间轴图层结构。
图层结构
转回“场景1”,将“放电按钮”元件从库中拖入主场景中央,即完成本节范例。
本小节制作按钮,主要是在按钮某个帧上添加动画效果(影片剪辑元件),从而组合成一款炫丽的动态按钮。
教学后记:
第二节 跟着感觉走——简单Action
一、教学目标:
知识目标:
掌握简单Action命令的基本操作方法
能力目标
培养学生的探究能力和钻研精神。
情感目标
让学生通过成功的作品,更多地体验成就感,进一步激发他们的创造欲望。
二、教学重点与难点:
1、简单Action命令的基本操作方法
2、学生在教师的组织、帮助和指导下自主探究及利用教学网络进行交流。
三、教学方法:
演示比较法、自主探究法
四、教学手段与教学媒体
多媒体网络教室。
五、教学课时:
1课时
教学过程:
导入:
1.停止命令stop
  格式: stop()
  功能: 停止正在播放的动画。此命令没有参数。
2.播放命令play
  格式: play()
  功能: 当动画被停止播放之后,使用 play 命令使动画继续播放。此命令没有参数。
3.停止播放声音命令stopAllSounds
  格式: stopAllSounds()
  功能: 在不停止播放头的情况下停止SWF文件中当前正在播放的所有声音。此命令没有参数
4.跳转播放命令gotoAndPlay 
  格式: gotoAndPlay([scene,] frame)
  参数: scene (场景),可选字符串,指定播放头要转到的场景的名称;如果无此参数,则为当前场景。      frame(帧) 表示将播放头转到的帧编号的数字,或者表示将播放头转到指定的帧标签。返回
  功能:将播放头转到场景中指定的帧并从该帧开始播放。如果未指定场景,则播放头将转到当前场景中的指定帧。
用于在Flash动画作品中创建链接,使得在动画播放时,通过动画中的按钮等控件打开互联网目标的URL地址中的Web站点、网页或Email地址。
  格式: getURL(url [, window [, "variables"]])
  参数: url(地址):链接文档的网络地址,可以是绝对地址,也可以是相对地址。
     window(窗口): 可选参数,指定文档应加载到其中的窗口或 HTML 框架。可输入特定窗口的名称,或从保留目标名称中选择。
     · _self 指定当前窗口中的当前框架。
     · _blank 指定一个新窗口。
     ·_parent 指定当前框架的父级。
     ·_top 指定当前窗口中的顶级框架。
    variables(变量): 如果没有变量,则省略此参数。
功能:建立超级链接, 将指定URL文档加载到窗口中。若要测试此动作,应确保要加载的文件位于指定的位置。若要使用绝对URL(例如,http://www.),则需要网络连接。
案例:制作漫天飞舞的雪景——了解Flash 8.0制作交互式动画的基本流程
本节用Flash 来制作一个Flash交互式动画,使读者对制作交互式动画的基本流程有一个整体的了解,有利于以后的学习。
【任务】: 漫天飞舞的雪景动画是:在雪屋与雪人的雪天背景下,雪花漫天飞舞的画面。其静态图如图6.1所示。
【目标】:学习Flash的ActionScript编程技术,掌握制作交互式动画的一些基本技巧。
【技术要点】:
1、动作面板的使用。
2、ActionScript编程语言的功能
3、事件与动作。
4、交互式动画的制作的基本技巧。
教学后记:
第三节 绘声绘色——声音的操作
一、教学目标:
知识目标:
1、将声音导入Flash
2、几种声音压缩模式
3、声音效果设置
能力目标
培养学生的探究能力和钻研精神。
情感目标
体会创作的乐趣,进一步培养制作动画的兴趣
二、教学重点与难点:
1声音效果设置
三、教学方法:
演示比较法、自主探究法
四、教学手段与教学媒体
多媒体网络教室。
五、教学课时:
2课时
六、教学过程:
导入:
Flash提供了许多使用声音的方式。可以使声音独立于时间轴连续播放,或使动画与一个声音同步播放。还可以向按钮添加声音,使按钮具有更强的感染力。另外,通过设置淡入淡出效果还可以使声音更加优美。由此可见,Flash对声音的支持已经由先前的实用,转到了现在的既实用又求美的阶段。
1. 将声音导入Flash
只有将外部的声音文件导入到Flash中以后,才能在Flash作品中加入声音效果。能直接导入Flash的声音文件,主要有WAV和MP3两种格式。另外,如果系统上安装了QuickTime 4或更高的版本,就可以导入AIFF格式和只有声音而无画面的QuickTime影片格式。
下面介绍如何将声音导入Flash动画中。
(1)新建一个Flash影片文档或者打开一个已有的Flash影片文档。
(2)执行【文件】|【导入】|【导入到库】命令,弹出【导入到库】对话框,在该对话框中,选择要导入的声音文件,单击【打开】按钮,将声音导入.
【导入到库】对话框
(3)等声音导入后,就可以在【库】面板中看到刚导入的声音文件,今后可以像使用元件一样使用声音对象了,如图5-9所示。
【库】面板中的声音文件
2. 引用声音
将声音从外部导入Flash中以后,时间轴并没有发生任何变化。必须引用声音文件,声音对象才能出现在时间轴上,才能进一步应用声音。
接着上一小节继续操作。
(1)将“图层1”重新命名为“声音”,选择第1帧,然后将【库】面板中的声音对象拖放到场景中,如图5-10所示。
图5-10 将声音引用到时间轴上
(2)这时会发现“声音”图层第1帧出现一条短线,这其实就是声音对象的波形起始,任意选择后面的某一帧,比如第30帧,按下F5键,就可以看到声音对象的波形,如图5-11所示。这说明已经将声音引用到“声音”图层了。这时按一下键盘上的回车键,可以听到声音了,如果想听到效果更为完整的声音,可以按下快捷键Ctrl+Enter。
图层上的声音
3. 声音属性设置和编辑
选择“声音”图层的第1帧,打开【属性】面板,可以发现,【属性】面板中有很多设置和编辑声音对象的参数,如图5-12所示。
图5-12 声音的【属性】面板
面板中各参数的意义如下。
【声音】选项:从中可以选择要引用的声音对象,这也是另一个引用库中声音的方法。
【效果】选项:从中可以选择一些内置的声音效果,比如让声音的淡入、淡出等效果。
【编辑】按钮:单击这个按钮可以进入到声音的编辑对话框中,对声音进行进一步的编辑。
【同步】:这里可以选择声音和动画同步的类型,默认的类型是【事件】类型。另外,还可以设置声音重复播放的次数。
引用到时间轴上的声音,往往还需要在声音的【属性】面板中对它进行适当的属性设置,才能更好地发挥声音的效果。下面详细介绍有关声音属性设置以及对声音进一步编辑的方法。
1.【效果】选项
在时间轴上,选择包含声音文件的第一个帧,在声音【属性】面板中,打开【效果】菜单,可以用该菜单设置声音的效果,如图5-13所示。
声音效果设置
以下是对各种声音效果的解释。
1、【无】:不对声音文件应用效果,选择此选项将删除以前应用过的效果。
2、【左声道】/【右声道】:只在左或右声道中播放声音。
3、【从左到右淡出】/【从右到左淡出】:会将声音从一个声道切换到另一个声道。
4、【淡入】:会在声音的持续时间内逐渐增加其幅度。
5、【淡出】:会在声音的持续时间内逐渐减小其幅度。
6、【自定义】:可以使用“编辑封套”创建声音的淡入和淡出点。
2.【同步】属性
打开【同步】菜单,这里可以设置【事件】、【开始】、【停止】和【数据流】四个同步选项,
【事件】选项会将声音和一个事件的发生过程同步起来。事件与声音在它的起始关键帧开始显示时播放,并独立于时间轴播放完整的声音,即使SWF文件停止执行,声音也会继续播放。当播放发布的SWF文件时,事件与声音混合在一起。
【开始】与【事件】选项的功能相近,但如果声音正在播放,使用【开始】选项则不会播放新的声音实例。
【停止】选项将使指定的声音静音。
【数据流】选项将强制动画和音频流同步。与事件声音不同,音频流随着 SWF文件的停止而停止。而且,音频流的播放时间绝对不会比帧的播放时间长。当发布SWF 文件时,音频流混合在一起。
通过【同步】弹出菜单还可以设置【同步】选项中的【重复】和【循环】属性。为【重复】输入一个值,以指定声音应循环的次数,或者选择【循环】以连续重复播放声音.
设置重复或者循环属性
3.【编辑】按钮
单击该按钮可以利用Flash中的声音编辑控件编辑声音。虽然Flash处理声音的能力有限,无法与专业的声音处理软件相比,但是在Flash内部还是可以对声音做一些简单的编辑,实现一些常见的功能,比如控制声音的播放音量、改变声音开始播放和停止播放的位置等。
编辑声音文件的具体操作如下。
(1)在帧中添加声音,或选择一个已添加了声音的帧,然后打开【属性】面板,单击右边的【编辑】按钮,如图5-16所示。
图5-16 单击【编辑】按钮
(2)弹出【编辑封套】对话框,如图5-17所示。
图5-17 【编辑封套】对话框
【编辑封套】对话框分为上下两部分,上面的是左声道编辑窗口,下面的是右声道编辑窗口,在其中可以执行以下操作:
要改变声音的起始和终止位置,可拖动【编辑封套】中的“声音起点控制轴”和“声音终点控制轴”,如图5-18所示为调整声音的起始位置。
第二课时
编辑声音的起始位置
1、 对话框中,白色的小方框成为节点,用鼠标上下拖动它们,改变音量指示线垂直位置,这样,可以调整音量的大小,音量指示线位置越高,声音越大,用鼠标单击编辑区,在单击处会增加节点,用鼠标拖动节点到编辑区的外边,
2、 击【放大】 或【缩小】按钮 ,可以改变窗口中显示声音的范围。
3、 在秒和帧之间切换时间单位,请单击【秒】 和【帧】 按钮。
4、单击【播放】按钮 ,可以试听编辑后的声音。
4. 给按钮加上声效
Flash动画最大的一个特点是交互性,交互按钮是Flash中重要的元素,如果给按钮加上合适的声效,一定能让作品增色不少。给按钮加上声效的步骤如下:
(1)按照前面讲解的方法导入一个合适的声音文件,这里不在详述。
(2)打开【库】面板,用鼠标双击需要加上声效的按钮元件,这样就进入到这个按钮元件的编辑场景中,下面要将导入的声音加入到这个元件中。
(3)新插入一个图层,重新命名为“声效”。选择这个图层的第2帧,按F7键插入一个空白关键帧,然后将【库】面板中的“按钮声效”声音拖放到场景中,这样,【声效】图层从第2帧开始出现了声音的声波线,如图5。
给按钮添加声音(4)打开【属性】面板,将【同步】选项设置为【事件】,并且重复1次。再测试一下动画吧,当鼠标移动到按钮上时,声效就出现了。
这里必须将【同步】选项设置为【事件】,如果还是【数据流】同步类型,那么声效将听不到。给按钮加声效时一定要使用【事件】同步类型。
5. 压缩声音
Flash动画在网络上流行的一个重要原因就是因为它的体积小,这是因为当我们输出动画时,Flash会采用很好的方法对输出文件进行压缩,包括对文件中的声音的压缩。但是,如果对压缩比例要求得很高,那么就应该直接在【库】面板中对导入的声音进行压缩了。
在【库】面板中直接将声音“减肥”的具体操作方法如下:
(1)双击【库】面板中的声音图标 ,打开【声音属性】对话框,如图5-20所示。
【声音属性】对话框
在这个【声音属性】对话框中,我们就可以对声音进行“压缩”了,在“压缩”下拉菜单中有【默认】、【ADPCM】、【MP3】、【原始】和【语音】压缩模式,如图5-21所示。
几种声音压缩模式
在这里,我们重点介绍【MP3】压缩选项,因为这个选项最为常用而且对其他的设置也极具代表性,通过对它的学习可以达到举一反三,掌握其他压缩选项的设置。
(2)进行MP3压缩设置。如果要导出一个以 MP3 格式导入的文件,可以使用与导入时相同的设置来导出文件,在【声音属性】对话框中,从【压缩】菜单中选择【MP3】,选择【使用导入的MP3品质】复选框。
大家切记这是一个默认的设置,如果不在【库】里对声音进行处理的话,声音将以这个设置导出。
如果不想使用与导入时相同的设置来导出文件,那么可以在【压缩】下拉菜单中选择【MP3】后,只要取消对【使用导入的MP3品质】复选框的选择,就可以重新设置MP3压缩设置了,如图5-22所示。
使用 MP3 压缩功能
(3)设置比特率。【比特率】这个选项,确定导出的声音文件中每秒播放的位数。Flash支持8 Kbps到160 Kbps(恒定比特率)的比特率,如图5-23所示。
设置【比特率】
(4)设置【预处理】选项。选择【将立体声转换为单声道】复选框,表示将混合立体声转换为单声(非立体声)。这里需要注意的是,【预处理】选项只有在选择的比特率为20 Kbps 或更高时才可用。
(5)设置【品质】选项。选择一个【品质】选项,以确定压缩速度和声音品质:
1、【快速】:压缩速度较快,但声音品质较低。
2、【中】:压缩速度较慢,但声音品质较高。
3、【最佳】:压缩速度最慢,但声音品质最高。
(6)进行压缩测试。在【声音属性】对话框里,单击【测试】按钮,播放声音一次。如果要在结束播放之前停止测试,请单击【停止】按钮。
如果感觉已经获得了理想的声音品质,就可以单击【确定】按钮了。
除了采样比特率和压缩外,还可以使用下面几种方法在文档中有效地使用声音并减小文件的大小:
1、 置切入和切出点,避免静音区域保存在Flash文件中,从而减小声音文件的大小。
2、 过在不同的关键帧上应用不同的声音效果(例如音量封套,循环播放和切入/切出点),从同一声音中获得更多的变化。只使用一个声音文件就可以得到许多声音效果。
3、 环播放短声音,作为背景音乐。
教学后记:
第四节 教你做游戏
一、教学目标:
知识目标:
用FLASH制作拼图
能力目标
培养学生的创新能力。
情感目标
体会创作的乐趣,进一步培养制作动画的兴趣
二、教学重点与难点:
熟练使用FLASH制作拼图
三、教学方法:
演示比较法、自主探究法
四、教学手段与教学媒体
多媒体网络教室。
五、教学课时:
1课时
六、教学过程:
导入:
是否想过用flash制作一个拼图游戏?如果想的话就跟我做一个吧,一切完成后你就会发现原来是如此简单!
1、准备一张喜欢的图片,我用的图片大小设定为宽400像素点、高300像素点。
2、打开flash,新建一个文件,按默认值,当然背景颜色可以选自己喜欢的,这里采用白色。
3、由于是拼图游戏,图像自然要一块一块的,实现这一方法有很多,比如用fireworks预先切割成很多块再导入flash,不过为了方便大家,这里还是直接用flash制作。
4、按file下的import,导入刚才准备好的那幅图像,然后选中这幅图像按ctrl+b把它转换成矢量图形。
5、用黑色箭头工具画一个方块,选中图像其中的一部分(如图1),然后按f8,在弹出的框中选择button,名字为1,后确定,这样这块图像就转换成了按钮符号,为了方便选取其他图像块,我们选中刚才那个按钮符号按delete把它删除
6、操作同以上步骤,为了节约时间,这里我只将图像分成5块。为了方便讲解,5块按钮符号分别取名为1、2、3、4、5。
7、因为刚才叫大家每转换一块图像成按钮后就删除它,因此现在场景上应什么都没有。下面按ctrl+f8,选中其中的MovieClip,名字取1,后确定,在新出现的MovieClip编辑场景,打开库文件(ctrl+L),将名字为1的按钮拖入其中,鼠标右健单击该按钮,选择properties,再选择actions标签,然后按“加号”,选择drag movie clip,然后再用鼠标左健单击上方的On (Release),在右边将Release前面的勾去掉,在press前面打勾,然后用鼠标左健单击end on,再按“加号”选择drag movie clip,在右边出现的stop drag operation前面打勾,现在设置完毕,确定。(
8、按ctrl+f8,选中其中的MovieClip,名字取2,后确定,在新出现的MovieClip编辑场景,打开库文件(ctrl+L),将名字为2的按钮拖入其中……余下的操作同上步操作,以此类推,全部完成后应该有5个MovieClip,名字分别为1、2、3、4、5。
9、在主场景中打开库文件,将5个MovieClip分别拖入场景,这下已大功告成,按ctrl+enter就可以了,当然真正的拼图应该要建立很多图块,以后大家就可以用flash制作一个cool呆的拼图游戏了!(因为以上操作针对flash4而言,在5.0中有一些不同,在此附上5.0中的actions设置图例。)
教学后记:
同课章节目录