Android自定义View实战：简约风歌词控件

作者:jsyjst

前言

最近重构了之前的音乐播放器，添加了许多功能，比如歌词，下载功能等。这篇文章就让我们聊聊歌词控件的实现，先上效果图，如果感觉海星，就继续瞧下去！

看到这里，估计你对这个控件还有点感兴趣的吧，那接下来就让我们来瞧瞧实现这个歌词控件需要做些什么！

一、 歌词解析

首先，我们得知道正常的歌词格式是怎样的，大概是长这个样子：

 1[ti:喜欢你]
 2[ar:.]
 3[al:]
 4[by:]
 5[offset:0]
 6[00:00.10]喜欢你 - G.E.M. 邓紫棋 (Gem Tang)
 7[00:00.20]词：黄家驹
 8[00:00.30]曲：黄家驹
 9[00:00.40]编曲：Lupo Groinig
10[00:00.50]
11[00:12.65]细雨带风湿透黄昏的街道
12[00:18.61]抹去雨水双眼无故地仰望
13[00:24.04]望向孤单的晚灯
14[00:26.91]
15[00:27.44]是那伤感的记忆
16[00:30.52]
17[00:34.12]再次泛起心里无数的思念
18[00:39.28]
19[00:40.10]以往片刻欢笑仍挂在脸上
20[00:45.49]愿你此刻可会知
21[00:48.23]
22[00:48.95]是我衷心的说声
23[00:53.06]
24[00:54.35]喜欢你 那双眼动人
25[00:59.35]
26[01:00.10]笑声更迷人
27[01:02.37]
28[01:03.15]愿再可 轻抚你
29[01:08.56]
30[01:09.35]那可爱面容
31[01:12.40]挽手说梦话
32[01:14.78]
33[01:15.48]像昨天 你共我
34[01:20.84]
35[01:26.32]满带理想的我曾经多冲动
36[01:32.45]屡怨与她相爱难有自由
37[01:37.82]愿你此刻可会知
38[01:40.40]
39[01:41.25]是我衷心的说声
40[01:44.81]
41[01:46.39]喜欢你 那双眼动人
42[01:51.72]
43[01:52.42]笑声更迷人
44[01:54.75]
45[01:55.48]愿再可 轻抚你
46[02:00.93]
47[02:01.68]那可爱面容
48[02:03.99]
49[02:04.73]挽手说梦话
50[02:07.13]
51[02:07.82]像昨天 你共我
52[02:14.53]
53[02:25.54]每晚夜里自我独行
54[02:29.30]随处荡 多冰冷
55[02:35.40]
56[02:37.83]以往为了自我挣扎
57[02:41.62]从不知 她的痛苦
58[02:52.02]
59[02:54.11]喜欢你 那双眼动人
60[03:00.13]笑声更迷人
61[03:02.38]
62[03:03.14]愿再可 轻抚你
63[03:08.77]
64[03:09.33]那可爱面容
65[03:11.71]
66[03:12.41]挽手说梦话
67[03:14.61]
68[03:15.45]像昨天 你共我

从上面可以看出这种格式前面是开始时间，从左往右一一对应分，秒，毫秒，后面就是歌词。所以我们要创建一个实体类来保存每一句的歌词信息。

1.歌词实体类LrcBean

 1public class LrcBean {
 2    private String lrc;//歌词
 3    private long start;//开始时间
 4    private long end;//结束时间
 5
 6    public String getLrc() {
 7        return lrc;
 8    }
 9
10    public void setLrc(String lrc) {
11        this.lrc = lrc;
12    }
13
14    public long getStart() {
15        return start;
16    }
17
18    public void setStart(long start) {
19        this.start = start;
20    }
21
22    public long getEnd() {
23        return end;
24    }
25
26    public void setEnd(long end) {
27        this.end = end;
28    }
29}

每句歌词，我们需要开始时间，结束时间和歌词这些信息，那么你就会有疑问了？上面提到的歌词格式好像只有歌词开始时间，那我们怎么知道结束时间呢？其实很简单，这一句歌词的开始时间就是上一句歌词的结束时间。有了歌词实体类，我们就得开始对歌词进行解析了！

2. 解析歌词工具类LrcUtil

 1public class LrcUtil {
 2
 3    /**
 4     * 解析歌词，将字符串歌词封装成LrcBean的集合
 5     * @param lrcStr 字符串的歌词，歌词有固定的格式，一般为
 6     * [ti:喜欢你]
 7     * [ar:.]
 8     * [al:]
 9     * [by:]
10     * [offset:0]
11     * [00:00.10]喜欢你 - G.E.M. 邓紫棋 (Gem Tang)
12     * [00:00.20]词：黄家驹
13     * [00:00.30]曲：黄家驹
14     * [00:00.40]编曲：Lupo Groinig
15     * @return 歌词集合
16     */
17    public static List<LrcBean> parseStr2List(String lrcStr){
18        List<LrcBean> res = new ArrayList<>();
19        //根据转行字符对字符串进行分割
20        String[] subLrc = lrcStr.split("\n");
21        //跳过前四行，从第五行开始，因为前四行的歌词我们并不需要
22