梦回AS2纯代码卡拉OK效果同步歌词条MP3列表播放器附源码下载.docx
- 文档编号:17538736
- 上传时间:2023-07-26
- 格式:DOCX
- 页数:16
- 大小:21.29KB
梦回AS2纯代码卡拉OK效果同步歌词条MP3列表播放器附源码下载.docx
《梦回AS2纯代码卡拉OK效果同步歌词条MP3列表播放器附源码下载.docx》由会员分享,可在线阅读,更多相关《梦回AS2纯代码卡拉OK效果同步歌词条MP3列表播放器附源码下载.docx(16页珍藏版)》请在冰点文库上搜索。
梦回AS2纯代码卡拉OK效果同步歌词条MP3列表播放器附源码下载
梦回AS2纯代码卡拉OK效果同步歌词条MP3列表播放器[附源码下载]
梦回AS2纯代码卡拉OK动态歌词同步配图MP3播放器(附源码下载)栏目:
代码开发交流分类:
AS开发
关键字:
AS2,纯代码,MP3播放器,歌词同步,源码
一、功能简介:
这个由AS2纯代码实现的单行卡拉OK风格歌词同步MP3多曲播放器,除了播放音乐,同步显示LRC歌词的基本功能之外;最富特色的莫过于它能让歌词字条从左到右渐显推入,然后又继续向右渐隐淡出;它还可以在XML列表中为每个MP3指定一张背景图片,播放MP3时能同步进行更换;另外,全屏显示并自动适应屏幕大小、开关歌词条的水平运动动画效果、为歌词条添加或和移除倒角投影滤镜以改变其视觉效果、控制MP3的播放暂停和曲目切换,等等,也是它的实用功能。
二、技术要点:
《梦回AS2纯代码卡拉OK动态歌词同步配图MP3播放器》仅有244行代码(其中包含11行注释)。
但“麻雀虽小,五脏俱全”,它综合应用了多种实用的AS2开发技术:
1、屏幕尺寸大小自动适应:
侦听舞台尺寸变化,让LRC同步歌词显示条始终位于舞台正下方,播放控制条始终位于舞台右下方,MP3配图始终垂直顶对齐,高度始终等于舞台高度-100像素,宽度以高度为标准比例缩放,水平居中对齐; 2、用AS2代码创建右键菜单; 3、用AS2代码创建动态文本框、并使用TextFormat类设置文本格式; 4、用AS2代码在舞台上创建影片剪辑元件并添加倒角和投影滤镜; 5、用AS2代码流式加载MP3文件并控制其播放暂停; 6、用AS2代码为动态文本框设置HTML格式文本,并使用asfunction协议通过其中的链接,调用函数; 7、用AS2代码加载并解析外部XML文件,获取其节点上自定义属性的值; 8、用AS2代码加载并解析外部LRC文件,用字符串拆分的方法将其中包含的时间标签和对应的歌词句子存贮到两个数组中; 9、用AS2代码的MovieClipLoader类加载外部图片文件,并为其添加侦听器; 10、用AS2代码的BitmapData类平滑加载进来的图片,令其在缩放之后不产生马赛克效果; 11、用AS2代码的Tween类,在图片加载完毕时为其添加淡入动画效果; 12、用AS2代码的setInterval+updateAfterEvent()实现不依赖帧频的高频率渲染,让卡拉OK风格的LRC同步歌词条进度动画更加细腻平滑。
三、算法特色:
1、独创的简洁高效的LRC文本的解析方法:
使用的LRC解析算法是自己根据对LRC文件的分析编写的,使用2个FOR循环嵌套,外层解析LRC文本行,内层解析一行中的所有时间标签。
支持一行多时间标签的LRC文件,支持精确到秒和毫秒两种LRC规格。
LRC解析过程总代码仅21行,如下所示:
-折叠[运行代码] [另存为网页] [拷贝到剪贴板]varlrcItem:
Array;
vardivsign:
String="|||";
functionparseLRC(lrcStr){
lrcItem=[];
varlrcLine:
Array=lrcStr.split("\n");
for(vark:
Number=0;k<lrcLine.length;k++){
for(varj:
Number=0;j<1000;j++){
varsubpos:
Number=lrcLine[k].indexOf("]");
if(subpos<0){
break;
}else{
varcurTimeTag:
String=lrcLine[k].slice(1,subpos);
curTimeTag.length==5?
curTimeTag+=".00":
null;
lrcItem[lrcItem.length]=curTimeTag+divsign+lrcLine[k].slice(lrcLine[k].lastIndexOf("]")+1);
lrcItem[lrcItem.length-1]=lrcItem[lrcItem.length-1].split("\r").join("").split("\n").join("");
lrcLine[k]=lrcLine[k].slice(subpos+1);
}
}
}
lrcItem.sort();
}
LRC原文件内容:
[ti:
我们站在雨中]
[ar:
]
[al:
我们站在雨中]
[by:
LRC制作者]
[00:
03.25]《我们站在雨中》
[00:
08.68]连城诀吴越版主题歌曲
[00:
16.54]把双眼紧闭,剑要往哪里刺去
[00:
24.97]谁说秋风最能懂落叶思绪
[00:
32.21]致命的一击,真的对手是自己
[00:
40.24]只剩下了无声的叹息
[00:
48.69]酒逢知己,千杯也难尽兴
[00:
56.27]英雄醉了也一样的慢慢倒下去
[01:
04.45]望星辰转移,江湖又下起暴雨
[01:
12.51]我们都站在雨里
[01:
52.46][01:
20.49]穿过刀光剑影之后,我还是那个我
[02:
00.74][01:
28.45]只是把受伤的心独自对着明月说
[02:
08.38][01:
36.77]天涯的尽头有没有一处安静的角落
[02:
16.57][01:
44.70]让浪迹的人在走累的时候躲一躲
[02:
31.80][00:
12.40]解析之后输出的结果:
00:
03.25|||《我们站在雨中》
00:
08.68|||连城诀吴越版主题歌曲
00:
12.40|||
00:
16.54|||把双眼紧闭,剑要往哪里刺去
00:
24.97|||谁说秋风最能懂落叶思绪
00:
32.21|||致命的一击,真的对手是自己
00:
40.24|||只剩下了无声的叹息
00:
48.69|||酒逢知己,千杯也难尽兴
00:
56.27|||英雄醉了也一样的慢慢倒下去
01:
04.45|||望星辰转移,江湖又下起暴雨
01:
12.51|||我们都站在雨里
01:
20.49|||穿过刀光剑影之后,我还是那个我
01:
28.45|||只是把受伤的心独自对着明月说
01:
36.77|||天涯的尽头有没有一处安静的角落
01:
44.70|||让浪迹的人在走累的时候躲一躲
01:
52.46|||穿过刀光剑影之后,我还是那个我
02:
00.74|||只是把受伤的心独自对着明月说
02:
08.38|||天涯的尽头有没有一处安静的角落
02:
16.57|||让浪迹的人在走累的时候躲一躲
02:
31.80|||
al:
我们站在雨中|||
ar:
|||
by:
LRC制作者|||
ti:
我们站在雨中|||2、LRC句子时间点与MP3播放时间的对比用字符串对比方式实现:
与网上其他开发者制作歌词同步时用的LRC时间数组与播放时间的对比方式不同,我不比时间,而是比字符串,即把当前播放时间转换成字符串再和LRC时间数组中的字符串相对比,从而实现到时换句从上面的代码中可以看出,时间标签只保留了前面七个字符,也就是精确到0.1秒,这是为了降低对比的频率以降低CPU使用率,精确到0.1秒已经完全足够了,因为相邻两句歌词的时间间隔绝对不可能小于0.1秒。
两次比较的时间间隔我设置为了30毫秒,也就是说确保时间头经过每一个LRC时间点时都会执行至少三次对比,以确保不会漏句跳句。
很低的CPU占用率(测试环境:
2.4G单核赛扬四CPU)
3、制作歌词条卡拉OK进度效果不用遮罩,而是直接设置本底文本框的自动对齐属性(autoSize)和高亮文本框的宽度:
看到网上其他人的LRC歌词同步MP3播放器作品,几乎都是用的遮罩的方法来做卡拉OK的进度效果的,而我做的水平文字的LRC同步播放器完全不用遮罩(除了竖式的必须使用遮罩以外,见下图:
) 水平文字卡拉OK风格歌词条的进度实现,我使用的是直接设置本底文本框的自动对齐属性(autoSize)和高亮文本框的宽度的方法。
使用这种技术有一点要注意:
滤镜一定不要加在文本框上,而是要将文本框放入一个剪辑,滤镜只能加到剪辑上。
四、MP3播放列表XML文件的结构:
-折叠[运行代码(可先修改)] [另存为网页] [拷贝到剪贴板]五、《梦回AS2纯代码卡拉OK动态歌词同步配图MP3播放器》全部AS2代码:
/*****************第一部分:
系统参数设置、显示尺寸及模式、右键菜单功能****************/-折叠[运行代码] [另存为网页] [拷贝到剪贴板]/*****************第一部分:
系统参数设置、显示尺寸及模式、右键菜单功能****************/
System.useCodepage=false;
Stage.scaleMode="NoScale";
Stage.align="LT";
varstageResizeListener:
Object=newObject();
stageResizeListener.onResize=fitmodels;
functionfitmodels(){
lrcBar._x=Stage.width/2-350;
lrcBar._y=Stage.height-100;
mp3Cap._x=Stage.width-mp3Cap._width;
mp3Cap._y=Stage.height-35;
if(mp3Img._width){
mp3Img._height=Stage.height-100;
mp3Img._xscale=mp3Img._yscale;
mp3Img._x=(Stage.width-mp3Img._width)/2;
}
}
Stage.addListener(stageResizeListener);
functionswitchDisplayMode(){
Stage["displayState"]=="normal"?
Stage["displayState"]="fullScreen":
Stage["displayState"]="normal";
}
functionauthorHomePage(){
System.setClipboard("
getURL(""_blank");
}
functionauthorQQTalk(){
System.setClipboard("
getURL(""_blank");
}
varrightMenu:
ContextMenu=newContextMenu();
rightMenu.hideBuiltInItems();
rightMenu.customItems.push(newContextMenuItem("□全屏显示/返回窗口",switchDisplayMode,true,true,true));
rightMenu.customItems.push(newContextMenuItem("○一叶扁舟(梦回轻狂)2013.08.18,QQ:
744123372",authorQQTalk,true,true,true));
rightMenu.customItems.push(newContextMenuItem("⊙一叶梦回XML-LRC单行卡拉OK风格歌词同步MP3列表播放器(一曲一图+全屏自适应)",authorHomePage,true,true,true));
this.menu=rightMenu;
/*****************第二部分:
解析LRC文件的功能****************/-折叠[运行代码] [另存为网页] [拷贝到剪贴板]/*****************第二部分:
解析LRC文件的功能****************/
varlrcItem:
Array;
vardivsign:
String="|||";
functionparseLRC(lrcStr){
lrcItem=[];
varlrcLine:
Array=lrcStr.split("\n");
for(vark:
Number=0;k<lrcLine.length;k++){
for(varj:
Number=0;j<1000;j++){
varsubpos:
Number=lrcLine[k].indexOf("]");
if(subpos<0){
break;
}else{
varcurTimeTag:
String=lrcLine[k].slice(1,subpos);
curTimeTag.length==5?
curTimeTag+=".00":
null;
lrcItem[lrcItem.length]=curTimeTag+divsign+lrcLine[k].slice(lrcLine[k].lastIndexOf("]")+1);
lrcItem[lrcItem.length-1]=lrcItem[lrcItem.length-1].split("\r").join("").split("\n").join("");
lrcLine[k]=lrcLine[k].slice(subpos+1);
}
}
}
lrcItem.sort();
}
/*****************第三部分:
显示LRC歌词的功能****************/-折叠[运行代码] [另存为网页] [拷贝到剪贴板]/*****************第三部分:
显示LRC歌词的功能****************/
importflash.filters.BevelFilter;
varlrcBarBevelFilter:
BevelFilter=newBevelFilter
(1);
importflash.filters.DropShadowFilter;
varlrcBarDropShadowFilter:
DropShadowFilter=newDropShadowFilter
(1);
lrcBarDropShadowFilter.blurX=lrcBarDropShadowFilter.blurY=3;
varlrcTextFomart:
TextFormat=newTextFormat();
lrcTextFomart.size=28;
lrcTextFomart.bold=true;
//lrcTextFomart.font="楷体";
varcurLrcId:
Number;
varlrcHander:
Number;
functiongetTimeMS(timeStr:
String):
Number{
return(Number(timeStr.split(":
")[0])*60+Number(timeStr.split(":
")[1])+Number(timeStr.split(".")[1])/10)*1000;
}
functiongetTimeStr(theTime:
Number):
String{
varsec=Math.floor(theTime/1000)%60;
sec<10?
sec="0"+sec:
null;
varmin=Math.floor(Math.floor(theTime/1000)/60);
min<10?
min="0"+min:
null;
returnmin+":
"+sec;
}
varsecondPos:
String;
varklokStepLong:
Number;
varlrcMotionMode:
Boolean=true;
varlrcBarFilterMode:
Boolean=true;
functionupdateLrcBar(){
varcurTime:
Number=mp3Sound.position+300;
varmp3Time:
String=getTimeStr(curTime);
if(secondPos!
=mp3Time){
secondPos=mp3Time;
mp3Cap.htmlText="<b><fontcolor='#ff0000'>"+mp3Time+"/"+getTimeStr(mp3Sound.duration/(mp3Sound.getBytesLoaded()/mp3Sound.getBytesTotal()))+"</font></b> "+mp3CtrlHtml;
}
mp3Time+="."+String(curTime).slice(String(curTime).length-3,String(curTime).length-2);
//for(vari:
Number=curLrcId+1;i<curLrcId+5;i++){
for(vari:
Number=curLrcId+1;i<lrcItem.length;i++){
if(lrcItem[i].slice(0,7)==mp3Time){
curLrcId=i;
break;
}
}
if(lrcBar.lrcBase.lrcText.text!
=lrcItem[curLrcId].split(divsign)[1]&&lrcBar._alpha>0){
lrcBar._alpha-=10;
lrcMotionMode==true?
lrcBar.lrcBase._x=lrcBar.lrcOver._x=Math.ceil((100-lrcBar._alpha)/10)/10*lrcBar.lrcBase.lrcText._width*1.5:
null;
}elseif(lrcBar.lrcBase.lrcText.text==lrcItem[curLrcId].split(divsign)[1]&&lrcBar._alpha<100){
lrcBar._alpha+=10;
lrcMotionMode==true?
lrcBar.lrcBase._x=lrcBar.lrcOver._x=-Math.ceil((100-lrcBar._alpha)/10)/10*lrcBar.lrcBase.lrcText._width*1.5:
null;
}elseif(lrcBar._alpha<=0){
lrcBar.lrcBase._x=lrcBar.lrcOver._x=0;
curLrcId>=0?
setLrcText():
null;
}
lrcBar.lrcOver.lrcText._width<lrcBar.lrcBase.lrcText._width?
lrcBar.lrcOver.lrcText._width+=klokStepLong:
lrcBar.lrcOver.lrcText._width=lrcBar.lrcBase.lrcText._width;
//lrcBar.lrcOver.lrcText._width<lrcBar.lrcBase.lrcText._width?
lrcBar.lrcOver.lrcText._width=lrcBar.lrcBase.lrcText._width*((getTimeMS(mp3Time)-getTimeMS(lrcItem[curLrcId].slice(0,7)))/(getTimeMS(lrcItem[curLrcId+1].slice(0,7))-getTimeMS(lrcItem[curLrcId].slice(0,7)))):
lrcBar.lrcOver.lrcText._width=lrcBar.lrcBase.lrcText._width;
updateAfterEvent();
}
functionsetLrcText(){
lrcBar.lrcBase.lrcText.text=lrcBar.lrcOver.lrcText.text=lrcItem[curLrcId].split(divsign)[1];
lrcBar.lrcBase.lrcText.setTextFormat(lrcTextFomart);
lrcBar.lrcOver.lrcText.setTextFormat(lrcTextFomart);
lrcBar.lrcOver.lrcText._x=lrcBar.lrcBase.lrcText._x;
lrcBar.lrcOver.lrcText._width=0;
klokStepLong=lrcBar.lrcBase.lrcText._width/((getTimeMS(lrcItem[curLrcId+1].slice(0,7))-getTimeMS(lrcItem[curLrcId].slice(0,7)))/(Stage["displayState"]=="fullScreen"?
50:
45));
}
functionswitchFilterMode(){
if(lrcBarFilterMode==true){
lrcBarFilterMode=false;
lrcBar.filters=[];
}else{
lrcBarFilterMode=true;
lrcBar.filters=[lrcBarBevelFilter,lrcBarDropShadowFilter];
}
}
functionswitchMotionMode(){
lrcMotionMode=!
lrcMotionMode;
}
/*****************第四部分:
加载LRC文件的功能****************/-折叠[运行代码] [另存为网页] [拷贝到剪贴板]/*****************第四部分:
加载LRC文件的功能****************/
varlrcLo
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 梦回 AS2 代码 卡拉 OK 效果 同步歌词 MP3 列表 播放 源码 下载