IOS开发之——音乐播放器-播放器页面(05)

article/2025/10/3 22:46:06

一概述

播放器页面Storyboard
点击列表Cell时，播放器页面show弹出
播放器页面按钮对应的功能

二播放器页面Storyboard

2.1 Storyboard界面

2.2 界面说明

界面分类：顶部View和底部View两部分
顶部View：歌曲大图、名字背景(歌曲名和歌手名)、拖拽进度、歌词显示控件(HMLrcView)、退出和图词切换按钮等
底部View：播放控制面板(播放/暂停、上一首、下一首)、进度条(歌曲时长/播放进度)、滑块(拖动改变播放位置)

三点击列表Cell时，播放器页面show弹出

3.1 HMPlayingViewController中show方法的作用

点击Cell时会设置当前播放歌曲，判断正在播放的歌曲和Cell设置的是否是同一个
设置播放器的frame和窗口的大小一致，并添加到窗口上
执行动画，让播放器View从底部转出来
动画执行完(播放器View展示出来后)播放歌曲

3.2 播放器中show代码

- (void)show {// 0.判断是否切换歌曲if (self.playingMusic != [HMMusicsTool returnPlayingMusic]) {// 重置数据[self resetPlayingMusic];}// 1.拿到windowUIWindow *window = [UIApplication sharedApplication].keyWindow;// 2.设置当前控制器的frame//self.view.y = window.bounds.size.height;self.view.frame = window.bounds;// 3.将当前控制器的View添加到window上[window addSubview:self.view];self.view.hidden = NO;// 禁用交互功能window.userInteractionEnabled = NO;// 4.执行动画，让控制器的View从下面转出来[UIView animateWithDuration:1 animations:^{// 执行动画self.view.y = 0;} completion:^(BOOL finished) {// 开启交互window.userInteractionEnabled = YES;// 开始播放[self startPlayingMusic];}];
}

3.3 列表Cell选中弹出播放器的方法(设置播放歌曲和show)

- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
{// 1.主动取消选中[tableView deselectRowAtIndexPath:indexPath animated:YES];// 2.执行segue跳转到播放界面，使用modal的方式打开，关闭控制器会销毁，无法继续播放音乐//    [self performSegueWithIdentifier:@"musics2playing" sender:nil];// 3.设置当前播放的音乐HMMusic *music = [HMMusicsTool musics][indexPath.row];[HMMusicsTool setPlayingMusic:music];// 自定义控制器，像modal的方式弹出控制器[self.playingVc show];}

四播放器页面按钮对应的功能

4.1 进入播放器页面播放并设置歌曲信息

// 开始播放
- (void)startPlayingMusic
{// 执行动画完毕, 开始播放音乐// 1.取出当前正在播放的音乐模型HMMusic *music = [HMMusicsTool returnPlayingMusic];// 2.播放音乐self.player = [HMAudioTool playMusic:music.filename];self.player.delegate = self;// 记录当前正在播放的音乐self.playingMusic = [HMMusicsTool returnPlayingMusic];// 3.设置其他属性// 设置歌手self.singerLabel.text = music.singer;// 歌曲名称self.songLabel.text = music.name;// 背景大图self.iconView.image = [UIImage imageNamed:music.icon];// 设置总时长self.durationLabel.text = [self strWithTimeInterval:self.player.duration];// 4.开启定时器[self addProgressTimer];[self addLrcTimer];// 5.设置播放按钮状态self.playOrPauseButton.selected = YES;// 6.切换歌词（加载新的歌词）self.lrcView.lrcname = self.playingMusic.lrcname;// 7.切换锁屏界面的歌曲[self updateLockedScreenMusic];
}

4.2 点击Cell的歌曲跟正在播放的歌曲不是同一个，重置数据

// 重置数据
- (void)resetPlayingMusic {// 设置歌手self.singerLabel.text = nil;// 歌曲名称self.songLabel.text = nil;// 背景大图self.iconView.image = [UIImage imageNamed:@"play_cover_pic_bg"];
//    self.iconView.clipsToBounds = YES;// 超出部分减掉// 停止当前正在播放的歌曲[HMAudioTool stopMusic:self.playingMusic.filename];self.player = nil;// 设置播放按钮状态self.playOrPauseButton.selected = NO;
}

4.3 上一首歌曲previous

- (IBAction)previous {UIWindow *window = [[UIApplication sharedApplication].windows lastObject];window.userInteractionEnabled = NO;// 1.重置当前歌曲[self resetPlayingMusic];// 2.获得下一首歌曲[HMMusicsTool setPlayingMusic:[HMMusicsTool previouesMusic]];// 3.播放下一首[self startPlayingMusic];window.userInteractionEnabled = YES;
}

4.4 下一首歌曲next

- (IBAction)next {UIWindow *window = [[UIApplication sharedApplication].windows lastObject];window.userInteractionEnabled = NO;// 1.重置当前歌曲[self resetPlayingMusic];// 2.获得下一首歌曲[HMMusicsTool setPlayingMusic:[HMMusicsTool nextMusic]];// 3.播放下一首[self startPlayingMusic];window.userInteractionEnabled = YES;
}

4.5 暂停和播放按钮

- (IBAction)playOrPause {if (self.player.isPlaying) { // 暂停self.playOrPauseButton.selected = NO;[HMAudioTool pauseMusic:self.playingMusic.filename];[self removeProgressTimer];[self removeLrcTimer];} else { // 继续播放self.playOrPauseButton.selected = YES;[HMAudioTool playMusic:self.playingMusic.filename];[self addProgressTimer];[self addLrcTimer];// 更新锁屏信息[self updateLockedScreenMusic];}
}