按钮控制声音的暂停与播放
- 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。
按钮控制声音的暂停与播放
我们经常在 Flash课件中加入声音,比如背景音乐、旁白等。
那么如何用一个按钮来控制声音的播放和暂停呢?
步骤 1 创建“声音”影片剪辑
执行【文件】|【导入】|【导入到库】命令,将声音文件导入到库中。
新建一个影片剪辑,命名为“声音” ,F11 打开库面板,将声音文件拖放在场景中,在时间轴上添加普通帧至音频结束。
在属性面板上设置其【同步】为【数据流】。
步骤 2 用一个按钮来控制声音的播放和暂停
回到需添加声音的主场景,从库中拖出“声音”影片剪辑,在属性面板上设置其实例名为“mc”。
执行【窗口】|【其他面板】|【公用库】|【按钮】命令,从公用库中拖出一个按钮。
放在场景中。
选中按钮,打开动作面板,输入语句:
on(press){ //按下按钮
if (bofang==1) { //如果变量播放等于1执行下面的动作
mc.play(); // 音乐 mc。
播放
bofang = 0 //赋 0 给变量 bofang
} else { //否则执行下面的动作
mc.stop(); //音乐 mc停止
bofang=1 //赋予 1 给变量 bofang
}
}
这样就可以很便捷控制声音了,反复播放暂停均可。
在Flash课件中实现导航设计的方法
(2012-01-18 10:52:18)
转载▼
分类: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课件模板制作实例教程
功能简介:
首先,要简单介绍一下flash:它是一个Macromedia公司出品的动画制作软件,带有丰富的交互功能,配以适当的Action script脚本,能做出功能丰富,画面精美的动画课件。
能让我们当教师的也来“闪”一把!
注:本文中代码后面的“//”表示接下来是代码解释文字
一、先设计出一个漂亮的界面来
打开flash MX 2004,按Ctrl+F8新建一个影片剪辑,取名叫“窗口”。
然后在主舞台中画一个窗口界面。
(如下图1,大小为550*400,怎么画?你自己想要什么样的就画什么样的吧!) 说明:界面设计不能太花了,但要有主色调。
我这里用的是淡绿色。
不建议使用晃眼的色调,因为整个课件要协调好。
太黑了使人感到郁闷,太亮了眼睛痛,适中最好。
风格看个人的喜好了,比如我喜欢窗口风格的。
也有好多人喜欢无窗口的,全由你自己爱好啦。
我这个版面上面是标题栏,右边是按钮控制区,下方是显示一些说明信息。
初步做好后,将它拖放到场景中,刚好与舞台重合。
并在“属性”栏中,实例名称中输入:window
二、界面做好后,就要来制作交互用的按钮了
一般我们需要制作3-4种按钮:
1、控制课件的屏幕大小及关闭按钮(名为close_btn、fullscree_btn、small_btn):
2、响应课件内容及相关操作的通用按钮(因为只要在上面加个名字,就能变成“播放”,“停止”,“音乐”等按钮了);
3、临时按钮:主要在课件中进行临时交互用的。
详细制作方法(不要嫌我啰嗦啊):
1、点插入--新建元件, 或按crtl+F8, 取名为“按钮”,类型选“按钮”,确定。
按钮都有四个帧“向上”(即平常状态)、“经过”(鼠标移上去的样子)、“向下”(鼠标点下去的样子)、“点击”(这里什么色无所谓,它只限定鼠标起作用的范围)。
另外还可以为这个按钮加点声音,按下时响一下。
方法是,点“文件”-“导入”一个声音来。
声音就存在于库中了,在按钮图上新建一层,在“按下”帧插入一个关键帧,将声音从库中拖入编辑窗口中即可。
(其实声音还可有好多种设置,这里不必要作过多设置,就不详说了)
2、按自己的想法,分别做好四个不同的帧,这样你的多彩的按钮就做出来了,建议多用渐变色(包括线性和径向)。
3、将做好的按钮拖放到界面中去,命名并输入文字
在库中双击“界面”元件,进入影片剪辑“界面”的编辑状态,新建一层,取名为“按钮”,从库中把做好的按钮拖入到适当的位置,摆放整齐。
分别在“属性”栏中的“实例名称”中输入:(不包括后面的汉字)
fullscreen_btn 全屏close_btn关闭play_btn播放stop_btn 暂停back_btn 返回music_btn音乐practice_btn练习score_btn计分help_btn帮助quit_btn退出。
再新建一层,取名为“按钮文字”,用文本工具在按钮的上面输入各按钮的名称(如下图):4、为各个按钮输入脚本控制语句:
新建一层,取名为“脚本”。
按F9调出动作面板(如果是FLASH MX,请选“专家模式”),然后在空白处输入以下代码:
fullcreen_btn.onRelease=function(){ //onRlease表示点击并松开运行(function) fscommand(“fullscree”,true) //fscommand是一个命令语句fullscreen是全屏
}
close_btn.onRelease=function(){
fscommand(“quit”,true)//quit表示退出
}
play_btn.onRelease=function(){
_root.play()//播放_root.表示主场景,加上这个前缀来控制主时间轴,下同
}
stop_btn.onRelease=function(){
_root.stop()//停止
}
back_btn.onRelease=function(){
_root.gotoAndStop(“mulu”) //返回到目录帧(你在课件中有目录的帧的属性面板中找到“标签”栏,在其中输入:mulu这时在时间轴会有一面小红旗和mulu字样)
}
music_btn.onRelease=function(){
musiccontrol.play() //这里要涉及一个音乐控制影片剪辑,在后面介绍
}
practice_btn.onRelease=function(){
_root.gotoAndStop(“practice”) //跳到练习内容(帧标签为practice)
}
score_btn.onRelease=function(){
score_mc._visible=true //设置计分板为可见,计分板制作将在后面介绍
}
help_btn.onRelease=function(){
helpcontrol.play() //设置帮助信息的可见与隐藏控制,后面有相关介绍
}
输入完成后,点一下上部分的小勾,检查脚本有无错误,如果出现错误提示,认真检查,并正确输入。
直到提示“此脚本无错误”。
三、制作实现背景音乐控制、计分板、帮助信息面板的影片剪辑
在这里顺便提一下:建议在库中建立几个文件夹,便于管理众多的影片剪辑
单击库面板中左下角的文件夹图标,就会在库中建立文件夹,可以将各种影片剪辑归类存放:如建立“声音”、“按钮”、“面板部件”三个文件夹,再把相应的元件拖入其中。
要使用里面的元件时,只要双击文件夹图标即可。
1、制作背景音乐控制元件
导入一个mp3/wav格式的音乐文件,不要太大,以1-4M为佳。
导入后,在库面板中会出现一个喇叭形状的图标,将它拖到“声音”文件夹中。
新建一个影片剪辑,取名为“音乐”。
将刚才导入的音乐拖入到编辑窗口中,单击第一帧,在“属性”面板中,将“同步”下拉选单中选“数据流”(如下图,为的是让音乐随帧播放,便于控制),然后在700帧左右插入帧(不是关键帧呀!!),如果音乐大概是1分钟就要720帧,自己算算。
直到你的最后一帧中无蓝色波形,说明音乐刚好放到那里就完成了。
再新建一个影片剪辑,取名为“音乐控制”。
在第一帧的帧动作中输入:
stop()
music_mc.play() //让音乐放
在第二帧插入一个关键帧,在帧动作中输入:
stop()
music_mc.stop() //让音乐停
在库中双击“界面”元件进入它的编辑状态,新建一层,取名为“音乐”,将刚才做好的影片剪辑“音乐”和“音乐控制”拖到工作区任意位置,并分别命名为:music_mc和musiccontrol。
到此,背景音乐的控制元件就做好了。
能在界面中单击“音乐”按钮进行控制了。
按Ctrl+Enter 键测试一下吧!
2、制作计分板元件
这个里面将要用到“动态文本”,这是一个可以按要求随时改变字符的文本,用来动态显示分数。
新建一个影片剪辑,取名为“计分板”。
先画好板面,要注意与主界面相配。
并在适当的位置用文本输入各组组号。
新建一层,取名为“分数”,点T文本工具,并在属性栏中,设为“动态文本”,在面板组名下框出六个文本区,并分别取“变量”为s1-s6,如图:
再做一个加分按钮和一个减分按钮(不细说步骤了),将它们拖放六次到计分板的适当位置,实例名为:jia1_btn,jian1_btn,jia2_btn,jian2_btn… …如图:
新建一层,打开帧动作面板,输入六段下面类似代码:
a1 = 0;
jia1_btn.onRelease = function() {
a1++;//每次单击递加1
s1 = a1;
};
Jian1_btn.onRelease = function() {
a1--;//每次单击递减1
s1 = a1;
}
… …
(以上是1组的加减分按钮,你就另外加5个的进去吧!只要将1改成2、3、4、5、6即可,注意要认真一点,输完后要检查无误。
)
最后还要拖入一个可以将计分板关闭的按钮来,放在右上角,实例名称为:close_btn,在帧动作面板中还要加入条:
close_btn.onRelease=function(){
_parent._visible=false//表示上一级(即计分板)不可见
}
这时,计分板己做好。
在库面板中,双击“界面”,打开它的编辑状态。
新建一层,取名为“计分”,将做好的“计分板”元件拖入到场景中适当位置,并在“实例名称”输入:score_mc 。
你再测试一下你的计分板吧!呵呵!
3、制作帮助信息元件
这个很简单,新建一个影片剪辑,命名为“帮助信息”,画个450*20的矩形,再向里面添加一个动态文本。
变量取为helptxt就行了。
再新建一个只有两帧的类似于音乐控制的影片剪辑:帮助控制
第一帧动作:stop()
help_mc._visible=true //帮助为可见
第二帧动作:stop()
help_mc._visible=false //帮助为不可见
两个做好了,再在库中双击“界面”进入编辑状态,新建一层,取名为“帮助”,将刚做的“帮助信息”拖到界面的下文横条上。
在实例名中输入:help_mc,再将“帮助控制”也拖入,实例名:helpcontrol 。
要实现实时显示帮助信息,还得要加入一些代码,单击“界面”的第一帧,在动作面板中输入:close_btn.onRollover=function(){// onRollOver表示在鼠标移到按钮上时触发事件
help_mc.helptxt=”提示:单击关闭本课件”//给动态文本的变量helptxt赋值,下同
}
fullscreen_btn.onRollover=function(){
he lp_mc.helptxt=”提示:单击全屏显示课件”
}
small_btn.onRollover=function(){
help_mc.helptxt=”提示:单击小屏显示本课件”
}
play_btn.onRollOver=function(){
help_mc.helptxt="提示:单击播放课件。
"
}
stop_btn.onRollOver=function(){
help_mc.helptxt="提示:单击暂停播放课件。
"
}
back_btn.onRollOver=function(){
help_mc.helptxt="提示:单击返回课件目录。
"
}
music_btn.onRollOver=function(){
help_mc.helptxt="提示:单击播放或停止背景音乐。
"
}
score_btn.onRollOver=function(){
help_mc.helptxt="提示:单击进入小组计分系统。
"
}
practice_btn.onRollOver=function(){
help_mc.helptxt="提示:单击进入练习题。
"
}
quit_btn.onRollOver=function){
help_mc.helptxt=”提示:单击将退出课件”
}
另外,有时想在课件上显示时间,可以加一个动态文本,变量为:mytime。
并在它所在的帧的帧动作中输入:
function showtime(){
var time=new Date() //得到系统时间字符串
mytime=substring(time,11,9) //只截取其中时分秒的部分
}
setInterval(showtime,100)//100毫秒刷新一次
提高篇:(可以不做)
1、课件中实现粉笔的功能(即鼠标画线并能擦除):
在主场景帧动作中输入下面的代码可以实现鼠标的画线:
_root.onLoad=function(){
i=false;
}
_root.onMouseDown=function(){
x=_root. _xmouse;
y=_root. _ymouse;
i=true;
_root.moveTo(x,y)
}
_root.onMouseUp=function(){
i=false;
}
_root.onMouseMove=function(){
if(i==true){//判断画线条件
_root.lineStyle(2,oxff0000,100); //确定线型(线宽,RGB色,透明度)
_root. lineTo(_root. _xmouse,_root._ymouse)
}else{
_root.lineStyle()//如果条件不具备,则利用无线型,不显示线条
}
updateAfterEvent()
}
还要另加一个按钮来清除画好的线,按钮动作:
on(release){
_root.clear()//清除
}
带画线功能课件实例(如图):/soft/learnclock.swf
2、让计分等面板成为仿windows窗口,可随意拖动
新建一个影片剪辑,画一个像Windows窗口标题栏样式的条状体,,取名为bar
将它放在计分面板上,实例名设为:bar
然后在它所在帧的帧动作中输入:
bar.onPress=function(){
_parent.startDrag() //当鼠标按下时能拖动
}
bar.onRelease=function(){
_parent.stopDrag()//当鼠标弹起时停止拖动
}
实际上在所有的面板都可以像这样做,一样可以实现面板可拖动。
呵呵,是不是挺酷?
可拖动窗口课件实例(如图):/soft/siji.swf
到此为止,我们的多功能课件封面己全部完成了。
让我们来测试一下课件吧!如下图:
剩下要做的只要做好课件的动画内容了,在要停的帧中加入一个帧动作:stop(),就能用我们的课件封面来控制内容显示了!赶快行动吧,让我们一起来做一个多功能动画课件,一起来“闪”吧!!。