Winamp是PC上使用率比较高的一款音频播放器，以其短小精悍的身材和系统资源占用低的优点，深受大家的喜爱。作为一名闪客同时又为音乐发烧友的我，自然而然的就想到了利用闪客手中的利器―Flash,来动手自己制作一个模拟的迷你Winamp来，想想使用自己打造出的精美播放器，欣赏着优美的旋律，那情景是多么悠然自得啊。(本例源文件请点击这里下载)所有  热点网络 热点下载  热点网络学院  版权所有=


　　废话少说，说作就做，不过在和大家一起制作之前，前来看一下最后的制作成品，以便使大家在下面的制作过程中能做到心中无数，免得到时候手忙脚乱，最后完成的播放器界面如图1所示：


图1

　　从图一中我们看到，此款播放器的界面可以说非常漂亮，左下角是一排播放按钮，最左边的孔形按钮可以进行精简界面和完整界面之间的切换，接下来的五个按钮大家应该很熟悉了，作用分别是前一首歌曲，播放，暂停，关闭，下一首歌曲。右下方的文字是播放曲目的提示，可以显示出所播放的是哪首歌曲。最酷的要算占据播放器界面主要位置的光谱柱了，可以随着音乐的节奏跳跃，更绝的是我们可以使用鼠标对播放器的整体进行拖动，可以将其放置到任意位置，简直和Winamp是一模一样。看到这里大家一定按捺不住了吧，别着急，让我们一步一步来制作这个精美的播放器。

　　1.首先启动Flash MX,并新建一个影片文件，对影片属性进行设置，设置影片大小为600px*400px(单位为象素)，影片背景色为黑色。

　　2．首先我们要制作的是控制音乐播放的五个按钮，首先来制作最左边的前一首歌曲按钮。新建立一个按钮元件，并命名为back,进入按钮元件的编辑区后，先使用矩形工具绘制一个无填充色的正方形，然后使用直线工具绘制一条细的竖线，并在旁边绘制一个小的三角形，最后给三角形和轮廓线上色，颜色代码为#CCCCFF，最后做好的按钮如图2所示：


图2

　　按照相似的方法，分别制作其它4个按钮，并命名为forward,play,stop和pause,制作完成后的按钮如图3中从左到右所示：


图3

　　最后还需要绘制一个最小化按钮，同样新建一个按钮元件，命名为minimize,进入元件的编辑区后，使用绘图工具绘制如图4所示的按钮：


图4
3．播放器主界面的背景是利用一块填充了渐变色的色块形成的，制作起来非常简单，但是如果能够很好的设计填充色，最后的效果一样很酷。新建一个图形元件，命名为backpanel,进入元件的编辑区后，在当前的图层layer1上面使用矩形工具绘制一个横向的细长矩形，然后打开混色器面版，按照图4所示的填充色设置方法对其进行填充，如图5所示：


图5

　　再新建一个图层Layer2,在其上绘制一个较大的矩形，并位于图4中矩形的上部，按照相同的填充设置对其进行填充，图4中的细条矩形用来放置播放控制按钮，而这个较大的矩形是用做播放器的光谱柱效果的背景，最后如图6所示：


图6

　　4．接下来需要制作播放器中声音的存储部分了，播放器实现的播放不同音乐的原理是：在制作过程中事先导入一定数量的音乐，然后将所以音乐插入到不同的帧中，通过播放按钮来控制跳到不同的帧播放，即实现了不同音乐之间的切换。

　　本例中我们先导入track1,track2和track3三支音轨到影片中，然后新建一个影片剪辑，命名为tracks mc,进入元件编辑区后，将图层中前四帧空下，在第5帧插入关键帧，给此帧添加帧标签，并添加Action动作脚本：stopAllSounds();意思是如果播放到此帧，既停止播放所有声音。

　　在第10帧插入关键帧，将track1引入到此帧，并设置此帧的帧标签为track1,同样的在第20和第30帧分别插入关键帧，分别引入track2和track3,然后分别设置帧标签为track2和track3,这里设置帧标签的作用是不必规定具体哪帧引入的音乐，只要访问相应帧标签代表的帧，就可以播放相应的音乐了，设置完成后时间轴如图7所示：


图7

　　如果你想在播放器中预先添加更多的声音，只需要将其导入，然后在后面继续添加关键帧，将相应的声音导入并设置好帧标签即可。

　　5．接下来就需要制作播放器的主界面了，新建一个影片剪辑，命名为mainpanel,进入元件的编辑区后，自上而下建立四个图层，分别命名为label,actions. Drgbtn和backpanel。

　　首先在图层label的第1和第3帧分别设置帧标签为init和play.也即第1帧用来初始化播放器，从第3帧开始进行播放。所有  热点网络 热点下载  热点网络学院  版权所有=


　　因为我们的播放器可以让用户自由的拖动，所以需要在整个播放器上面放一个隐形按钮，从而实现对播放器的拖动，我们先制作好这个隐形按钮，然后拖动进来，如图8所示：


图8
隐形按钮左下角的缺口是为了留给播放控制按钮，因为如果在此处是不能对播放器进行拖动的，最后给隐形按钮添加Action控制脚本：

on (press) {

startDrag("../../cleoplayer");

}

//当按下此按钮后，即可对主场景中的cleoplayer进行拖动，也就是我们最后的播放器

on (release) {

stopDrag();

}

//当释放鼠标后，停止拖放

　　6．回到图层backpanel,将元件tracks mc拖进编辑区，给其设置实例名为tracks,然后分别将元件backpanel以及5个播放按钮拖进编辑区，调整其位置并将图层drgbtn暂时隐藏后如图9所示：


图9

　　然后给最小化按钮添加Action动作脚本：

on (release) {

tellTarget ("../") {

play();

}

//这里其实是跳到后面的元件player中，元件player实现的就是面板的缩放

}

给前一首按钮添加脚本：

on (release) {

if (Number(playtrack)>1) {

playtrack = playtrack-1;

//首先判断当前播放的是不是第一首，如果不是，将当前播放曲目的信息减一

if (action eq "play") {

status = "playing tr. " add playtrack;

//如果播放按钮已被按下，则曲目信息文本框中显示曲目的名称

tellTarget ("tracks") {

stopAllSounds();

gotoAndStop("track" add ../:playtrack);

}//首先停止正在播放的音乐，然后播放前一首音乐

gotoAndPlay("play");

} else {

status = "stoped tr. " add playtrack;

//设置当前播放状态

}

}

}

给播放按钮添加脚本：

on (release) {

scale = "99";//缩放比率

action = "play";//播放状态

down = "3";

status = "playing tr. " add playtrack;

//当按下播放按钮后，对上面一些变量进行初始化，以便在其它程序段中根据变量值执//行相应的命令

tellTarget ("tracks") {

gotoAndStop("track" add ../:playtrack);

}

//跳到tracks中的含有音乐的那帧并播放

play();

}

给暂停按钮添加脚本：

on (release) {

if (action eq "pause") {

action = "play";

//如果已经处于暂停状态，再此按钮后，就变为播放状态

status = "playing tr. " add playtrack;

tellTarget ("tracks") {

gotoAndStop("track" add ../:playtrack);

}//开始播放音乐

play();

} else {

if (action eq "play") {

action = "pause";

//如果当前状态是播放状态，则按下后处于暂停状态

status = "paused tr. " add playtrack;

tellTarget ("tracks") {

gotoAndStop("stop");

}//停止播放所有声音

stop();

}

}

}