|
在這個(gè)播放器中,我內(nèi)置了幾首歌曲的連接,點(diǎn)擊節(jié)目單會(huì)看到它們.同時(shí)提供了一個(gè)音樂(lè)地址的文本框,你可以輸入任何歌曲的地址進(jìn)行播放.在播放時(shí),會(huì)有一個(gè)播放進(jìn)度條,同其它的媒體播放器一樣,你可以點(diǎn)擊進(jìn)度條來(lái)移動(dòng)歌曲的播放點(diǎn),達(dá)到快進(jìn)和快退的目的.而播放控制按鈕功能也同其它媒體播放器一樣.播放器中設(shè)置了音量調(diào)節(jié)滑塊和聲道調(diào)節(jié)滑塊.而閃動(dòng)的光柵的高度則隨音量的高低的變化而變化.
現(xiàn)在來(lái)制作這個(gè)播放器的.
1.首先來(lái)做一些準(zhǔn)備工作.播放器的外觀并非本教程的內(nèi)容,但一些部件是必須的.
先作5個(gè)按鈕:播放,暫停,停止,快進(jìn),快退,如下圖:
它們的實(shí)例名稱分別是:ply_btn,zd_btn,stop_btn,kj_btn,kt_btn
2.下面來(lái)制作進(jìn)度條,新建一影片剪輯,畫(huà)一細(xì)長(zhǎng)矩形,新插入一層,再畫(huà)一個(gè)相同長(zhǎng)度不同顏色的矩形,并將它轉(zhuǎn)換為影片剪輯元件,實(shí)例名稱為:jdt_mc.回到主場(chǎng)景,將進(jìn)度條影片剪輯放到舞臺(tái)上,取實(shí)例名稱為:jdk_mc.如圖:
3.聲道控制面板,新建一影片剪輯,按下圖畫(huà)出聲道控制面板:
畫(huà)一個(gè)小的矩形放到面板的中間刻度上,將小矩形轉(zhuǎn)換為影片剪輯,或者就叫滑塊吧.為它取實(shí)例名稱:sdhk_mc.
回到主場(chǎng)景,將聲道控制影片剪輯拖到舞臺(tái)上,為它取實(shí)例名稱:sd_mc
4.音量控制面板,新建影片剪輯,按下圖畫(huà)出音量控制面板:
將滑塊元件(在上一步中創(chuàng)建的)拖到舞臺(tái)上,放到音量最大處(右邊),為它取實(shí)例名稱:ylhk_mc
回到主場(chǎng)景,將音量控制影片剪輯拖到舞臺(tái)上,為它取實(shí)例名稱為:yl_mc
5.節(jié)目單按鈕,做下面一樣的影片剪輯,放在舞臺(tái)上,取實(shí)例名稱為:jmdbtn_mc
6.節(jié)目單,新建影片剪輯,畫(huà)一矩形,在矩形上放一個(gè)文本框,輸入歌曲名稱,演唱者:
同樣的方法創(chuàng)建其它的歌曲名稱影片剪輯.
新建一影片剪輯,將這些歌曲名稱影片剪輯,從庫(kù)中拖入排好:
分別給這些歌名影片剪輯取實(shí)例名稱:song1_mc,song2_mc……..song5_mc.
新建一圖層,畫(huà)一矩形蓋住所有歌名,然后將這一層拖到最下面.這個(gè)矩形的顏色應(yīng)與歌曲名稱影片中的矩形顏色相同.
回到主場(chǎng)景,將節(jié)目單影片剪輯拖到舞臺(tái)上,放到節(jié)目單按鈕下面,取實(shí)例名稱為:song_mc
7.光柵,新建影片剪輯,畫(huà)如下圖形:
放在舞臺(tái)上,然后復(fù)制4個(gè),共5個(gè),分別取實(shí)例名稱為:gb1,gb2,gb3,gb4,gb5
8.地址欄,在舞臺(tái)上建一個(gè)動(dòng)態(tài)文本框,取實(shí)例名稱為:RUL_txt
9.再放兩個(gè)動(dòng)態(tài)文本,用來(lái)用數(shù)字顯示進(jìn)度.兩個(gè)文本框的實(shí)例名稱分別為:dqcd_txt,zcd_txt
10.好了,所有的東西都準(zhǔn)備齊了,至于你想怎樣將它們擺放得漂亮一些,那是你的事情了,本文不涉及到這些內(nèi)容.我們要寫(xiě)代碼了.
我們首先要獲得歌曲的地址,將地址放到地址文本框中,當(dāng)然,最簡(jiǎn)單的辦法是,直接在地址框中輸入地址.但我們內(nèi)置了幾首歌,這就要為這些歌名元件添加點(diǎn)擊事件,當(dāng)點(diǎn)擊時(shí),將歌曲地址放到地址框中.
在剛打開(kāi)播放器時(shí),我們讓節(jié)目單不可見(jiàn),點(diǎn)擊節(jié)目單按鈕后,才讓節(jié)目單顯示出來(lái):
song_mc._yscale = 0;
這樣節(jié)目單的高度為0,就不可見(jiàn)了.
jmdbtn_mc.onRelease = function(){
if(song_mc._yscale > 0){
song_mc._yscale = 0;
}else {
song_mc._yscale=100;
}
}
點(diǎn)擊節(jié)目單按鈕,如果節(jié)目單是打開(kāi)的則關(guān)閉節(jié)目單,如果是關(guān)閉的則打開(kāi)節(jié)目單.
節(jié)目單打開(kāi)后,就可以點(diǎn)擊歌曲名稱將地址放到地址框中了:
song_mc.song1_mc.onRelease = function(){
RUL_txt.text ="http://www./%E5%9B%BD%E5%AE%B6160.mp3";
song_mc._yscale=0;
}
song_mc.song2_mc.onRelease = function(){
RUL_txt.text ="http://lfg./sjweb/enjoyment/music/tiany.mp3";
song_mc._yscale=0;
}
song_mc.song3_mc.onRelease = function(){
RUL_txt.text ="http://xuegong./jx/edit/uploadfile/2008223213733227.mp3";
song_mc._yscale=0;
}
song_mc.song4_mc.onRelease = function(){
RUL_txt.text ="http://www./music/%E7%94%BB%E5%BF%83.mp3";
song_mc._yscale=0;
}
song_mc.song5_mc.onRelease = function(){
RUL_txt.text ="http://1968./UploadFiles/2008-6/436743781.mp3";
song_mc._yscale=0;
}
song_mc.song6_mc.onRelease = function(){
RUL_txt.text ="http://211.155.30.36:8089/music/Audio/6.mp3";
song_mc._yscale=0;
}
地址欄中有了歌曲的地址,那么就可以點(diǎn)擊播放按鈕播放歌曲了.
首先要?jiǎng)?chuàng)建一個(gè)Sound類,用來(lái)加載mp3:
var wmp3:Sound = new Sound();
在播放前,應(yīng)該將進(jìn)度條設(shè)在0處:
jdk_mc.jdt_mc._xscale = 0;
將光柵的高度設(shè)為零,因?yàn)樵O(shè)光柵高度為零的動(dòng)作要多次執(zhí)行,所以將它做成一個(gè)函數(shù),然后調(diào)用它:
function gbhl(){
for(i=1;i<6;i++){
gb_mc = eval("gb"+i);
gb_mc._yscale = 0;
}
}
gbhl();
我們還需要一些變量后面有用:
var zcd;//歌曲的總長(zhǎng)度
var dqcd;//當(dāng)前已播放的長(zhǎng)度,用于暫停按鈕和進(jìn)度條
var ztd =0;//暫停點(diǎn),用于暫停按鈕
var jd;//進(jìn)度條的位置
var rul:String;//歌曲的地址
var sdz;//聲道的值
var ylz;//音量的值
這些變量現(xiàn)在不用管它,在后面用到它們時(shí)會(huì)給予說(shuō)明的.
接下來(lái)就該寫(xiě)播放按鈕上的代碼了,有了播放按鈕,就可以興賞音樂(lè)了.
在播放時(shí),首先應(yīng)該判斷當(dāng)前是從頭開(kāi)始播放還是處于暫停狀態(tài),如果是暫停,那么我們上面聲明的變量ztd就不會(huì)是0,根據(jù)這個(gè)變量是否為零就可以確定是從頭開(kāi)始播放還是從ztd開(kāi)始播放,如果ztd為零,首先從地址欄獲得歌曲地址,然后判定地址是否為空,如果不為空則將進(jìn)度條歸零,然后加載歌曲,并播放歌曲.調(diào)用mp3pl()函數(shù),這個(gè)函數(shù)是在歌曲播放過(guò)程中設(shè)置一些效果比如進(jìn)度條,光柵等.如果ztd不為零,則歌曲從暫停點(diǎn)處播放,并調(diào)用mp3pl()函數(shù).
ply_btn.onRelease = function(){
if(ztd ==0){
rul = RUL_txt.text;
if(rul){
jdk_mc.jdt_mc._xscale = 0;
wmp3.loadSound(rul,true);
wmp3.start();
mp3pl(wmp3);
}
}else {
wmp3.start(ztd);
mp3pl(wmp3);
}
}
現(xiàn)在來(lái)看看mp3pl()函數(shù),在這個(gè)函數(shù)中會(huì)用到Sound類的兩個(gè)屬性和一個(gè)方法,先介紹一下.
duration屬性:該屬性返回聲音的總長(zhǎng)度,以毫秒計(jì)算.
position屬性:上一節(jié)已經(jīng)介紹過(guò),它返回聲音已播放的長(zhǎng)度,以毫秒計(jì)算.
getVolume()方法:返回聲音單量的大小,數(shù)字為0-100.
在這個(gè)函數(shù)中,在onEnterFrame事件中,首先獲取歌曲的總長(zhǎng)度和當(dāng)前已播放的長(zhǎng)度,將這兩個(gè)數(shù)字顯示在文本框中,計(jì)算出播放進(jìn)度,設(shè)置進(jìn)度條的_xscale比例,顯示播放進(jìn)度,然后根據(jù)音量設(shè)置光柵的高度,首先將_yscale設(shè)為音量的一半,然后將另一半設(shè)為random()產(chǎn)生隨機(jī)數(shù),這樣就產(chǎn)生閃動(dòng)的效果.
function mp3pl(mp3){
onEnterFrame = function(){
zcd = mp3.duration/1000;
dqcd = mp3.position/1000;
zcd_txt.text = Math.floor(zcd);
dqcd_txt.text = Math.floor(dqcd);
jd = dqcd/zcd*100;
jdk_mc.jdt_mc._xscale = jd;
if(dqcd!=zcd){
for(i=1;i<6;i++){
gb_mc = eval("gb"+i);
gb_mc._yscale =mp3.getVolume()/2+ random(mp3.getVolume()/2);
}
}
}
}
現(xiàn)在應(yīng)該基本成形了,剩下的就是幾個(gè)按加上功能了.
當(dāng)點(diǎn)擊進(jìn)度條時(shí)根據(jù)鼠標(biāo)在進(jìn)度條上的位置,確定歌曲重新從那一點(diǎn)上開(kāi)始播放,達(dá)到快進(jìn)或快退的功能.
jdk_mc.onRelease= function(){
var djd = _xmouse - jdk_mc._x;
var kjd = djd/jdk_mc._width*zcd;
wmp3.stop();
wmp3.start(kjd);
}
暫停按鈕:記錄當(dāng)前已播放的長(zhǎng)度,并存到ztd中,停止播放歌曲,這樣當(dāng)點(diǎn)擊播放按鈕時(shí),因ztd不等于0,而使歌曲從ztd開(kāi)始播放.
zd_btn.onRelease =function(){
ztd = dqcd;
wmp3.stop();
delete onEnterFrame;
gbhl();
}
停止按鈕:將ztd設(shè)為0,停止播放歌曲.
stop_btn.onRelease=function(){
wmp3.stop();
ztd = 0;
delete onEnterFrame;
gbhl();
}
快進(jìn)快退按鈕,在當(dāng)前已播放長(zhǎng)度的基礎(chǔ)上加上或減去5秒,重新播放歌曲
kj_btn.onRelease=function(){
wmp3.stop();
kjd = dqcd + 5;
wmp3.start(kjd);
}
kt_btn.onRelease=function(){
wmp3.stop();
ktd = dqcd - 5;
wmp3.start(ktd);
}
下面的聲道控制,在Sound類,的setPan()方法可以設(shè)置聲音的聲道,值為0-100,0聲音將完全由左聲道播出,而100則完全由右聲道播出.當(dāng)移動(dòng)聲道控制上滑塊,放開(kāi)時(shí)根據(jù)滑塊的位置設(shè)置聲道的值.
sd_mc.sdhk_mc.onPress = function(){
startDrag(this,true,0,0,sd_mc._width-this._width/2,0);
}
sd_mc.sdhk_mc.onRelease = function(){
stopDrag();
sdz = (this._x)/sd_mc._width*100;
wmp3.setPan(sdz);
}
音量控制,在Sound類中可以使用setVolume()方法設(shè)置聲音的音量,值為0-100,當(dāng)移動(dòng)音量控制上滑塊,放開(kāi)時(shí)根據(jù)滑塊的位置設(shè)置音量的值.
yl_mc.ylhk_mc.onPress = function(){
startDrag(this,true,0,0,yl_mc._width-this._width/2,0);
}
yl_mc.ylhk_mc.onRelease = function(){
stopDrag();
ylz = (this._x)/yl_mc._width*100;
wmp3.setVolume(ylz);
}
OK,現(xiàn)在真正的完全完成了,靜下心來(lái)興賞音樂(lè)吧.
完整的代碼:
- song_mc._yscale = 0;
- var wmp3:Sound = new Sound();
- var zcd;
- var dqcd;
- var ztd =0;
- var jd;
- var rul:String;
- var sdz;
- var ylz;
- jdk_mc.jdt_mc._xscale = 0;
- gbhl();
- ply_btn.onRelease = function(){
- if(ztd ==0){
- rul = RUL_txt.text;
- if(rul){
- jdk_mc.jdt_mc._xscale = 0;
- wmp3.loadSound(rul,true);
- wmp3.start();
- mp3pl(wmp3);
- }
- }else {
- wmp3.start(ztd);
- mp3pl(wmp3);
- }
- }
- jdk_mc.onRelease= function(){
- var djd = _xmouse - jdk_mc._x;
- var kjd = djd/jdk_mc._width*zcd;
- wmp3.stop();
- wmp3.start(kjd);
- }
- function mp3pl(mp3){
- onEnterFrame = function(){
- zcd = mp3.duration/1000;
- dqcd = mp3.position/1000;
- zcd_txt.text = Math.floor(zcd);
- dqcd_txt.text = Math.floor(dqcd);
- jd = dqcd/zcd*100;
- jdk_mc.jdt_mc._xscale = jd;
- if(dqcd!=zcd){
- for(i=1;i<6;i++){
- gb_mc = eval("gb"+i);
- gb_mc._yscale =mp3.getVolume()/2+ random(mp3.getVolume()/2);
- }
-
- }
- }
- }
- jmdbtn_mc.onRelease = function(){
- if(song_mc._yscale > 0){
- song_mc._yscale = 0;
- }else {
- song_mc._yscale=100;
- }
- }
- song_mc.song1_mc.onRelease = function(){
- RUL_txt.text ="http://www./%E5%9B%BD%E5%AE%B6160.mp3";
- song_mc._yscale=0;
- }
- song_mc.song2_mc.onRelease = function(){
- RUL_txt.text ="http://lfg./sjweb/enjoyment/music/tiany.mp3";
- song_mc._yscale=0;
- }
- song_mc.song3_mc.onRelease = function(){
- RUL_txt.text ="http://xuegong./jx/edit/uploadfile/2008223213733227.mp3";
- song_mc._yscale=0;
- }
- song_mc.song4_mc.onRelease = function(){
- RUL_txt.text ="http://www./music/%E7%94%BB%E5%BF%83.mp3";
- song_mc._yscale=0;
- }
- song_mc.song5_mc.onRelease = function(){
- RUL_txt.text ="http://1968./UploadFiles/2008-6/436743781.mp3";
- song_mc._yscale=0;
- }
- song_mc.song6_mc.onRelease = function(){
- RUL_txt.text ="http://211.155.30.36:8089/music/Audio/6.mp3";
- song_mc._yscale=0;
- }
- function gbhl(){
- for(i=1;i<6;i++){
- gb_mc = eval("gb"+i);
- gb_mc._yscale = 0;
- }
- }
- stop_btn.onRelease=function(){
- wmp3.stop();
- ztd = 0;
- delete onEnterFrame;
- gbhl();
- }
- zd_btn.onRelease =function(){
- ztd = dqcd;
- wmp3.stop();
- delete onEnterFrame;
- gbhl();
- }
- kj_btn.onRelease=function(){
- wmp3.stop();
- kjd = dqcd + 5;
- wmp3.start(kjd);
- }
- kt_btn.onRelease=function(){
- wmp3.stop();
- ktd = dqcd - 5;
- wmp3.start(ktd);
- }
- sd_mc.sdhk_mc.onPress = function(){
- startDrag(this,true,0,0,sd_mc._width-this._width/2,0);
- }
- sd_mc.sdhk_mc.onRelease = function(){
- stopDrag();
- sdz = (this._x)/sd_mc._width*100;
- wmp3.setPan(sdz);
- }
- yl_mc.ylhk_mc.onPress = function(){
- startDrag(this,true,0,0,yl_mc._width-this._width/2,0);
- }
- yl_mc.ylhk_mc.onRelease = function(){
- stopDrag();
- ylz = (this._x)/yl_mc._width*100;
- wmp3.setVolume(ylz);
- }
復(fù)制代碼
|
|
|
