音乐播放器项目技术之一歌词的同步显示

一.歌词同步显示的思路分析

  思路分析及步骤:

　　　　　　第一步:要想显示歌词,首先必须完成对歌词数据的解析,解析出来以后要对数据进行处理,将时间和歌词分离放进数组中,并通过与时间对应获取当前歌词所在的下标位置.

            第二步:将歌词与cell对应并显示出来

二.实现过程的重要过程及步骤.

 对于步骤一的代码实现:

#import "MusicLyricHelper.h"
#import "LyricModel.h"
#import <UIKit/UIKit.h>

@interface  MusicLyricHelper ()

//存放所有歌词对象的数组
@property(nonatomic,strong)NSMutableArray *allLyricModelsArray;

@end

@implementation MusicLyricHelper

#pragma mark--获取歌词工具类对象
+(instancetype)shareMusicLyricHelper
{
    static MusicLyricHelper *helper = nil;
    static dispatch_once_t onceToken;
    dispatch_once(&onceToken, ^{
        
        helper  =[[MusicLyricHelper alloc] init];
    });
  
    return helper;
}

#pragma mark ---解析歌词并封装成model对象
-(void)parseLyricWithLyricString:(NSString *)lyricString
{

    //当切换新歌时,将数组中原来的歌词对象清空
    [self.allLyricModelsArray removeAllObjects];
    
    
    NSLog(@"%@",lyricString);
    
    //将字符串切割成数组 componentsSeparatedByString
    NSArray *array = [lyricString componentsSeparatedByString:@"
"];

    NSLog(@"%@",array);


    for (NSString *string  in array) {
        
        //将字符串切割成数组
       NSArray *timeStrAndLyricStr = [string componentsSeparatedByString:@"]"];
        NSLog(@"%@",timeStrAndLyricStr);
        if ([timeStrAndLyricStr.firstObject length] == 0) {
            continue;
        }
        //截取时间部分字符串 "[04:16.530"
        NSString *str = timeStrAndLyricStr.firstObject;
        //从第几个字符串时开始截取
        NSString *timeStr = [str substringFromIndex:1];
        //将字符串切割成数组  两部分-->  03, "20.760"
       NSArray *timeArray =  [timeStr componentsSeparatedByString:@":"];
        NSLog(@"%@",timeArray);
        //计算秒数   计算歌词对应的歌曲时间
        NSTimeInterval  second = [timeArray.firstObject doubleValue]*60 + [timeArray.lastObject doubleValue];
        //每一句歌词   获取每一行的歌词
        NSString *lyricStr = [timeStrAndLyricStr lastObject];
        
        //封装model对象
        LyricModel *lyric = [[LyricModel alloc] initWithTime:second lyricString:lyricStr];
        
        [self.allLyricModelsArray  addObject:lyric];
    }
}

//使用懒加载创建并初始化数组   用self.来调用
-(NSMutableArray *)allLyricModelsArray
{
    if (!_allLyricModelsArray) {
        _allLyricModelsArray = [NSMutableArray array];
    }
    return _allLyricModelsArray;
}

-(NSInteger)count
{
    return _allLyricModelsArray.count;
}

#pragma mark ---根据传过来的indexpath获取model对象
-(LyricModel *)lyricWithIndeapath:(NSIndexPath *)indexPath
{

    return _allLyricModelsArray[indexPath.row];

}

#pragma mark ---根据时间获取下标
-(NSInteger)getIndexWithTime:(NSTimeInterval)time
{
    NSInteger index  = 0;
    for (int i = 0 ; i<self.count; i++) {
        LyricModel *lyric = _allLyricModelsArray[i];
        
        //发现一个满足条件的就break
        if (lyric.time > time) {
            index = (i-1 >0)?i-1:0;
            break;
        }
    }

    return index;

}



@end

 对于步骤二的实现:

开始准备歌词,并刷新tableView

  #pragma mark --开始准备歌词
    [KmusicLyricHelper parseLyricWithLyricString:currentmusic.lyric];
    
    //刷新歌词表视图
    [self.lyricTableView reloadData];
    

 在哪一行显示歌词

  //歌词的实现代码---------------------------------------------------------

    //根据下标显示哪一行的歌词
    NSInteger index  = [KmusicLyricHelper getIndexWithTime:time];
    
    //选中哪一行
    NSIndexPath *indexPath1 = [NSIndexPath indexPathForItem:index inSection:0];

    [self.lyricTableView selectRowAtIndexPath:indexPath1 animated:YES scrollPosition:UITableViewScrollPositionMiddle];

 滑块点击事件的方法

//时间滑动轴的点击事件方法
- (IBAction)didClickTimeSlider:(UISlider *)sender {
    
    NSLog(@"%f",_timeSlider.value);
    [KMusicPlayHelper  seekToPlayWithTime:_timeSlider.value];
}

//音量滑动轴的点击事件方法
- (IBAction)didClickVolumeSlider:(UISlider *)sender {
    
    KMusicPlayHelper.volume = sender.value;
    
}

 对于cell代理方法的实现及往cell中添加数据

#pragma mark ---实现协议方法
-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    return KmusicLyricHelper.count;
}

-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{

    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"lyricCell" forIndexPath:indexPath];
    
    
    cell.textLabel.text = [KmusicLyricHelper lyricWithIndeapath:indexPath].lyricString;
    
    //清空cell的背景色
    cell.backgroundColor = [UIColor clearColor];
    
    //取消选中样式
//    cell.selectionStyle = UITableViewCellSelectionStyleNone;

    //设置cell高亮状态的文字颜色
    cell.textLabel.highlightedTextColor = [UIColor colorWithRed:1.0 green:0 blue:0 alpha:1];
    
    cell.backgroundView = [[UIView alloc] init];
    //选中状态下的背景设为空(就是点击cell时的灰色清空)
    cell.selectedBackgroundView = [[UIView alloc] init];
    
//    cell.textLabel.font = [UIFont systemFontOfSize:22];
     //文本居中
    cell.textLabel.textAlignment = NSTextAlignmentCenter;
    
    return cell;

}