当前位置: 首页 > 图灵资讯 > 技术篇> iOS 音乐播放器之锁屏效果+歌词解析

iOS 音乐播放器之锁屏效果+歌词解析

来源:图灵教育
时间:2023-06-01 09:40:51

概述

功能描述:锁屏歌曲信息,控制台远程控制音乐播放:暂停/播放,前一首/下一首,快进/快退,列表菜单弹框,拖动控制台进度条调整进度(结合QQ音乐和网易云音乐在锁屏状态下的效果)、歌词分析和音乐滚动显示。

详细

功能描述:锁屏歌曲信息,控制台远程控制音乐播放:暂停/播放,前一首/下一首,快进/快退,列表菜单弹框,拖动控制台进度条调整进度(结合QQ音乐和网易云音乐在锁屏状态下的效果)、歌词分析和音乐滚动显示。

第一部分:锁屏效果包括:锁屏歌曲信息和远程控制音乐播放

① 显示锁屏歌曲信息

iOS 音乐播放器之锁屏效果+歌词解析_歌词解析

///显示锁屏歌曲信息:图片、歌词、进度、歌曲名称、歌手、专辑(图片上绘制歌词)- (void)showLockScreenTotaltime:(float)totalTime andCurrentTime:(float)currentTime andLyricsPoster:(BOOL)isShow{        NSMutableDictionary * songDict = [[NSMutableDictionary alloc] init];    //设置歌曲题目    [songDict setObject:@"多幸运" forKey:MPMediaItemPropertyTitle];    //设置歌手名    [songDict setObject:@"韩安旭" forKey:MPMediaItemPropertyArtist];    //设置专辑名    [songDict setObject:@"专辑名" forKey:MPMediaItemPropertyAlbumTitle];    //设置歌曲的长度    [songDict setObject:[NSNumber numberWithDouble:totalTime]  forKey:MPMediaItemPropertyPlaybackDuration];    ///设置已播放时间    [songDict setObject:[NSNumber numberWithDouble:currentTime] forKey:MPNowPlayingInfoPropertyElapsedPlaybackTime];        UIImage * lrcImage = [UIImage imageNamed:@backgroundima.jpg"];    if (isShow) {             ///制作带歌词的海报        if (!_lrcImageView) {            _lrcImageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 480,800)];        }                if (!_lockScreenTableView) {            _lockScreenTableView = [[UITableView alloc] initWithFrame:CGRectMake(0, 800 - 44 * 7 + 20, 480, 44 * 3) style:UITableViewStyleGrouped];            _lockScreenTableView.dataSource = self;            _lockScreenTableView.delegate = self;            _lockScreenTableView.separatorStyle = NO;            _lockScreenTableView.backgroundColor = [UIColor clearColor];            [_lockScreenTableView registerClass:[UITableViewCell class] forCellReuseIdentifier:@"cellID"];        }        //主要是把歌词画在图片上,歌词更新的目的已经达到了        [_lrcImageView addSubview:self.lockScreenTableView];        _lrcImageView.image = lrcImage;        _lrcImageView.backgroundColor = [UIColor blackColor];        ///获取添加歌词数据的海报图片        UIGraphicsBeginImageContextWithOptions(_lrcImageView.frame.size, NO, 0.0);                CGContextRef context = UIGraphicsGetCurrentContext();        [_lrcImageView.layer renderInContext:context];        lrcImage = UIGraphicsGetImageFromCurrentImageContext();        _lastImage = lrcImage;                UIGraphicsEndImageContext();    }else{            if (_lastImage) {            lrcImage = _lastImage;        }    }    ///设置显示的海报图片    [songDict setObject:[[MPMediaItemArtwork alloc] initWithImage:lrcImage]                 forKey:MPMediaItemPropertyArtwork];   ///加入正在播放媒体的信息中心    [[MPNowPlayingInfoCenter defaultCenter] setNowPlayingInfo:songDict];}

② 远程控制音乐播放

iOS 音乐播放器之锁屏效果+歌词解析_iOS_02

在此之前,我们需要满足后台播放音乐的条件:

///后台播放音频设置需要在Capabilities中播放->Background 在Modes中勾选Audio,Airplay,and Picture in Picture ,如下图1、2    AVAudioSession *session = [AVAudioSession sharedInstance];    [session setActive:YES error:nil];    [session setCategory:AVAudioSessionCategoryPlayback error:nil];

