AS3基础教程-第36课-mp3播放器(1)

2025-11-23 03:18:14

1、打开flashCS6软件,新建AS3的flash文档。

本节课实现下面的目标:

<1>载入外部音乐

<2>布置播放和暂停按钮,分别实现播放和暂停的效果

<3>播放和暂停按钮不同时存在

<4>如果单击了暂停按钮,再单击播放,将会续播

2、我们先设计界面。

本节课只有两个按钮,我们从公用库内拖出两个来,一个播放的、一个暂停的

保证宽高比锁定的前提下,将宽度调节为50 ,从而让按钮不至于太小,影响观感。

然后在属性面板内设置实例名分别为 play_btn 和 pause_btn

最后,将图层1重命名为 按钮

如下图所示

AS3基础教程-第36课-mp3播放器(1)

3、因为,播放和暂停按钮不能同时显示,所以,接下来,我们将两个按钮放到同一个位置,为了方便后期的修改,最好将两者放在不同的图层内:

用选择工具,选中暂停按钮,按Ctrl+X键即可剪切掉

新建一个图层,命名为暂停按钮,按Ctrl+V键即可粘贴进来,然后将其位置移动到播放按钮上面,使两者完全重合,如下图所示

AS3基础教程-第36课-mp3播放器(1)

4、接下来准备写代码,首先使用代码片段功能,给暂停按钮添加 单击命令,会自动生成Actions图层,将里面的代码稍事修改,去掉所有的注释,然后将相应函数的名字修改为 danji 将参数的名字修改为 evt

AS3基础教程-第36课-mp3播放器(1)

5、接下来,将

pause_btn.addEventListener(MouseEvent.CLICK, danji);

这一行代码复制、粘贴一份,然后将事件源的pause_btn给修改为play_btn

如此一来,两个按钮共用一个响应函数

AS3基础教程-第36课-mp3播放器(1)

6、接下来,当然是在响应函数内,使用switch语句,对单击操作进行“分流”:

switch(evt.target.name){

case  "play_btn":

//播放按钮的代码

break

case  "pause_btn":

//暂停按钮的代码

break

}

7、现在,我们先解决 两个按钮不同时出现 的目标。在这里需要用到 显示对象【包括影片剪辑和按钮两种元件,以及使用代码生成的显示在舞台上的对象。它们合称为显示对象】的visible属性,该属性控制的是显示对象的显示与隐藏,其类型是 布尔类型,仅有true和false两个数值。

8、由于,一打开作品声音就播放,故此,此时的舞台上只显示暂停按钮,那么播放按钮就要隐藏,代码如下:

//模块一:按钮的显示与隐藏

play_btn.visible=false//播放按钮

pause_btn.visible=true//暂停按钮

9、然后,单击播放按钮时,播放按钮隐藏,暂停按钮显示;

反之,单击暂停按钮时,暂停按钮隐藏,播放按钮显示。

故此,在响应函数内部的两条分支语句内,分别新增代码如下:

//播放按钮的代码

play_btn.visible=false//播放按钮

        pause_btn.visible=true//暂停按钮

//暂停按钮的代码

play_btn.visible=true//播放按钮

        pause_btn.visible=false//暂停按钮

如下图所示

AS3基础教程-第36课-mp3播放器(1)

10、此时,测试影片,看看是否有报错提示,如果不报错,单击按钮看看效果,是否和我们设想的一样。

这是一个很重要的小技巧,就是:每做完一小段代码,先进行测试,看看有没有bug,如此,一小步一小步的逐渐新增功能,可以一步一个脚印。

如果是一鼓作气,将所有的代码都写完后再测试影片,万一出现问题,代码的纠错就比较的困难。

至此,已经实现了两个按钮不同时出现的目标,而且单击任意一个按钮,都会隐藏自身的同时、开启另一个按钮的显示。这与我们的设想完全一致。

11、接下来,就是声音操作的步骤了。

为了降低难度,本节课只给出一首歌的操作步骤。

代码如下:

//模块二:声音

var url:String="E:/music/爱你爱的好疲惫.mp3"

var urr:URLRequest=new URLRequest(url)

var mysd:Sound=new Sound(urr)

var sdcn:SoundChannel=new SoundChannel()

sdcn=mysd.play()

前面已经详解过,这里不再赘述。仅提一点:

代码的第一行,这里使用的是 本地路径,因为我打算加载自己电脑内的一些音乐进行播放,如果将这些音乐都复制到fla文件的目录内,太浪费电脑硬盘的空间,故此,这里使用的是 绝对路径。如果是访问本地声音,绝对路径内必须使用 / 而不是 \

AS3基础教程-第36课-mp3播放器(1)

12、测试影片,无误。一打开本程序,声音就播放。

现在,我们需要给两个按钮分别添加暂停播放和继续播放的功能。那么,仍然是需要事先定义一个Number类型的变量,用于存储当前声音的播放进度:

var sdjd:Number=0//声音进度

那么,播放按钮的响应函数内,需新增的代码是:

sdcn=mysd.play(sdjd)

暂停按钮的响应函数内,需新增的代码是:

sdjd=sdcn.position

sdcn.stop()

AS3基础教程-第36课-mp3播放器(1)

13、测试影片,发现本节课的目标已经全部实现。不要忘记保存fla文件哦。

本节课的完整代码如下:

import flash.media.Sound;

import flash.net.URLRequest;

import flash.media.SoundChannel;

//模块一:按钮的显示与隐藏

play_btn.visible=false//播放按钮

pause_btn.visible=true//暂停按钮

//模块二:声音

var sdjd:Number=0//声音进度

var url:String="E:/music/爱你爱的好疲惫.mp3"

var urr:URLRequest=new URLRequest(url)

var mysd:Sound=new Sound(urr)

var sdcn:SoundChannel=new SoundChannel()

sdcn=mysd.play()

play_btn.addEventListener(MouseEvent.CLICK, danji);

pause_btn.addEventListener(MouseEvent.CLICK, danji);

function danji(evt:MouseEvent):void

{

switch(evt.target.name){

case  "play_btn":

//播放按钮的代码

play_btn.visible=false//播放按钮

        pause_btn.visible=true//暂停按钮

sdcn=mysd.play(sdjd)

break

case  "pause_btn":

//暂停按钮的代码

play_btn.visible=true//播放按钮

        pause_btn.visible=false//暂停按钮

sdjd=sdcn.position

sdcn.stop()

break

}

}

声明:本网站引用、摘录或转载内容仅供网站访问者交流或参考,不代表本站立场,如存在版权或非法内容,请联系站长删除,联系邮箱:site.kefu@qq.com。
猜你喜欢