flash多媒体课件制作详细.docx
《flash多媒体课件制作详细.docx》由会员分享,可在线阅读,更多相关《flash多媒体课件制作详细.docx(18页珍藏版)》请在冰豆网上搜索。
flash多媒体课件制作详细
4.2.5.3FLASH
动画制作
Flash是一个矢量图形和交互式动画的制作软件。
其强大的图形和动画功能可以
制作开发出多种适用于教学课件中使用的形象生动的动画效果;内嵌的ActionScript
语言可以在Flash动画中实现交互、数据处理以及其他多种程序功能,可以让高级开
发人员编制复杂的flash应用程序。
Flash不仅可以直接应用于交互式教学课件开发,
而且也可设计成教学积件在专业多媒体课件制作软件Authorware和Directory以及
Frangpage中被导入。
Flash的编辑对象主要是矢量图形,Flash只需用少量的矢量数据便可描述相当复杂的
对象,如此大大减少了文件的数据量,使其在网络上的传输速度大大提高,也是网络型课件
编写有用的工具。
1、Flash基础
一)Flash8.0界面介绍
Flash8.0的默认界面包括:
菜单栏、工具栏、舞台、时间轴窗口、属性面板、
颜色面板、库面板以及动作面板等,如图4-155所示。
菜单栏颜色面板
时间轴窗口
库面板
工具面板
动作面板
舞台
属性面板
图4-155Flash8.0程序界面
(1)舞台
舞台是Flash动画中各个元素的表演平台,用于显示当前选择的帧的内容。
(2)场景
就像戏剧可以有几幕一样,舞台上也可以放下几个场景。
舞台场景可以通过位于舞台右
上部的场景切换按钮切换。
通过不同的场景之间的交互性,来创作出结构较为复杂的课
件。
(3)时间轴窗口
时间轴窗口用于对Flash的两个基本元素“层”和“帧”进行操作。
最重要的成分是帧、层和播放头。
时间轴控制窗口分为左右两个区域,它们分别是和时间轴控制区与层控制区域。
(4)动作面板
动作面板可以创建和编辑对象或帧的ActionScript代码。
(5)库面板
在Flash里,素材库窗口起着存放、组织管理动画基本元素的作用。
使得更容易对这些元素进行查找、编辑和设定和重复利用。
(6)菜单栏和工具面板
除了绘图命令以外的绝大多数命令都可以在菜单栏中实现。
使用工具面板中的工
具可以绘图、上色、选择和修改插图,并可以更改舞台的视图。
二)元件与实例
元件是一种可重复使用的对象,包括图形、影片或者按钮,而实例是元件在舞台上的一次具体使用。
一个元件可以在一个程序中重复使用,重复使用实例不会增加文件的大小,这是使文档文件保持较小的策略中很好的一部分。
元件还简化了文档的编辑;当编辑元件时,该元件的所有实例都相应地更新以反映编辑。
元件的另一个好处是使用它们可以创建完善的交互性。
Flash中有三种元件,分别为影片剪辑元件(movieclip)、按钮元件(button)和图
形元件(graphic)。
在舞台选中一个对象后,选择利用“修改”菜单的“转换为元件”命令,
在弹出的对话框中选择某类元件(如图4-156所示),确定后就可以将此对象转换成选定的
元件类型。
右边注册的网格点是选定的转动轴心位置,如默认状态的注册点是中心,即该元
件转动时绕中心轴转动。
图4-156“转换为元件”对话框
三)Flash动画的基本类型
Flash可以通过时间轴特效、逐帧创建、建立补间动画以及语言编写等方式创建动画。
其
中,补间动画又分为动作补间和形状补间两种方式。
实例十九:
动态模糊文字
利用时间轴特效可以方便地为处于舞台或者影片剪辑元件中的对象创建动画效果。
在
flash8.0中的时间轴特效包括分离、展开、投影和模糊四种。
在一个时间轴上,对同一对象,只能使用一种效果。
如果要对某一对象加载多个效果,可以通过创建影片剪辑元件的办法来实现。
本实例将采用此办法对创建的文字对象加载展开和模糊两种特效。
(1)启动flash8.0,建立新文档。
使用“插入”菜单中的“新建元件⋯”命令,在弹出的对话框中选择“影片剪辑”,确定后进入元件编辑窗口。
(2)使用“工具面板”中的文本工具
,在元件编辑窗口中建立如图
4-157
所示的文
字对象。
可利用文本工具属性面板对创建的文字外观进行调整。
(3)选中建立的文字对象,单击鼠标右键,在弹出的快键菜单中选择“时间轴特效
效果—展开”命令。
如图4-158所示。
—
图4-157在元件编辑窗口建立文字对象图4-158时间轴特效命令
(4)在弹出的如图4-159所示的“展开”特效属性设置窗口中,可对该特效的属性做
简单设置。
在此,将“碎片移动”调整为25像素数,其余参数不变。
确定后退出特效设置窗口。
此时可以在时间轴上看到有多个帧被建立,使用“控制”菜单中的“播放”命令,可
以看到设置的效果。
(5)单击编辑窗口标题栏中的“场景”按钮,切换舞台。
在库面板中,把刚建立的影片剪辑元件拖入舞台中央位置。
(6)选中该元件,单击鼠标右键,在弹出的快键菜单中选择“时间轴特效—效果—模
糊”命令。
在弹出的效果设置对话框中使用默认设置,确定后退出设置窗口。
图4-159
“展开”特效设置窗口
(7)使用“控制—测试场景”命令,在弹出窗口中可以看到如图
4-160
所示的最终的
效果。
图4-160动态模糊文字效果
(8)选择“文件”菜单中的“导出—导出影片”命令,在弹出的对话框中选择保存的
目录并输入文件名,默认状态下以.swf格式输出。
确定后,弹出“导出flashplayer”对话
框,使用默认设置,确定后即可生成swf格式动画文件。
实例二十:
弹簧振子
补间动画是Flash中最为常见的动画创建方式,此类动画一般是对时间轴上相邻的两个
关键帧中的同一对象的属性做不同设置,然后由计算机自动填补中间的变化过程,这个属性
的变化过程就是动画。
Flash中可以变化的属性有位置、角度、形状、颜色、透明度等。
本实例将通过制作模拟弹簧振子的往复运动的动画,学习补间动画制作的一般过程。
(1)启动flash8.0,建立新文档。
双击图层左边的文字“图层1”,改变成文本编辑状态,将图层标签改为“弹簧”。
(2)在第一帧的场景中绘制如图4-161所示图形。
该图形可由直线工具两个线段,然后拼接成弹簧一节,再通过复制粘贴形成多节弹簧。
图4-161弹簧效果图
(3)插入两个新图层,分别命名为“背景”和“球”。
在“背景”图层中绘制两个矩
形;在“球”图层中绘制一个圆形,选中该圆形,在右边颜色面板中选择填充类型为“放射
状”,在渐变色条中第一个色标为浅色,第二个色标为深色。
然后将三组图形按图4-162所
示放置整齐。
为了能够清楚地表示弹簧振子的运动过程,可以在“背景”图层中添加位置标
志,如图4-163所示,该标志也可在新图层中添加。
图4-162三组图形拼接后的效果
图4-163添加位置标志后的效果
(4)选择“背景”图层,在60帧的位置,单击鼠标右键,在弹出的快捷菜单中选择“插入帧”。
若位置标志建立在一个新建图层中,也对该图层做相同的操作。
(5)选择“球”图层图层,在15帧的位置,单击鼠标右键,在弹出的快捷菜单中选
择“插入关键帧”。
然后选中该图层中的所有帧(可以单击图层标签),单击鼠标右键,在弹
出的快捷菜单中选择“创建补间动画”。
此时,在两个关键帧之间将会产生一个箭头,如图
4-164中的时间轴上所示。
然后“弹簧”对也做同样操作。
(6)选中“球”图层的第二个关键帧,然后在场景中选择“球”对象,将其移动到中间“平衡位置”。
(7)选中“弹簧”图层的第二个关键帧,在场景中选择“弹簧”对象,然后选择工具
面板中的“变形工具”,按住“Alt”键,然后调节右边的调节句柄,将其压缩到中间“平
衡位置”,和球相连,如图4-164所示。
图4-164步骤(4)--(7)后的效果
(8)在“球”和“弹簧”图层的第30帧位置分别插入关键帧,此时,补间的箭头将
自动产生。
利用步骤(
6)和(7)的方法,分别调节“球”和“弹簧”的位置,如图
4-165
所示。
图4-165步骤(8)后的效果
(9)在“球”和“弹簧”图层的第45帧和60帧位置再次分别插入关键帧,并利用步
骤6)和(7)的方法,分别调节“球”和“弹簧”到合适的位置。
其中45帧在平衡位置,
60帧在最右侧的位置。
此时,弹簧振子的动画效果基本完成。
(10)为了真实模拟振子的运动效果,对弹簧振子的运动速度做进一步设置,使其到
平衡位子时速度最大,两端时速度最小。
选择“球”图层的第1至第15帧,然后单击属性面板中的“编辑”按钮,弹出如图4-166所示的“自定义缓入/缓出”对话框,在11帧的位置点图中直线,在线上添加了一个调节点(该点可以用delete键删除),将此点向下拖拉到
40%的位置,确定后退出。
(11)选择“球”图层的第16至第30帧,然后单击属性面板中的“编辑”按钮,在弹出的“自定义缓入/缓出”对话框中,在19帧的位置在图中直线添加一个调节点,将此点向
上拖拉到60%的位置,确定后退出。
如图4-167所示。
图4-1661-15
帧的速度调节曲线
图4-16716-30
帧的速度调节曲线
(12)选择“球”图层的第31至第45帧,单击属性面板中的“编辑”按钮,对第41帧做如同第11帧的调节;再选择“球”图层的第46至第60帧,单击属性面板中的“编辑”按钮,对第49帧做如同第19帧的调节。
(13)用调节“球”运动速度的方法,调节“弹簧”的变化速度。
为了使球和弹簧的运动保持一致,其运动速度调节的具体参数可与“球”的完全相同。
(14)动画完成后,可用“控制”菜单中的“播放”命令观看最终的动画效果。
满意后,按上一个实例输出成动画文件。
实例二十一:
可控制的旋转文字
本实例通过一个应用程序,进一步阐明元件、实例的相关概念;并初步学习对影片剪辑元件控制播放的一般方法。
(1)启动flash后,选择“插入”菜单的“新建元件”命令,在“新建元件”对话框中
选择“影片剪辑”类型,将元件名命名为“旋转文字”,确定后进入元件编辑窗口。
(2)用文字工具在元件中心上方建立一个文字,然后选择工具面板的“任意变形”工
具,点选刚建立的文字,使文字出现调节句柄,如图
4-168
所示。
(3)选择“任意变形工具”后,被选的对象出现9个可调节点。
8个矩形点是形状调
节,中心的圆点是旋转轴点,一般位于对象中心。
现将处于文字中心的圆形旋转轴点向下拖
拉至与元件的中心十字重合,如图4-169所示。
(4)在“窗口”菜单中选择“变形”,显示“变形”面板,如图4-170所示。
(5)在“旋转”栏中输入“36”,然后单击变形窗口下方的
“复制并应用变形”按钮
,
在元件编辑窗口中将出现一个文字的旋转
36度后的副本,如图
4-171
所示。
图4-168元件窗口中建立文字图4-169文字的旋转轴点与元件中心重合
图4-170变形窗口图4-171旋转后的文字副本
(6)不改变旋转角度,连续点击“复制并应用变形”按钮,可产生多个文字副本,
如图4-172所示效果。
然后用文字工具将文字副本中的文字逐个修改成图4-173所示结果。
图4-172建立多个文字副本图4-173修改后的文字内容
(7)在时间轴的第25帧处插入关键帧,选择所有的帧,在任意一帧上单击鼠标右键,在弹出的快捷菜单中选择“创建补间动画”。
然后选择第25帧处的关键帧,在“变形”面板
的旋转角度输入栏中输入180。
如图4-174所示。
(8)在时间轴第50帧处再次插入关键帧,然后在“变形”面板的旋转角度输入栏中
输入-0.5。
注意:
在flash8.0中,对于一个对象旋转360度等于不动,因此,使用旋转-0.5
度,相当于旋转359.5度。
图4-174文字旋转180度
(9)单击“场景”,切换到“场景”编辑窗口。
然后在“库面板”中把刚建立的旋转文字元件拖拉到舞台中。
选择该元件,在“属性面板”中的影片剪辑下方的“实例名称”输入栏中输入“xzwz”,如图4-175所示。
图4-175给实例命名
(10)选择“窗口”菜单下“公用库”中的“按钮”,打开按钮库。
选择“classicbuttons”文件夹下的“playback”下的“gel”系列按钮,如图4-176所示。
将它们拖拉到舞台上,并
排列整齐,并添加上文字,如图4-177所示。
注意排列一组对象可以使用“修改”菜单下的“对齐”中的一组命令。
(11)接下来给这些按钮及第一帧上添加命令,达到程序效果。
(12)选择时间轴上的第一个关键帧,单击鼠标右键,在弹出的快捷菜单中选择“动
作”命令。
打开脚本编辑窗口,输入“xzwz.stop();”。
注意输入的文字及符号需要用英文半
角符号。
该命令的作用是在应用程序起始状态让“旋转文字”元件处于停止状态。
注意:
“实例名.方法(属性)”是对某特定影片剪辑元件或按钮元件做方法或属性设置的基本格式。
(13)选择“play”文字对应的按钮,单击鼠标右键,在弹出的快捷菜单中选择“动作”
命令。
打开脚本编辑窗口,输入“on(release){xzwz.play();}”。
注意:
给按钮元件添加命令时,需要用“on()”的形式申明按钮状态,即定义按钮在
何种状态下执行相关的命令。
括号里填的是按钮执行命令时的状态,如在本实例中定义在按
钮释放(release)时执行命令。
图4-176按钮库图4-177舞台上的按钮
(14)利用类似方法在各个按钮上添加代码如下:
replay按钮:
on(release){xzwz.gotoAndPlay
(1);}
程序说明:
从“旋转文字”元件的第一帧开始播放。
next按钮:
on(release){if(xzwz._currentframe>1){
xzwz.prevFrame();
}else{
xzwz.gotoAndStop(xzwz._totalframes);}
程序说明:
单帧播放“旋转文字”元件,每单击按钮一次,往前进一帧,到最后一帧时停止。
previous按钮:
on(release){if(xzwz._currentframexzwz.nextFrame();
}else{
xzwz.gotoAndStop
(1);}
程序说明:
单帧播放“旋转文字”元件,每单击按钮一次,往后退一帧,到第一帧时停止。
pause按钮:
on(release){xzwz.stop();}
程序说明:
单击按钮时,“旋转文字”元件停止在当前帧。
stop按钮:
on(release){xzwz.gotoAndStop
(1);}
程序说明:
单击按钮时,“旋转文字”元件停止并返回到第一帧。
实例二十二:
绘制正弦曲线
Flash具有强大的程序功能,利用程序可以做简单运算,以及编制出一些较好的动画效果。
本实例将利用flash自带的数学函数以及简单的循环语句结构来编制一个绘制函数曲线
的动画效果。
(1)启动flash后,在图层1的第一帧中输入一个公式以“振幅”和“周期”,如图4-178所示。
在“振幅”右面输入“20”,并将此文字的类型设为“输入文本”,同时在变量栏中输入“al”;“周期”右面输入“2”,文字类型也设为“输入文本”,变量栏中输入“t”。
然后
在第三帧处单击鼠标右键,在弹出的快捷菜单中选择“插入帧”。
图4-178第一帧界面
(2)插入一个新图层,在第一帧绘制如图4-178所示的一个坐标。
在按钮库中选择一
个按钮拖拉到舞台,并在按钮后面输入文字“开始画线”。
注意:
单击坐标横线,可早属性面板找到此线段的起始点坐标,即为原点坐标。
本实例中原点坐标为(50,283),此坐标值将作为绘制曲线的起点坐标。
(3)选择图层2的第二帧,插入一个关键帧,在此帧中将按钮即按钮后的文字删除。
(4)选择图层2的第三帧,插入一个关键帧,在按钮库中选择另一个按钮拖拉到舞台,并在按钮后面输入文字“返回”。
如图4-179所示。
图4-179第三帧的界面图4-180振幅为60,周期为5时的正弦曲线
(5)选择图层2的第一帧,单击鼠标右键,在弹出的快捷菜单中选择“动作”,激活语言编辑窗口。
在窗口中输入:
_root.x=0;//初始化变量;
_root.moveTo(50,283);//定位画线开始点,也就是坐标原点;
stop();//执行程序后,停止在第一帧;
(6)选择第一帧中的“开始画线”按钮,给按钮添加“动作”:
on(release){gotoAndPlay
(2);}//单击按钮后,开始执行第二帧;
(7)选择图层2的第二帧,单击鼠标右键,在弹出的快捷菜单中选择“动作”,激活
语言编辑窗口。
在窗口中输入:
a=_root.x+50;
b=283-al*Math.sin(((_root.x)/180*Math.PI)*t);
(8)选择图层2的第二帧,单击鼠标右键,在弹出的快捷菜单中选择“动作”,激活
语言编辑窗口。
在窗口中输入:
if(x==360){//定义画线的区间
stop();
}else{
_root.lineStyle(2,0xff0000,100);//指定线条的粗度为2,颜色为红色,透明度为100;
_root.lineTo(a,b);//画线至a,b所在位置;
updateAfterEvent();//强制刷新;Flash强制进行显示刷新工作。
该语句不依赖于时
间帧的触发。
x+=1;//值越小画线的精度越高,但画线的速度也越慢
gotoAndPlay
(2);}
(9)选择第三帧中的“返回”按钮,给按钮添加“动作”:
on(release){_root.clear();//清除场景中的绘制线
gotoAndPlay
(1);}单击按钮后,开始执行第一帧
(10)完成后,选择“控制”菜单的“测试场景”命令,可以看到程序结果。
振幅输
入60,周期输入5,点击“开始画线”按钮,可看到如图4-180所示结果。
实例二十三:
利用“测验”模板制作交互式练习题
利用flash的语言功能可以编制多种交互形式,但语言编写过程相对复杂。
为了能让非
专业用户能够简单地开发和利用多种交互,flash提供了一个“测验”模板。
在此模板中有6种交互方式,分别为:
拖放、填空、热物体、热区、多项选择以及是非,用户可以根据需要任意添加或删除其中的交互方式。
本实例将利用该模板的多种交互方式制作一套测试题。
(1)启动flash,选择“从模板创建”中的“测验”,弹出如图4-181所示窗口。
图4-181“测验”模板样式选择窗口
(2)选择“测验_样式2”,确定后进入“测验”模板的初始界面,如图4-182所示。
图4-182“测验”模板初始界面
(3)选择第二帧,进入“目标区域”交互的界面。
点选“拖放交互操作”,然后用“ctrl+b”
分离组合,使舞台中的组件相互独立,如图
4-183所示。
图4-183“拖放交互”界面分离后的状态
(4)“ctrl+shift+a”取消选择后,点选舞台中的“拖这个1”元件(drag1),双击该元
件,进入元件编辑窗口。
删除元件中的数字,将文字改为“fish”,如图4-184所示。
修改
完毕返回场景编辑窗口。
图4-184drag1元件编辑后效果
(5)以同样方式编辑舞台中的其它元件,如图
4-185
所示。
然后用文字工具将“您的
问题将显示在这里。
”这句话改为如图中的问题。
图4-185编辑后的“拖放交互”界面
(6)点选左边“拖放交互操作”标签,在“窗口”菜单中选择“组件检查器”命令,
打开“拖放交互”的组件检查器对话框。
在“开始”标签中,如图4-186所示进行设置。
在
“选项”标签中,将“尝试次数”改为“2”,其余保持默认值。
图4-186“拖放交互”组件检查器对话框
(7)选择第三帧,进入“填空交互”编辑界面。
点选“填空交互操作”,然后用“ctrl+b”分离组合,“ctrl+shift+a”取消选择后,点选左边“填空交互操作”标签,在“窗口”菜单
中选择“组件检查器”命令,打开“填空交互”的组件检查器对话框。
在对话框中“问题”
栏中输入问题,在“响应”栏中输入答案,并勾选对应的“正确”,如图4-187所示。
在“选
项”标签中,将“尝试次数”改为“2”,其余保持默认值。
注意:
若有多个正确答案,可在“响应”中输入多个值,并勾选相应放的“正确”。
图4-187“填空交互”组件检查器对话框
(8)选择第四帧,进入“热件(热物体)交互”编辑界面。
点选“热件交互操作”,
然后用“ctrl+b”分离组合,“ctrl+shift+a”取消选择后,点选舞台中的“热物体1”元件
(HotObject1),双击该元件,进入元件编辑窗口。
用“文件”菜单中的“导入”命令,激活“导入”对话框,从外部导入一幅图片,修改该图片到合适的大小后返回场景窗口。
用相
同的方式修改其他“热物体”元件,并修改界面中的问题,最终效果如图
4-188所示。
图4-188“热物体交互”界面
(9)点选左边“热件交互操作”标签,在“窗口”菜单中选择“组件检查器”命令,打开“热件交互”的组件检查器对话框。
“开始”标签中的内容保持不变,在“选项”标签
中,将“尝试次数”改为“2”,其余保持默认值。
(10)删除“热区交互”。
选择最上层的第五帧,按住shift键不放,选择其它层的第五
帧,这样可以选择所有层次的同一帧,然后单击鼠标右键,在快捷菜单中选择“删除帧”命
令,将这些帧删除。
如图4-189所示。
图4-189删除“