iOS 音乐播放器之锁屏效果+歌词解析_歌词解析_03

iOS 音乐播放器之锁屏效果+歌词解析_锁屏_04

  • 在iOS7.1之前, 如果App需要在锁屏界面打开和监控远程控制事件,可以重写- (void)remoteControlReceivedWithEvent:(UIEvent *)event捕获远程控制事件,并根据event进行捕获.判断指令意图并做出反应的subtype具体用法如下:

//在特定的控制器或其他类别中捕获远程控制事件,当远程控制事件发生时触发该方法, 该方法属于UIResponder类,iOS 7.1 之前经常用- (void)remoteControlReceivedWithEvent:(UIEvent *)event{    NSLog(@"%ld",event.type);    [[NSNotificationCenter defaultCenter] postNotificationName:@"songRemoteControlNotification" object:self userInfo:@{@"eventSubtype":@(event.subtype)}];} /* iOS 7.1之前*/     //让App开始接收远程控制事件, 该方法属于UIAplication     [[UIApplication sharedApplication] beginReceivingRemoteControlEvents];     //结束远程控制,必要时关闭     //     [[UIApplication sharedApplication] endReceivingRemoteControlEvents];     ///处理控制台暂停/播放、上/下一个事件     [[NSNotificationCenter defaultCenter] addObserverForName:@"songRemoteControlNotification" object:nil queue:[NSOperationQueue mainQueue] usingBlock:^(NSNotification *notification) {          NSInteger  eventSubtype = [notification.userInfo[@"eventSubtype"] integerValue];             switch (eventSubtype) {                case UIEventSubtypeRemoteControlNextTrack:                 NSLog(@下一首”);               break;               case UIEventSubtypeRemoteControlPreviousTrack:                NSLog(@“上一首”);              break;              case  UIEventSubtypeRemoteControlPause:            [self.player pause];                break;                case  UIEventSubtypeRemoteControlPlay:             [self.player play];              break;     ////暂停耳机上的播放            case  UIEventSubtypeRemoteControlTogglePlayPause:                NSLog(@“播放或暂停”);     break;     //后退            case UIEventSubtypeRemoteControlBeginSeekingBackward:              break;                case UIEventSubtypeRemoteControlEndSeekingBackward:              NSLog(@“后退”);                break;     //快进            case UIEventSubtypeRemoteControlBeginSeekingForward:                break;                case UIEventSubtypeRemoteControlEndSeekingForward:               NSLog(@“前进”);              break;                default:              break;     }     }];

  • iOS7.1之后,MPRemotecomandcenter出现了、MPRemoteCommand 以及一些相关类别 ,更方便打开锁屏界面,监控远程控制事件,还扩展了一些新功能:网易云音乐列表菜单弹框功能、QQ音乐拖动控制台进度条调整进度功能等... 官方文档:https://developer.apple.com/documentation/mediaplayer/mpremotecommandcenter

