网易云信提供歌词组件（NELyricKit），实现歌曲播放的同时，同步解析并显示歌词。根据歌词文件的类型，分为逐行展示和逐字展示两种模式。

功能介绍

歌词组件包括歌词解析和歌词 UI 两个模块，您可以根据您的需要选择选择集成含 UI 或 不含 UI。

歌词组件的业务触发逻辑如下图所示。

前提条件

请确认您已完成以下操作：

• 已创建应用并获取 App Key
• 已开通曲库能力
• 已集成曲库 SDK

实现歌词展示与同步（含 UI）

1. 导入歌词解析模块以及歌词 UI 展示模块

   1. 在 Podfile 文件中添加类似如下命令导入目标文件。

   pod 'NELyricUIKit'
   

   2. 打开终端，在 Podfile 所在文件夹中执行如下命令进行安装：

   pod install
   

2. 初始化歌词解析模块

/// NELyricTypeYrc yrc格式
/// NELyricTypeQrc qrc格式
NELyric *model = [[NELyric alloc] initWithContent:content andType:NELyricTypeYrc];

3. 初始化UI模块

/// 初始化歌词view
NELyricView *lyricView = [[NELyricView alloc] initWithFrame:self.frame type:NELyricViewTypeLyric];
/// 设置歌词解析模块
[lyricView loadWithLyricModel:model];

4. 设置整首歌的 UI。
   1. 遍历 NELyric 的行对象模型 lineModels， 调用 asynLayoutSizeWithMaxSize 接口传入最大行宽度，提前计算好 models 的布局信息。
   2. 根据 NELyric 进行初始化NELyricView 。相关参数说明如下：

接口/属性	说明
foregroundView	文本显示层的设置。 通过改变歌词的字体大小和颜色，可以实现逐字歌词的效果。
backgroundView	背景
foregroundFont	显示文本的font
timeForCurrent	当前时间回调
initWithFrame	初始化
seekToMove	调整位置
loadWithLyricModel	设置歌词模型，包括逐行显示或逐字显示两种模型。
update	刷新歌词

5. 房主在加入房间后，开始播放伴奏之后，将会触发伴音文件播放进度回调，在回调中调用 NELyricView 的 update 接口，并在 NELyricView 的 timeForCurrent block 中传入当前的时间戳信息。
6. 观众在加入房间后将会收到主播发来的SEI信息，SEI信息代表着主播当前的播放进度，在收到SEI的回调函数中关注调用 NELyricView 的 update 接口，并在 NELyricView 的 timeForCurrent block 中传入当前的时间戳信息。

示例代码

lyricView.timeForCurrent = ^NSInteger{
    return self.time;
    };

- (void)onAudioMixingTimestampUpdate:(uint64_t)timeStampMS {
    [lyricView update];
    self.time = timeStampMS;
}

如果想自己控制 UI 刷新的频率，可以自己实现定时器来调用 lyricView 的 update 接口，只需要在 timeForCurrent 中返回精度更高的时间。

实现歌词展示与同步（不含 UI）

1. 初始化歌词解析模块

/// NELyricTypeYrc yrc格式
/// NELyricTypeQrc qrc格式
NELyric *model = [[NELyric alloc] initWithContent:content andType:NELyricTypeYrc];

2. 房主在加入房间后，开始播放伴奏之后，将会触发伴音文件播放进度回调，回调中携带当前的播放进度。
3. 观众在加入房间后将会收到主播发来的SEI信息，SEI信息代表着主播当前的播放进度，。
4. 同步更新歌词进度。

   1. 根据回调的时间戳，在 NELyric 的 lineModels 中找到对应行。

   2. 如果是逐字歌词，则再从对应行中找到对应字 NEYrcLyricWordModel。

5. UI 根据获取到的行与字信息显示歌词。

组件核心类文件介绍

文件名	说明
NELyric	歌词解析入口
NELyricLine	歌词行
NELyricWord	歌词字
NELyricLine+Layout	歌词行布局
NELyricLineLayout	缓存歌词布局的类
NELyricCell	单行歌词UI
NELyricView	整首歌词 UI