自定义View强势来袭,用自定义View实现歌词显示控件上篇之实现歌词文件解析

已经有两个月时间没有发表新文章了,从开始发表文章以来,常常会有线上的"简友"通过QQ和微信与我进行一些技术上沟通和交流,我也收获良多,几乎每次到最后,我都会厚着脸皮说:"多多关注哦,近期会有新文章要发表呢!"。奈何,每一次当我热情高涨准备在近期发表文章的时候,都因各种各样的事情耽搁了,于是乎,我一次又一次爽约了。的确,最近工作确实比较忙,几乎每一天都需要加班,难得某个周末的下午有点闲暇时间,我都泡在了球场上,热爱篮球是其一,最重要的是做我们这行的,由于工作性质,每周一定的运动是非常必要的,身体是革命的本钱不是嘛! 不过,我可并没有因为忙碌就会在闲暇时候放纵自己,我依然坚持着自己的梦想,我一直在思考分享一些比较受用的功能效果,我也争取把每一个Demo做到最好!

明天就是八月一号了,想着要在八月第一天有一个良好的开头,也就写下了这篇文章。

这次我要向大家分享的是一个歌词控件,其实,也是我毕业设计中的一部分。起初我是用ScrollView嵌套TextView,再结合我的上一篇文章SpannableString来实现的,Demo其实我早早地就将放在github上,不知道有没有朋友有留心看到,但是总感觉用着不是很流畅,而且不容易加入一些自定义内容,所以一直不好下笔,也不好向大家分享Demo。不过,有兴趣的朋友可以看一下(下载地址),个人感觉还是挺有创意的,嘻嘻!(害羞脸~)。

用ScrollView嵌套TextView实现LyricView效果图

效果图是旧版本哦,记住,是旧版本! 通过自定义View实现的"进阶版"LyricView功能更强大,体验效果更佳,能够实现歌词滑动查看,当前播放位置高亮显示,滑动到指定位置并播放等等,总的来说,大致和网易云音乐的歌词显示效果一样。

考虑到歌词显示控件涉及到歌词解析,自定义控件的实现等等诸多方面,可能文章的篇幅上会比较冗长,同时也为了方便"简友"们能够根据自己的需求和爱好各取所需。我也就仿着我之前写的文章《像360悬浮窗那样,用WindowManager实现炫酷的悬浮迷你音乐盒》那样,将"用自定义View实现歌词显示控件"这篇文章也分成上、下两篇,分别是《用自定义View实现歌词显示控件上篇之实现歌词文件解析》《用自定义View实现歌词显示控件下篇之自定义LyricView的实现》。而今天将要分享的是上篇,主要讲解关于*.lrc文件的解析,内容偏理论,所以本章最后我也不会附上Demo,至于下篇我会尽快整理分享出来,届时上下篇的Demo我会整合在一起共享出来。好吧,进入正题:

首先,了解歌词文件的组成

写过音乐播放器的朋友也应该都会去了解过歌词文件的规范格式,既然是歌词显示控件,就必然需要好好了解歌词文件的组成规范,才能准确无误的解析歌词文件,获得与我有用的信息。

[ti:一个人的北京]
[ar:好妹妹乐队]
[al:南北]
[by:]
[offset:0]
[00:00.10]一个人的北京 - 好妹妹乐队
[00:00.20]词:秦昊
[00:00.30]曲:秦昊
[00:00.40]
[00:30.16]你有多久没有看到 满天的繁星
[00:37.34]城市夜晚虚伪的光明 遮住你的眼睛
[00:44.40]连周末的电影 也变得不再有趣
[00:51.71]疲惫的日子里 有太多的问题
[00:59.21]
[01:00.96]你有多久单身一人 不再去旅行
[01:08.20]习惯下班回到家里 冷冰冰的空气
[01:15.58]爱情这东西 你已经不再有勇气
[01:22.64]情歌有多动听 你就有多怀疑
[01:30.60]许多人来来去去 相聚又别离
[01:38.29]也有人喝醉哭泣 在一个人的北京
[01:45.16]也许我成功失意 慢慢的老去
[01:52.76]能不能让我留下片刻的回忆
[01:58.95]
[01:59.67]许多人来来去去 相聚又别离
[02:07.23]也有人匆匆逃离 这一个人的北京
[02:14.30]也许有一天我们 一起离开这里
[02:21.86]离开了这里 在晴朗的天气
[02:28.38]
[02:58.98]你有多久单身一人 不再去旅行
[03:06.36]习惯下班回到家里 冷冰冰的空气
[03:13.55]爱情这东西 你已经不再有勇气
[03:20.69]情歌有多动听 你就有多怀疑
[03:28.53]许多人来来去去 相聚又别离
[03:36.22]也有人喝醉哭泣 在一个人的北京
[03:43.28]也许我成功失意 慢慢的老去
[03:50.82]能不能让我留下片刻的回忆
[03:57.64]许多人来来去去 相聚又别离
[04:05.25]也有人匆匆逃离 这一个人的北京
[04:12.31]也许有一天我们 一起离开这里
[04:19.88]离开了这里 在晴朗的天气
[04:26.62]许多人来来去去 相聚又别离
[04:34.24]也有人匆匆逃离 这一个人的北京
[04:41.37]也许有一天我们 一起离开这里
[04:48.87]离开了这里 在晴朗的天气
[04:55.08]
[04:56.27]让我拥抱你 在晴朗的天气

