|
歌詞算是分析完了.當然,歌詞頭的信息沒有分析,這些內容將在顯示中被忽略,讀者有興趣的話可以自己分析,文件頭的意義大概如下：
[ti:黑色幽默]標題為黑色幽默
[ar:周杰倫]藝術家為周杰倫
[al:Jap]專輯為JAP
[by:歌詞吾愛http://www.51lrc.com]來源為歌詞吾愛http://www.51lrc.com
[offset:400]筆者不太清楚,大概是緩沖時間為400毫秒吧,有錯的話請指出來。
接著就是讓歌詞顯示在MC中,在預覽圖的歌詞顯示器里,播到哪句歌詞,哪句就會閃爍;點擊一句歌詞,音樂會跳到相應位置。這是怎么做的呢?
首先,每一行字都是一個影片剪輯實例,在庫里是同一影片剪輯.該剪輯有兩幀,第一幀是正常時的狀態(tài),第二幀是音樂播到該歌詞時的狀態(tài)。此外,影片剪輯里還有一按鈕,用于點擊歌詞。
下面就一起做這個MC:
新建一個MC,命名為ITEMBUTTON,在該MC里做一個動態(tài)文本,變量名為caption1,
然后在文本相應的圖層插入一個關鍵幀,改變一下文本的顏色,使音樂播放到該歌詞時有變色的效果.變量名改為caption2.(本來這是多此一舉的事情,但不知為什么,變量名相同的話,第二幀老是顯示不出文字,所以筆者被迫這樣做)。
然后新建一個圖層,在該圖層新建一按鈕,命名為ITEMBUTTON_BUTTON
接著新建一圖層,在第一幀輸入AS：
stop();//以防止兩個狀態(tài)在開始時交替變換.
至此,顯示歌詞的MC單元完成了。
把該MC拖到先前創(chuàng)建的LYRICSITEMS剪輯中.實例名為ITEMBUTTON0,假如你需要顯示N行歌詞,就復制N個,最后就是有N+1個ITEMBUTTON影片剪輯,實例名分別為ITEMBUTTON1,ITEMBUTTON2,...."ITEMBUTTON"+N(為什么是N+1個,在后面會解釋).把這些剪輯按順序從上到下排列好。
當然,這也可以用DUPLICATEMOVIECLIP來實現(xiàn),但是筆者的機器太慢了,導致這樣運行經常出問題,在各位的機里應該不會有此問題(筆者的機:C4,1.0G,內存128MB)
在LRC列表框里,定義一個函數(shù)MOVEUP(因為歌詞向上移動所以就這樣命名該函數(shù)),該函數(shù)要顯示的只是跟時間有關的內容,而且其它內容對歌詞主體播放會有影響,主要是數(shù)據類型不統(tǒng)一。
因為數(shù)組是經過排序的,根據ASCII排列規(guī)則,時間集中在一個區(qū)域(前提是歌詞信息也標準,即變量名不以數(shù)字開頭),這區(qū)域的兩頭都可能有跟時間沒關的信息。
所以顯示前先去掉前面和后面的歌詞信息。
去掉方法，定義兩個變量,STARTING,ENDING,表示歌詞從哪句開始顯示,哪句結束.
在LYRICSITEMS添加一個函數(shù)：
function moveUp(){
var starting
var ending
for (i=0; i>=timeValue.length-1; i++) {//從時間數(shù)組的前面讀起
if (!isNaN(timeValue[i])) {//讀到數(shù)據類型為數(shù)字的時候
starting = i;//表示到了時間的開始
break;//退出循環(huán)
}
}
for (i=timeValue.length-1; i>=0; i--) {//從時間數(shù)組的后面讀起
if (!isNaN(timeValue[i])) {//讀到數(shù)據類型為數(shù)字的時候
ending = i;//表示到了時間的末端
break;//退出循環(huán)
}//第二次循環(huán)也可以從STARTING開始,不過一般來說,從STARTING開始,循環(huán)的次數(shù)要多一些,所以就從TIMEVALUE.LENGTH-1開始往上循環(huán).
}
}
下一步,讓歌詞隨著歌曲的播放而進行高亮顯示(其實就是讓相應歌詞的MC跳到第二幀)
根據TIMEVALUE數(shù)組的值來定位：
比如說:下面是一段歌詞：
[00:15.84]難過 是因為悶了很久
[00:21.18]是因為想了太多
[00:24.91]是心理起了作用
在15秒84和21秒18之間,第一句歌詞處于高亮狀態(tài)
在21秒18和24秒91之間,第二句歌詞處于高亮狀態(tài)
據此定義一變量TEMPPOS定位歌詞.
在MOVEUP函數(shù)里追加：
var pos=_parent.song.position//獲得歌曲當前的位置
for (i=starting; i<=ending; i++) {//從歌詞的時間信息項開始循環(huán)
if (i == ending || pos<=timeValue[i+1]*1000) {//當歌曲的時間處在兩個相鄰時間值之間或者播到末尾,簡單地說就是歌詞時間跟歌曲時間相對應的時候
temppos = i;//獲得要高亮顯示的歌詞的位置
break;//并退出循環(huán)
}
}
預覽圖中,列表所顯示的是高亮歌詞及其上下4句歌詞,這里涉及一個問題,就是該從哪句開始顯示.為此定義一變量STARTPOINT，追加代碼：
var shownum=9;//顯示歌詞的行數(shù),為ITEMBUTTON實例數(shù)目.
var startpoint=temppos-Math.floor(shownum/2);//該數(shù)值使高亮歌詞顯示在列表框中間.
for(var i=0;i<=shownum-1;i++){
this["itembutton"+i].caption1=LyricsText[i+startpoint]
this["itembutton"+i].caption2=this["itembutton"+i].caption1
}//隨著歌曲的播放,重置歌詞的內容.
this["itembutton"+(temppos-startpoint)].gotoAndStop(2)//讓播到的歌詞高亮顯示
this["itembutton"+(temppos-startpoint-1)].gotoAndStop(1);//讓剛才高亮的歌詞恢復原來的狀態(tài)
函數(shù)主要部分是這樣。
讓MOVEUP函數(shù)在歌曲播放時不斷執(zhí)行,以同步顯示歌詞,加入：
this.onEnterFrame=function(){
moveUp()
}
如果大家按著筆者的教程來做,現(xiàn)在基本的效果應該出來了.先測試一下。
出處：藍色理想
責任編輯：moby
上一頁 FLASH打造LRC歌詞播放器 [2] 下一頁 FLASH打造LRC歌詞播放器 [4]
◎進入論壇Flash專欄版塊參加討論
|
第 1 頁 
第 3 頁 FLASH打造LRC歌詞播放器 [3]