///打开锁屏界面,监控远程控制事件   - (void)createRemoteCommandCenter{    /**/    ////遥控命令中心 iOS 7.1 之后  详见官方文件:https://developer.apple.com/documentation/mediaplayer/mpremotecommandcenter        MPRemoteCommandCenter *commandCenter = [MPRemoteCommandCenter sharedCommandCenter];        //   MPFedbackcomand对象反映了当前应用程序播放的反馈状态. MPRemotecomandcenter对象为媒体文件提供feedback对象, 不喜欢, 标记的操作. 网易云音乐锁屏的效果与效果相似        //添加喜欢的按钮    MPFeedbackCommand *likeCommand = commandCenter.likeCommand;    likeCommand.enabled = YES;    likeCommand.localizedTitle = @"喜欢";    [likeCommand addTargetWithHandler:^MPRemoteCommandHandlerStatus(MPRemoteCommandEvent * _Nonnull event) {        NSLog(@喜欢”);        return MPRemoteCommandHandlerStatusSuccess;    }];    //添加不喜欢的按钮,假装是“上一首”    MPFeedbackCommand *dislikeCommand = commandCenter.dislikeCommand;    dislikeCommand.enabled = YES;    dislikeCommand.localizedTitle = @"上一首";    [dislikeCommand addTargetWithHandler:^MPRemoteCommandHandlerStatus(MPRemoteCommandEvent * _Nonnull event) {        NSLog(@“上一首”);        return MPRemoteCommandHandlerStatusSuccess;    }];    //标记    MPFeedbackCommand *bookmarkCommand = commandCenter.bookmarkCommand;    bookmarkCommand.enabled = YES;    bookmarkCommand.localizedTitle = @"标记";    [bookmarkCommand addTargetWithHandler:^MPRemoteCommandHandlerStatus(MPRemoteCommandEvent * _Nonnull event) {        NSLog(@标记”);        return MPRemoteCommandHandlerStatusSuccess;    }];    //    commandCenter.togglePlayPauseCommand 暂停/播放耳机线控        [commandCenter.pauseCommand addTargetWithHandler:^MPRemoteCommandHandlerStatus(MPRemoteCommandEvent * _Nonnull event) {        [self.player pause];        return MPRemoteCommandHandlerStatusSuccess;    }];    [commandCenter.playCommand addTargetWithHandler:^MPRemoteCommandHandlerStatus(MPRemoteCommandEvent * _Nonnull event) {        [self.player play];        return MPRemoteCommandHandlerStatusSuccess;    }];    //    [commandCenter.previousTrackCommand addTargetWithHandler:^MPRemoteCommandHandlerStatus(MPRemoteCommandEvent * _Nonnull event) {    //        NSLog(@“上一首”);    //        return MPRemoteCommandHandlerStatusSuccess;    //    }];        [commandCenter.nextTrackCommand addTargetWithHandler:^MPRemoteCommandHandlerStatus(MPRemoteCommandEvent * _Nonnull event) {        NSLog(@下一首”);        return MPRemoteCommandHandlerStatusSuccess;    }];        //快进    //    MPSkipIntervalCommand *skipBackwardIntervalCommand = commandCenter.skipForwardCommand;    //    skipBackwardIntervalCommand.preferredIntervals = @[@(54)];    //    skipBackwardIntervalCommand.enabled = YES;    //    [skipBackwardIntervalCommand addTarget:self action:@selector(skipBackwardEvent:)];        ///在控制台上拖动进度条调整进度(仿QQ音乐的效果)    [commandCenter.changePlaybackPositionCommand addTargetWithHandler:^MPRemoteCommandHandlerStatus(MPRemoteCommandEvent * _Nonnull event) {        CMTime totlaTime = self.player.currentItem.duration;        MPChangePlaybackPositionCommandEvent * playbackPositionEvent = (MPChangePlaybackPositionCommandEvent *)event;        [self.player seekToTime:CMTimeMake(totlaTime.value*playbackPositionEvent.positionTime/CMTimeGetSeconds(totlaTime), totlaTime.timescale) completionHandler:^(BOOL finished) {        }];        return MPRemoteCommandHandlerStatusSuccess;    }];    }-(void)skipBackwardEvent: (MPSkipIntervalCommandEvent *)skipEvent{    NSLog(@”快进 %f秒", skipEvent.interval);}

第二部分:歌词分析

iOS 音乐播放器之锁屏效果+歌词解析_音乐播放器之锁屏效果_05

  • 根据上图的歌词风格,思路是:先根据换行符“\n“分割字符串,获得包含每行歌词字符串的数组,然后分析每行歌词字符,获得时间点和相应的歌词,然后使用创建的歌词对象wsllrceach存储时间点和歌词,最后获得存储wsllrceach对象的数组.
  • ///每个歌词对象@interface wslLrcEach : NSObject@property(nonatomic, assign) NSUInteger time ;@property(nonatomic, copy) NSString * lrc ;@end 下一步是让歌词随歌曲的进度滚动显示,主要代码如下: self.tableView 显示歌词的 currentTime 当前播放时间点

•      self.currentRow  歌词在当前时间点的位置         ///歌词滚动显示            for ( int i = (int)(self.lrcArray.count - 1); i >= 0 ;i--) {                wslLrcEach * lrc = self.lrcArray[i];                if (lrc.time < currentTime) {                    self.currentRow = i;                    [self.tableView scrollToRowAtIndexPath:[NSIndexPath indexPathForRow: self.currentRow inSection:0] atScrollPosition:UITableViewScrollPositionMiddle animated:YES];                    [self.tableView reloadData];                    break;                }            }

第三部分:项目截图

iOS 音乐播放器之锁屏效果+歌词解析_iOS_06

注:本文将作权归作者所有,由demo大师出版,拒绝转载。转载需要作者的授权