这如上述文本显示,是我在QQ音乐中下载的歌词文件,并用文本方式打开看到的一个结果。其实,所有歌词文件(*.lrc)都是以一个标准来进行制作的,就如同上述文件一样由以"[ti:"开头的标题、以"[ar:"开头的歌手、以"[al:"开头的专辑、以"[by:"开头的制作、以"[offset:"开头的时间偏移量和以"[mm:ss.ms]"开头的歌词信息组成,歌词信息则是由开始时间(分:秒.毫秒)和歌词内容两部分组成。

接着,解析歌词文件

既然了解了歌词文件的组成部分,那么解析歌词文件也就不是一件困难的事情了,就是简单的文件内容读取:首先获取*.lrc歌词文件的二进制流InputStream,再又转换成字符流(注意:转化成字符流的时候需要选择编码,经过我多次尝试,发现好像QQ音乐的歌词文件需要用"GBK"解码,也不清楚会不会有具体的判别方式,有了解的朋友希望可以在留言区和大伙儿分享),然后再调用BufferedReader的readLine()方法逐行读取文件内容,就能获得文件内容了,在这里有一点需要注意的是,各种流在使用结束后一定要调用close()方法关闭。下面就是实现歌词文件的解析工作:

首先,需要准备两个类主要用于歌词解析结果的缓存:LyricInfo(歌词信息:包含标题、歌手、专辑等等)和LineInfo(歌词行信息:包含行开始时间和歌词行内容):

LyricInfo 歌词文件信息

class LyricInfo {
    List<LineInfo> song_lines;  

    String song_artist;  // 歌手
    String song_title;  // 标题
    String song_album;  // 专辑

    long song_offset;  // 偏移量
}

LineInfo 歌词行信息

class LineInfo {
    String content;  // 歌词内容
    long start;  // 开始时间
}

解析歌词文件源码

/**
 * 初始化歌词信息
 * @param inputStream  歌词文件的流信息
 * */
  private void setupLyricResource(InputStream inputStream, String charsetName) {
    if(inputStream != null) {
        try {
            LyricInfo lyricInfo = new LyricInfo();
            lyricInfo.song_lines = new ArrayList<>();
            InputStreamReader inputStreamReader = new InputStreamReader(inputStream, charsetName);
            BufferedReader reader = new BufferedReader(inputStreamReader);
            String line = null;
            while((line = reader.readLine()) != null) {
                analyzeLyric(lyricInfo, line);
            }
            reader.close();
            inputStream.close();
            inputStreamReader.close();
        } catch (IOException e) {
            e.printStackTrace();
        }
    }
}

 /**
 * 逐行解析歌词内容
 * */
private void analyzeLyric(LyricInfo lyricInfo, String line) {
    int index = line.lastIndexOf("]");
    if(line != null && line.startsWith("[offset:")) {
        // 时间偏移量
        String string = line.substring(8, index).trim();
        lyricInfo.song_offset = Long.parseLong(string);
        return;
    }
    if(line != null && line.startsWith("[ti:")) {
        // title 标题
        String string = line.substring(4, index).trim();
        lyricInfo.song_title = string;
        return;
    }
    if(line != null && line.startsWith("[ar:")) {
        // artist 作者
        String string = line.substring(4, index).trim();
        lyricInfo.song_artist = string;
        return;
    }
    if(line != null && line.startsWith("[al:")) {
        // album 所属专辑
        String string = line.substring(4, index).trim();
        lyricInfo.song_album = string;
        return;
    }
    if(line != null && line.startsWith("[by:")) {
        return;
    }
    if(line != null && index == 9 && line.trim().length() > 10) {
        // 歌词内容
        LineInfo lineInfo = new LineInfo();
        lineInfo.content = line.substring(10, line.length());
        lineInfo.start = measureStartTimeMillis(line.substring(0, 10));
        lyricInfo.song_lines.add(lineInfo);
    }
}


/**
 * 从字符串中获得时间值
 * */
private long measureStartTimeMillis(String str) {
    long minute = Long.parseLong(str.substring(1, 3));
    long second = Long.parseLong(str.substring(4, 6));
    long millisecond = Long.parseLong(str.substring(7, 9));
    return millisecond + second * 1000 + minute * 60 * 1000;
}
最后,验证解析效果

完成歌词解析,接下来就是验证歌词解析的一个实际效果的时候了:

File file = new File(Constant.lyricPath + "一个人的北京 - 好妹妹乐队.lrc");
    if (file != null && file.exists()) {
        try {
            setupLyricResource(new FileInputStream(file), "GBK");
            StringBuffer stringBuffer = new StringBuffer();
            if(lyricInfo != null && lyricInfo.song_lines != null) {
                int size = lyricInfo.song_lines.size();
                for (int i = 0; i < size; i ++) {
                    stringBuffer.append(lyricInfo.song_lines.get(i).content + "\n");
                }
                textView.setText(stringBuffer.toString());
            }
        } catch (FileNotFoundException e) {
            e.printStackTrace();
        }
    }
歌词解析效果图

关于歌词解析的内容到这里就结束了,希望大家能够多多关注哦!

作者申明:如果文中有表述不当或阐述错误的地方,还望正在看文章的您可以帮忙指出,有疑惑也可以在评论区提问或者私信,期待您的意见和建议,欢迎关注交流。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 203,179评论 5 476
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 85,229评论 2 380
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 150,032评论 0 336
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,533评论 1 273
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,531评论 5 365
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,539评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,916评论 3 395
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,574评论 0 256
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,813评论 1 296
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,568评论 2 320
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,654评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,354评论 4 318
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,937评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,918评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,152评论 1 259
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,852评论 2 349
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,378评论 2 342

推荐阅读更多精彩内容