资源描述
在Flash课件中实现导航设计的方法
我们在规划课件时,应根据课件内容的多少,利用结构化、模块化的程序设计思想来实现课件的导航,具体方法是:将课件其分解为一个主控模块和几个功能模块,再将功能模块细化为几个子功能模块。主控模块用来控制和调度各个功能模块的播放,各个功能模块具体实现相应课件内容的展示。这种化大为小、分而治之的模块化设计方法,可以使课件的制作变得更容易,导航更清晰。
本文主要从Flash课件导航结构的实现来介绍这种结构化、模块化的思路,基本方法有以下四种。
一、帧跳转法
将教学内容分解成若干模块,每个模块分别制作成一个影片剪辑元件,将每个影片剪辑分别放在一个关键帧,并在每个影片剪辑元件的第一帧用Stop()函数控制影片剪辑不自动播放。在交互按钮上使用gotoAndStop()函数来控制影片剪辑的播放,从而实现课件内容的交互控制。
假设将课件内容分为5个功能模块:复习、导入、探究、结论、应用。首先将每个功能模块分别创建一个影片剪辑元件。课件的主控模块在主场景中实现,内建三个图层,从下到上分别为“背景”、“按钮”、“功能”。在“背景” 图层的第1帧,创建图形元件,装饰课件主界面,从第2帧到第6帧添加空白关键帧。在“功能”图层的第2—6帧,分别从“库”面板中将5个课件功能模块拖放到相应的关键帧上,摆放好位置,并在该层的第1帧写入
stop();。
这样可以保证主场景不自动播放。在“按钮”图层的第1帧放置5个按钮元件,按钮名称分别为“复习、导入、探究、结论、应用”,用来控制课件各个功能模块的交互跳转。
“复习”按钮上的程序代码为:
on(release){//当单击并释放按钮时
gotoAndStop(2);//跳转并停止在第2帧
}
“导入”按钮上的程序代码为:
on(release){
gotoAndStop(3):
}
“探究”按钮上的程序代码为:
on(release){
gotoAndStop(4);
}
“结论”按钮上的程序代码为:
on(release){
gotoAndStop(5);
}
“应用”按钮上的程序代码为:
on(release){
gotoAndStop(6);
}
这种方法代码简单、图层结构清晰,适合制作只包括一级课件功能模块的导航结构。
二、attachMovie()函数法
前期准备同方法一,所不同的是“库”中的影片剪辑元件不用拖放到场景中,而是用attachMovie()函数直接调用它们。
为课件内容5个功能模块分别创建一个影片剪辑元件,元件名称分别为“复习、导入、探究、结论、应用”。
在“库”面板中,将5个功能模块影片剪辑元件分别定义该元件的链接标识符,对应名称为“复习、导入、探究、结论、应用”。这是非常重要的一个环节,因为链接标识符名称是attachMovie()函数调用影片剪辑的基本参数。
课件的主控模块在主场景中实现,内建两个图层,从下到上分别为“背景”、“按钮”。在“按钮” 图层设计导航按钮5个按钮(按钮上的文字分别是复习、导入、探究、结论、应用),分别用来控制课件各个功能模块的交互跳转。
“复习”按钮上的程序代码为:
on(reIease){ //当单击并释放按钮时
_root.attachMovie(“复习”, “fuxi”,1) //主时间轴加载链接标识符名称为“复习”的功能模块,实例名为fuxi。
fuxi._x=100;
fuxi._y=50;//设置实例的坐标,使它能处在舞台适当位置
}
修改上面代码括号里的前两项内容,定义“引入”和“探究”等四个按钮。
这种方法的优点是不用将课件功能模块放人舞台,简化了图层结构,但在制作过程中需要对程序进行更仔细的调试。
三、场景跳转法
这种方法是利用Flash的多场景技术设计的。一个Flash影片文件可以包括若干个场景,每个场景包含一个主时间轴。我们利用场景来组织课件中的各个课件模块,不同的课件模块放在不同的场景中实现。利用场景跳转函数来实现各个课件模块之间的导航。
利用“场景”面板添加场景,将场景名称定义为和课件模块相符的名称(复习、导入、探究、结论、应用),便于实现场景的跳转控制。场景跳转函数就是通过场景名称这个基本参数实现场景跳转控制的。
在课件主控模块场景中,设计一个导航菜单,包括若干按钮,与课件的功能模块相对应,单击导航菜单中的按钮可以进入相应的课件功能模块场景。同时在每个功能模块场景也设计一个返回到主控模块场景的按钮,也可以将主控模块场景中的按钮复制到每个模块场景中。这些导航控制按钮上的程序代码的一般形式是:
on(reLease){
gotoAndStop (“场景名称”,1);
}//当单击并释放按钮时,跳转到指定场景的第1帧。
这种方法的优点是代码简单,结构清晰,是一种典型的多模块程序设计思路。每个课件功能模块单独占用一个场景,当课件内容多,具有二级功能模块时,这种方法也能应付自如。
四、loadMovie()函数法
loadMovie()函数可以在一个SWF影片中加载外部的SWF影片。将课件分解为若干课件模块(包括一个主控模块和若干功能模块),把每个课件模块制作成独立的Flash影片并发布成swf文件存放在一个文件夹中,最后利用loadMovie()函数实现各个课件模块间的调用。
根据课件内容(复习、导入、探究、结论、应用),将各个课件功能模块制作成独立的Flash影片,并导出相应的SWF文件。课件主控模块也制作成独立的Flash影片,内置三个图层,从下到上分别为背景、按钮、内容,在“内容” 图层中放置一个空影片剪辑实例名称为neirong(名称自己决定),在“按钮”图层中设计一组导航按钮,按钮与课件的功能模块相对应,单击导航按钮可以载入相应的课件功能模块SWF影片,其中导航控制“复习”按钮上的程序代码的形式是:
on(release){ //当单击并释放按钮时
neirong.loadMovie(“课件内容/复习.swf”,1) ;//实例neirong影片剪辑加载文件夹“课件内容”中指定的“复习.swf文件”
neirong._x=65
neirong._y=15//加载的影片剪辑位置
neirong. _xscale=80
neirong. _yscale=80//加载的影片剪辑的缩放比例,比例的大小根据所加载的影片剪辑大小决定
}
这里,必须让主控模块SWF文件和若干功能模块文件夹都存放在相同的文件夹中。
这种方法的优点是,课件既较好地实现了模块化课件设计的思想,又使课件具备了很强的网络特性。因为这种类型的课件在播放时,并不把全部的课件模块都装载到计算机的内存中,只先装载课件的主控模块,需要时再在课件主控界面上单击控制按钮,把其他的课件模块装载运行。这种方法很适合制作网络型Flash课件。
实践证明,模块化程序设计思想运用到课件制作中,使课件制作过程科学化、系统化。本文讨论的四种方法不同程度地实现了Flash课件制作模块化的设计思路,这四种方法可以单独使用,也可以混合使用。
Flash课件通用导航界面
2009-08-18 08:04:57| 分类: flash课件制作 | 标签: |举报 |字号大中小 订阅
课件效果
这是通用导航界面的另一个实例,在这个实例当中,我们同样以按钮动作作为触发事件,即单击导航按钮后触发相应的影片剪辑运行,从而达到进入二级页面的目的。从本质上讲该实例与前面几个相同,其区别在于布局方式和制作方法上稍有差别。
画面的主体部份是4个主导航按钮,这些按钮均被定义相应的动作脚本,单击其中任意一个按钮,可弹出相应页面。弹出画面的右下方是一个名为“返回”的按钮,单击此按钮,弹出窗口自动关闭,画面返回到初始状态。
制作要点
1.图层结构分析
图1是课件完成以后的图层结构。
图1 课件的图层结构
【背景和标题】图层由“背景”、“环形球”元件和静态文本构成,【光线】图层则采用了图形的形状渐娈方式来处理,这两个图层之间是遮罩和被遮罩的关系,最后形成一束光线一闪而过,画面逐渐展开的效果。另外在【星1】、【星2】图层中我们设计制作了一颗闪亮的星球,对“光线”进行了渲染,以增加课件的整体美感,具体效果可参考配套光盘中的源文件。
【按钮】图层是本课件的主休部分,在此必然要引用到按钮元件,图2是导航按钮“课件标题1”的图层结构和参考效果。
图2 “课件标题1”的图层结构和参考效果
其它3个导航按钮的制作手法类似于按钮“课件标题1”,这里不作详述。在这4个按钮导航图层(被放在一个名字为“按钮”的层文件夹中)中,我们分别以4个主导航按钮为对象,采用了补间动画并配以合适的外部音效的方式来处理完成。
2.导航按钮元件分析
毫无疑问,4个导航按钮上均定义有动作脚本来触发相应的鼠标事件,这是本课件的关键所在,以按钮“课件标题1”为例,其动作脚本为:
on (release) {
gotoAndStop(122);
mc1._visible = 1;
}
以上动作脚本所执行的功能为:当按下该按钮并释放鼠标后,主场景时间轴线跳转到第122帧停止运行,同时,实例名为“mc1”的影片剪辑为可见状态。为什么要跳转到第122帧停止运行?为什么“mc1”影片剪辑要设置为可见?
先看看【弹出窗口】图层,在该图层的第122帧至125帧,我们分别设置了4个实例名为“mc1”、“mc2”、“mc3”、“mc4”的影片剪辑,这4个影片剪辑即为课件的弹出窗口,它们分别对应着4个主导航按钮并配合它们的按钮动作。另外在该图层的第121帧,我们定义了帧动作脚本为:stop,也就是说当影片播放到此帧后停止运行,画面已全部展开,4个主导航按钮也均已出现,此时主画面呈现静止状态并等待下一步指令。还是以“课件标题1”按钮为例,假设我们此时单击该按钮,主场景时间轴线跳转到第122帧停止,同时该帧中的影片剪辑“mc1”开始运行。“mc1”开始运行意味着“弹出窗口1”慢慢出现在画面中,这样便实现了课件的“弹出窗口”功能。图3为“mc1”影片剪辑元件的图层结构和参考效果。
图3 “mc1”影片剪辑元件的图层结构和参考效果
如上图所示,在“弹出窗口”的右下角有一个名为“返回”的按钮元件,该按钮上的动作脚本为:
on (release) {
_root.mc1._visible = 0;
}
以上动作脚本的功能是,单击该按钮并释放鼠标后,实例名为“mc1”的影片剪辑元件为不可见状态,这里的“_root”为路径。
通过以上动作脚本,从而实现了课件的“清屏”功能。单击“返回”按钮这一动作对应了前面部份的主导航按钮动作。
分析至此,相信你对定义在导航按钮上的动作脚本“mc1._visible = 1;”有了更深层次的理解。
本课件中引用的声音文件路径为:配套光盘\素材\ch2素材\声音5.mp3-声音8.mp3。
课件总结本课件的重点是主场景时间轴线和图层结构的布局方法以及各按钮元件之间的动作关联,4个弹出窗口影片剪辑元件的制作方法也值得关注。另外,本课件还引用了4段外部音效,适时地对课件的整体效果进行了渲染,起到了锦上添花的作用
展开阅读全文