音乐播放器的编写 -Flex



此内容分3篇文章来撰写

1、前台网页

2、Flex播放器编写

3、音乐后台管理

先给大家看看最后的效果：点击打开链接  (请使用IE浏览器)

现在我们就开始第二篇的介绍，废话少说，直接上代码，相信大家也很容易看懂

<?xml version="1.0" encoding="utf-8"?>
<s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
			   xmlns:s="library://ns.adobe.com/flex/spark"
			   xmlns:mx="library://ns.adobe.com/flex/mx"
			   xmlns:bridge="bridge.*"
			   width="379" height="122" initialize="application1_initializeHandler(event)">
	<fx:Declarations>
		<bridge:FABridge/>
	
		<!--width="379"  height="118"  将非可视元素（例如服务、值对象）放在此处 -->
	</fx:Declarations>
	<fx:Script>
		<![CDATA[
			import mx.collections.ArrayList;
			import mx.controls.Alert;
			import mx.core.FlexGlobals;
			import mx.events.FlexEvent;  
			
			private var snd:Sound;
			private var channel:SoundChannel;
			private var trans:SoundTransform;
			private var playStatus:Number = 0;
			private var playPosition:Number = 0;
			
			[Bindable]
			private var sonname:String="";
			
			private var musicurl:String="";
			
			private var autostart:String="1";
			
			var clock:Timer = new Timer(1000, 100000);//每0.1秒更新一次
			
			private var lrcList:ArrayList=new ArrayList();
			
			private function initLrc(){
				
				this.lrcList.addItem("[00:00.00]咱们结婚吧");
				
				this.lrcList.addItem("[00:00.00]咱们结婚吧");
			}
			
			protected function application1_initializeHandler(event:FlexEvent):void
			{
				var app:Application=this;
				
				
				try
				{
					if(!app.parameters.hasOwnProperty('author'))
					{
						return;
					}
					else
					{
						
					}
				}
				catch(e)
				{
					
				}
				
				var copyrightMenuItem:ContextMenuItem = new ContextMenuItem("关于ohyewang.com", true, true);
				copyrightMenuItem.addEventListener(ContextMenuEvent.MENU_ITEM_SELECT,function(e:ContextMenuEvent){
					navigateToURL(new URLRequest("http://www.ohyewang.com"), "_blank"); 
				});
				var contextMenuCustomItems:Array = FlexGlobals.topLevelApplication.contextMenu.customItems;
				contextMenuCustomItems.push(copyrightMenuItem);
				
				flash.external.ExternalInterface.addCallback("play",play);//添加JS回调函数
				
				flash.external.ExternalInterface.addCallback("paySong",paySong);//添加JS回调函数
				
				flash.external.ExternalInterface.addCallback("setSongProgress",setSongProgress);//添加JS回调函数
				
				flash.external.ExternalInterface.addCallback("setVolume",setVolume);//添加JS回调函数
				
				flash.external.ExternalInterface.addCallback("stopStartSong",stopStartSong);//添加JS回调函数
				
				flash.external.ExternalInterface.call("javascriptMethod");//调用JS方法
				
				//if(autostart=="1")
				//{
					//play();//自动播放
				//}
			}
			
			protected function play(){
				// 标示当前播放状态，0是未加载，1是播放，2是暂停
				if(playStatus==0 || playStatus==1)
				{
					if(playStatus==0)
					{
						snd = new Sound(new URLRequest(musicurl));
						trans = new SoundTransform();
						trans.volume = hsVolume.value/hsVolume.maximum;
						
					}
					
					playButton.label = "暂停";
					channel = snd.play(playPosition);
					playStatus = 2;
				}
				else if(playStatus==2)
				{
					playButton.label = "播放";
					channel.stop();
					playStatus = 1;
				}
				
				clock.start();
				clock.addEventListener(TimerEvent.TIMER,showTime);
			}
			
			//JS调用Flex方法播放
			protected function stopStartSong(status:String){
				
				if(playStatus==1)
				{
					channel = snd.play(playPosition);
					playStatus=2;
				}
				else{
					channel.stop();
					playStatus = 1;
				}
			}
			
			//JS调用Flex方法播放
			protected function paySong(mp3URL:String){
				 
				musicurl=mp3URL;
				playStatus=0;
				snd = new Sound(new URLRequest(musicurl));
				trans = new SoundTransform();
				if(	channel!=null)
			    {
					  channel.stop();
				}
				trans.volume = hsVolume.value/hsVolume.maximum;
			
				playPosition=0;
				channel = snd.play(playPosition);
				channel.soundTransform = trans;
				
				hsProgress.value=0;
				
				
				if(clock.running==false)
				{
					clock.start();
					clock.addEventListener(TimerEvent.TIMER,showTime);
				}
			}
			
			//JS调用Flexy设置播放进度
			protected function setSongProgress(pro:Number){
				
				var  pr:Number=hsProgress.maximum*pro;
				hsProgress.value=pr;
				channel.stop();
				channel = snd.play(hsProgress.value/hsProgress.maximum * snd.length);
			}
			
			protected function setVolume(vol:Number){
			
				hsVolume.value=vol/100*hsVolume.maximum;
				trans.volume = hsVolume.value/hsVolume.maximum;
				channel.soundTransform = trans;
				
			}
			
			//Flex调用JS显示播放进度
			protected function songProgress(current:String,total:String,playPosition:Number,minSecond:Number)
			{
				flash.external.ExternalInterface.call("songProgress",current,total,playPosition,minSecond);//调用JS方法
			}
			
			
			protected function button1_clickHandler(event:MouseEvent):void
			{
				play();
			}
			
			protected function showTime(event:Event):void{
				playPosition = channel.position;
				var current:String=formatDate(channel.position);
				if(playStatus==2){
					this.txtLrcLog.text+="\r\n"+current;
				}
				var total:String=formatDate(snd.length);
				timeLabel.text =current + " / " +total ;
				hsProgress.value = channel.position/snd.length * hsProgress.maximum;
				
			
				if(current==total&& playPosition!=0 )
				{
					playPosition=0;
					hsProgress.value=0;
					/*playPosition=0;
					hsProgress.value=0;
					channel.stop();
					channel = snd.play(hsProgress.value/hsProgress.maximum * snd.length);
					
					*/
					flash.external.ExternalInterface.call("nextSong");
				}
				else{
					songProgress(current,total,hsProgress.value,int(channel.position));
				}
			}
			
			
			protected function hsProgress_changeEndHandler(event:FlexEvent):void
			{
				channel.stop();
				channel = snd.play(hsProgress.value/hsProgress.maximum * snd.length);
				
				timeLabel.text = formatDate(channel.position) + " / " + formatDate(snd.length);
			}
			
			protected function hsVolume_changeEndHandler(event:FlexEvent):void
			{
				trans.volume = hsVolume.value/hsVolume.maximum;
				channel.soundTransform = trans;
			}
			
			// 把毫秒格式化为时间
			protected function formatDate(num:Number):String
			{
				var total:int = int(num / 1000);//毫秒
				
				
				
				var second:int = total%60;
				total = (total-second)/60;
				var minute:int = total%60;
				total = (total-minute)/60;
				var hour:int = total;
				
				var minsecond:int=(num-second*1000-(minute*60*1000))/10;
				
				var returnValue:String = "";
				if(hour!=0) returnValue = String(hour) + ":";
				if(minute<10) returnValue += "0";
				returnValue += String(minute) + ":";
				if(second<10) returnValue += "0";
				returnValue += String(second)+".";
				
			
				if(minsecond<10) returnValue += "0";
				returnValue += String(minsecond);
				
				
				return returnValue;
			}
			
			// 把播放进度绑定到播放时间的标签上，以及调整进度的组件上
			protected function application1_enterFrameHandler(event:Event):void
			{
				timeLabel.text = formatDate(channel.position) + " / " + formatDate(snd.length);
				playPosition = channel.position;
				hsProgress.value = channel.position/snd.length * hsProgress.maximum;
			}
			
			
			
		]]>
	</fx:Script>
	<s:BorderContainer x="3" y="6" width="369" height="108">
		<s:Label x="83" y="47" width="45" text="进度："/>
		<s:HSlider id="hsProgress" x="135" y="48" width="221"
				   changeEnd="hsProgress_changeEndHandler(event)" maximum="100" showDataTip="false"/>
		<s:Label x="83" y="67" width="45" text="音量："/>
		<s:HSlider id="hsVolume" x="136" y="71" width="221"
				   changeEnd="hsVolume_changeEndHandler(event)" maximum="10" showDataTip="false"
				   value="8"/>
		<s:Button id="playButton" x="12" y="53" width="55" label="播放"
				  click="button1_clickHandler(event)"/>
		<s:Label id="timeLabel" x="139" y="12" text="00:00 / 00:00"/>
		<s:Label x="83" y="12" text="播放进度："/>
		<s:Label x="83" y="88" width="274" color="#BDB9B9" text="{sonname}" textAlign="center"
				 verticalAlign="middle"/>
		
	</s:BorderContainer>  
	<s:TextArea id="txtLrcLog" visible="false" x="10" y="122" width="0"/>
</s:Application>