FLASH制造LRC歌词播放器教程
日期：2013-12-17 浏览次数：20981 次
自WINAMP出了个迷你歌词当前,笔者不断心里痒痒的,想找个时间本人也做一个.
如今做好了,大家先预览一下效果.
测试地址一
asp5.6to23.com/7years/yiyuan7years/HBrO/Player/mp3player_x1.swf
测试地址二
download.incoo.com/blueidea/hbro/player/mp3player_x1.swf
其中歌词就是如今标准的WINAMP的LRC文件,从别处下载的,没作任何修正,
就是说,这个播放器可以用于播放WINAMP格式的LRC文件.
该播放器的新功用:点击歌词后可以让歌曲跳转到相应的位置
一个小BUG:由于采用声音流加载,所以网速慢的话,播放起来不太流畅.
接着我会写教程,之前先给大家引见里头次要使用的AS技术:
1用XML对象的TOSTRING方法
2数组的常用途理方法.
3少量的字符串函数.
4声音对象的属性和事件.
笔者将在接下来的时间里帖上具体的制造方法
该播放器分为三部分:
1记录音乐文件路径的播放列表
2控制音乐文件播放的控制区
3显示歌词的歌词播放器
前两部分是经典MP3播放器所具备的.而且笔者不得不承认本人做得不如别人,再加上相关的教程也很容易找,所以这里只引见歌词播放部分的制造.
由于播放歌词是跟音乐同步的,所以,制造播放器,需求三类文件:
1SWF格式的播放器,这是我们要做的
2音乐文件MP3,置信大家都能下载到吧
3歌词文件LRC,是WINAMP格式的歌词文件,可以到WINAMP的主页下载,也可以到下面的站点下:
www.rixiu.com/
文件预备好了,下一步就是把文件置于适当的位置.
在本地硬盘新建一个文件夹Player,在里头建立两个文件夹Sound,Lyrics,和FLASH文档PLAYER.FLA.Sound文件夹放入1.MP3,Lyrics放入文件1.LRC
下面开始制造FLASH文件:
打开刚才创建的FLASH,在主场景第一帧输入AS:
声音文件需求SOUND对象作为容器,同样,歌词文件也需求一个容器.但是FLASH没有内置的歌词对象,所以就要本人创建.
在预览图里,我们所看到的显示歌词的"列表框"就是LRC文件的容器.下面将开始创建.
在主场景里创建一个MC,命名为lyricsItems,实例名相反.
创建了这个容器后,就可以用它来做读取LRC文件的操作了.
所以,在声音加载的同时,我们可以用它来读歌词文件
在第一帧添加AS:
在第一帧输入AS:
第一步,先让LRC文件读进FLASH.
也许大家会觉得奇怪,FLASH能读LRC文件吗?
大家不妨先用记事本打开LRC文件,发现它其实是个文本文档.
对于文本文档,其实FLASH的XML对象是可以读到的.
笔者曾经把一个错误的XML文件用XML对象读取,发现XML对象的很多方法都调用失败,可是TOSTRING方法却可以,前往的是跟文本文档内容一样的字符串(只要部分HTML字符发生了本义),也就是说,用XML对象可以把LRC文件全部读到FLASH里.
在loadLyrics函数里加入下面代码:
下面就是分析LRC文件的结构,从里头提取我们需求的信息
标准歌词文件范例:
[ti:黑色幽默]
[ar:周杰伦]
[al:Jap]
[by:歌词吾爱http://www.51lrc.com]
[offset:400]
[00:02.00]词/曲:周杰伦
[00:05.49]歌词吾爱
[00:09.48]http://www.51lrc.com
[00:15.84]难过 是由于闷了很久
[00:21.18]是由于想了太多
[00:24.91]是心思起了作用
[00:30.89]你说 苦笑常常陪着你
[00:36.13]在一同有点勉强
[00:39.83]该不该如今休了我
[02:45.62][00:44.86]不想太多
[02:47.71][00:47.41]我想一定是我听错弄错搞错
[02:53.55][00:53.28]拜托 我想是你的脑袋有问题
[03:00.53][01:00.11]随便说说
[03:04.49][01:02.47]其实我早曾经猜透看透不想多说
[03:12.19][01:09.94]只是我怕眼泪撑不住
[03:16.31][01:15.77]不懂 你的黑色幽默
[03:23.51][01:23.25]想通 却又再考倒我
[03:30.61][01:30.63]说散 你想很久了吧?
[03:37.92][01:37.72]我不想拆穿你
[03:46.16][01:45.85]当作 是你开的玩笑
[03:53.54][01:53.22]想通 却又再考倒我
[04:16.74][04:01.06][02:00.76]说散 你想很久了吧?
[04:23.15]我的认真败给黑色幽默
结构分析:
1文件头是记录歌词信息的文字
下面就是时间跟歌词内容的信息了.
2每一行都是由一到几个用中括号标记的时间值及该时间要显示的歌词内容组成.
如:
[04:07.94][02:07.79]败给你的黑色幽默
代表在2分7秒79跟4分7秒94都显示"败给你的黑色幽默"这句歌词.
了解了LRC文件的结构后,就可以利用AS强大的字符串处理功用,把里头包含的一些变量值提取出来.
如今做好了,大家先预览一下效果.
测试地址一
asp5.6to23.com/7years/yiyuan7years/HBrO/Player/mp3player_x1.swf
测试地址二
download.incoo.com/blueidea/hbro/player/mp3player_x1.swf
其中歌词就是如今标准的WINAMP的LRC文件,从别处下载的,没作任何修正,
就是说,这个播放器可以用于播放WINAMP格式的LRC文件.
该播放器的新功用:点击歌词后可以让歌曲跳转到相应的位置
一个小BUG:由于采用声音流加载,所以网速慢的话,播放起来不太流畅.
接着我会写教程,之前先给大家引见里头次要使用的AS技术:
1用XML对象的TOSTRING方法
2数组的常用途理方法.
3少量的字符串函数.
4声音对象的属性和事件.
笔者将在接下来的时间里帖上具体的制造方法
该播放器分为三部分:
1记录音乐文件路径的播放列表
2控制音乐文件播放的控制区
3显示歌词的歌词播放器
前两部分是经典MP3播放器所具备的.而且笔者不得不承认本人做得不如别人,再加上相关的教程也很容易找,所以这里只引见歌词播放部分的制造.
由于播放歌词是跟音乐同步的,所以,制造播放器,需求三类文件:
1SWF格式的播放器,这是我们要做的
2音乐文件MP3,置信大家都能下载到吧
3歌词文件LRC,是WINAMP格式的歌词文件,可以到WINAMP的主页下载,也可以到下面的站点下:
www.rixiu.com/
文件预备好了,下一步就是把文件置于适当的位置.
在本地硬盘新建一个文件夹Player,在里头建立两个文件夹Sound,Lyrics,和FLASH文档PLAYER.FLA.Sound文件夹放入1.MP3,Lyrics放入文件1.LRC
下面开始制造FLASH文件:
打开刚才创建的FLASH,在主场景第一帧输入AS:
var song=new Sound();//创建加载声音的对象
song.loadSound("Sound/1.mp3",true)//以数据流的方式读取声音文件.如要事件声音,把TRUE改为FALSE;
song.start(0,1)//从头开始播放声音,循环1次.
以上是载入MP3文件的代码,下面载入的LRC文件跟其同步.song.loadSound("Sound/1.mp3",true)//以数据流的方式读取声音文件.如要事件声音,把TRUE改为FALSE;
song.start(0,1)//从头开始播放声音,循环1次.
声音文件需求SOUND对象作为容器,同样,歌词文件也需求一个容器.但是FLASH没有内置的歌词对象,所以就要本人创建.
在预览图里,我们所看到的显示歌词的"列表框"就是LRC文件的容器.下面将开始创建.
在主场景里创建一个MC,命名为lyricsItems,实例名相反.
创建了这个容器后,就可以用它来做读取LRC文件的操作了.
所以,在声音加载的同时,我们可以用它来读歌词文件
在第一帧添加AS:
song.onLoad=function(){
lyricsItems.loadLyrics("Lyrics/1.lrc")//该函数将在lyricsItems里定义.
}
进入lyricsItems的编辑区.lyricsItems.loadLyrics("Lyrics/1.lrc")//该函数将在lyricsItems里定义.
}
在第一帧输入AS:
function (filepath){
}
这样就定义了读歌词的函数.}
第一步,先让LRC文件读进FLASH.
也许大家会觉得奇怪,FLASH能读LRC文件吗?
大家不妨先用记事本打开LRC文件,发现它其实是个文本文档.
对于文本文档,其实FLASH的XML对象是可以读到的.
笔者曾经把一个错误的XML文件用XML对象读取,发现XML对象的很多方法都调用失败,可是TOSTRING方法却可以,前往的是跟文本文档内容一样的字符串(只要部分HTML字符发生了本义),也就是说,用XML对象可以把LRC文件全部读到FLASH里.
在loadLyrics函数里加入下面代码:
var lyrics=new XML()
lyrics.load("Lyrics/1.lrc")
lyrics.onLoad=function(){
lyricsString=lyrics.toString()
trace(lyricsString)
}
测试影片,你会发现整个文本文档被读到了lyricsString里面.lyrics.load("Lyrics/1.lrc")
lyrics.onLoad=function(){
lyricsString=lyrics.toString()
trace(lyricsString)
}
下面就是分析LRC文件的结构,从里头提取我们需求的信息
标准歌词文件范例:
[ti:黑色幽默]
[ar:周杰伦]
[al:Jap]
[by:歌词吾爱http://www.51lrc.com]
[offset:400]
[00:02.00]词/曲:周杰伦
[00:05.49]歌词吾爱
[00:09.48]http://www.51lrc.com
[00:15.84]难过 是由于闷了很久
[00:21.18]是由于想了太多
[00:24.91]是心思起了作用
[00:30.89]你说 苦笑常常陪着你
[00:36.13]在一同有点勉强
[00:39.83]该不该如今休了我
[02:45.62][00:44.86]不想太多
[02:47.71][00:47.41]我想一定是我听错弄错搞错
[02:53.55][00:53.28]拜托 我想是你的脑袋有问题
[03:00.53][01:00.11]随便说说
[03:04.49][01:02.47]其实我早曾经猜透看透不想多说
[03:12.19][01:09.94]只是我怕眼泪撑不住
[03:16.31][01:15.77]不懂 你的黑色幽默
[03:23.51][01:23.25]想通 却又再考倒我
[03:30.61][01:30.63]说散 你想很久了吧?
[03:37.92][01:37.72]我不想拆穿你
[03:46.16][01:45.85]当作 是你开的玩笑
[03:53.54][01:53.22]想通 却又再考倒我
[04:16.74][04:01.06][02:00.76]说散 你想很久了吧?
[04:23.15]我的认真败给黑色幽默
结构分析:
1文件头是记录歌词信息的文字
下面就是时间跟歌词内容的信息了.
2每一行都是由一到几个用中括号标记的时间值及该时间要显示的歌词内容组成.
如:
[04:07.94][02:07.79]败给你的黑色幽默
代表在2分7秒79跟4分7秒94都显示"败给你的黑色幽默"这句歌词.
了解了LRC文件的结构后,就可以利用AS强大的字符串处理功用,把里头包含的一些变量值提取出来.
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
