我没有参照目前上最流行的方法:scrollView直接加载3个播放器界面的做法;因为当时做这个功能的时候,就直接开撸了;
我的视频轮播直接用UITableView实现的,通过缓存indexPath和cell来做当前视频的标记。
首先,tableView要开启分页模式: tableView.pageEnable = YES。
- UIViewController中定义下面属性(在tableView滚动过程中,缓存这些属性):
// 当前播放的索引
@property (nonatomic, strong) NSIndexPath* curPlayIndexPath;
// 当前播放的cell(跟上面curPlayIndexPath是一一对应的)
@property (nonatomic, weak) JFVideoCell* curPlayingCell; // 封装了视频播放控件和方法: play|pause
在curPlayIndexPath
的setter:
中更新curPlayingCell
:
- (void)setCurPlayIndexPath:(NSIndexPath *)curPlayIndexPath {
if ([_curPlayingCell isEqual:curPlayIndexPath]) {
return;
}
_curPlayIndexPath = curPlayIndexPath;
JFVideoCell* cell = [self.tableView cellForRowAtIndexPath:_curPlayIndexPath];
// 如果cell不存在,说明是第一个cell,还没入栈到tableView的重用队列,这里获取不到的;在cellForRowAtIndexPath回调中缓存这个cell
if (cell) {
self.curPlayingCell = cell;
}
}
在 curPlayingCell
的setter:
中控制视频的播放和暂停:
- (void)setCurPlayingCell:(JFVideoCell *)curPlayingCell {
// 不要重复设置
if (_curPlayingCell && _curPlayingCell == curPlayingCell) {
return;
}
// 当前播放的cell存在时,暂停播放
if (_curPlayingCell) {
[_curPlayingCell pause];
}
// 更新cell
_curPlayingCell = curPlayingCell;
// 播放新缓存的cell
if (_curPlayingCell) {
[_curPlayingCell playVideo];
}
}
好了,前置条件已准备好;下面开始分析tableView的滚动回调情况:
· tableView正常滑动,会触发scrollViewDidScroll
回调,停止滚动时会触发 scrollViewDidEndDecelerating
回调;
· 点击屏幕状态栏时,只触发scrollViewDidScroll
,不会在停止滚动时触发 scrollViewDidEndDecelerating
回调;
· tableView初始加载完毕时,既不触发scrollViewDidScroll
回调,也不触发 scrollViewDidEndDecelerating
回调,只触发tableView: cellForRowAtIndexPath:
回调;
那么,对上面3种情况,分别进行分析。
- tableView正常滑动时:
正常滑动,tableView 会触发回调:scrollViewDidEndDecelerating:
,在这个回调中,计算当前 cell 的 indexPath。
// 当前cell的行数
NSInteger row = (NSInteger)scrollView.contentOffset.y / SCREEN_HEIGHT;
self.curPlayIndexPath = [NSIndexPath indexPathForRow:row inSection:0];
这个cell和indexPath都会被缓存下来,视频也会被播放;
- 只触发
scrollViewDidScroll
,而不触发scrollViewDidEndDecelerating
的情况:
点击了屏幕状态栏,tableView滑动到顶部。
这个时候,self.curPlayIndexPath
就只能在scrollViewDidScroll
的回调中设置了:
- (void)scrollViewDidScroll:(UIScrollView *)scrollView {
CGPoint velocity = [scrollView.panGestureRecognizer velocityInView:self.view];
// 当前所有的视频个数
NSInteger total = [self.vmData numberOfRowsInSection:0];
CGFloat contentOffsetY = scrollView.contentOffset.y;
NSInteger row = self.curPlayIndexPath ? self.curPlayIndexPath.row : 0;
CGFloat curCellStartY = row * JFSCREEN_HEIGHT;
// 在最后一个cell的位置
if (total > 0 && row == total - 1) {
// 不是上拉刷新
if (velocity.y > 0) {
scrollView.pagingEnabled = YES;
}
// 上拉刷新时:要屏蔽分页效果,否则MJRefresh悬停会导致cell位置不在屏幕边界
else if (velocity.y < 0) {
scrollView.pagingEnabled = NO;
}
}
// 一种情况:scrollViewDidEndDecelerating没有触发时,且当前滚动到了顶部,重置当前播放indexPath为0位置
if (contentOffsetY == 0 && !scrollView.isTracking) {
self.curPlayIndexPath = [NSIndexPath indexPathForRow:0 inSection:0];
return;
}
// 当前播放的cell的indexPath不在屏幕可见区内,就要设置indexPath为空,将当前播放暂停
if (contentOffsetY <= curCellStartY - JFSCREEN_HEIGHT || contentOffsetY >= curCellStartY + JFSCREEN_HEIGHT) {
if (self.curPlayIndexPath) {
self.curPlayIndexPath = nil;
}
}
// 而cell能到屏幕可见区内的话,scrollViewDidEndDecelerating就一定会被触发,到那个方法里面去重置当前播放的indexPath
}
- 既不触发
scrollViewDidScroll
,也不触发scrollViewDidEndDecelerating
的情况:
tableView初始状态;这时只有在tableView: cellForRowAtIndexPath:
回调中缓存indexPath了;
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
JFVideoCell* cell = [tableView dequeueReusableCellWithIdentifier:@"JFVideoCell"];
// 设置视频数据模型
cell.model = [self.vmData modelForRowAtIndexPath:indexPath];
CGFloat contentOffsetY = tableView.contentOffset.y;
CGFloat headerHeight = tableView.mj_header.height;
f // 这种情况为:界面和数据刚加载完毕,不会触发任何滚动事件
if (indexPath.row == 0 && contentOffsetY > -0.01 - headerHeight && contentOffsetY < 0.01 + headerHeight) {
// row==0时,因为cell还没入栈,cellForRowAtIndexPath:获取不到cell;不能自动播放,这里要手动
self.curPlayIndexPath = indexPath;
self.curPlayingCell = cell;
}
return cell;
}
- 到这里,基本的滑动播放视频就实现了。但是,还有个情况:
从本界面跳转到别的界面时,需要暂停当前的播放;然后,又从别的界面回到本界面时,要恢复当前播放。
这个 当前 , 就是缓存的curPlayingCell
属性。
既然这样,方法就简单了:
// 转场时:暂停当前播放
- (void)viewWillDisappear:(BOOL)animated {
[super viewWillDisappear:animated];
// 暂停当前的播放
if (self.curPlayingCell) {
[self.curPlayingCell pause];
}
}
// 回场时:继续当前播放
- (void)viewDidAppear:(BOOL)animated {
[super viewDidAppear:animated];
// 继续当前的播放
if (self.curPlayingCell) {
[self.curPlayingCell playVideo];
}
}
实现完毕!
我们的APP即将上线了,期待下载链接!