TableView Cell 视频自动播放 [英] TableView Cell video autoplay

问题描述

我做了什么:-

<块引用>

我添加了在单元格完全可见时播放视频的代码当我向下或向上滚动时，它会再次重新加载 tableview 并播放再次视频.但是，我的要求不同.

我真正想要的:

<块引用>

我想播放视频，直到完全向后或向前单元格可见的.当用户向下或向上滚动时，它不会影响直到向后或向前的单元格完全可见.

设计

表格单元格布局说明->视频表单元格(固定高度 393)->内容视图->主视图 - (根据表格视图单元格的内容视图)->标题视图 (0, 0, MainView.width, 57)->视频视图 (0, 57, MainView.width, 200);->描述视图 (0, 257, MainView.width, 136)

编码:

<块引用>

VideoTableCell.h

#import #import @interface VideoTableCell : UITableViewCell@property (strong, nonatomic) IBOutlet UIView *viewForVideo;@property (strong, nonatomic) IBOutlet UIImageView *imgThumb;@property (strong, nonatomic) IBOutlet UIButton *btnPlay;@property (strong, nonatomic) AVPlayerItem* videoItem;@property (strong, nonatomic) AVPlayer* videoPlayer;@property (strong, nonatomic) AVPlayerLayer* avLayer;@结尾

<块引用>

VideoTableCell.m

#import "VideoTableCell.h"@implementation VideoTableCell- (id)initWithStyle:(UITableViewCellStyle)style重用Identifier:(NSString *)reuseIdentifier {self = [super initWithStyle:style 重用标识符:reuseIdentifier];回归自我；}- (void)layoutSubviews{[超级布局子视图];[self.avLayer setFrame:CGRectMake(self.viewForVideo.frame.origin.x, self.viewForVideo.frame.origin.y, self.viewForVideo.frame.size.width, self.viewForVideo.frame.size.height)];}@结尾

<块引用>

VideoVC.h

#import #import @interface VideoVC : UIViewController @property (strong, nonatomic) IBOutlet UITableView *tblData;@结尾

<块引用>

VideoVC.m

#import "VideoVC.h"#import "VideoTableCell.h"@interface VideoVC (){NSArray *arrVideo ;bool isScrolling;整数索引；BOOL 完全可见；}@结尾@implementation VideoVC- (void)viewDidLoad {[超级viewDidLoad];arrVideo = [[NSArray alloc]initWithObjects:@"http://video/1.mp4",@"http://video/2.mp4", @"http://video/3.mp4", @"http://video/4.mp4", @"http://video/5.mp4", nil];完全可见 = 是；}-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{返回 arrVideo.count;}-(UITableViewCell*)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{VideoTableCell *cell = [tableView dequeueReusableCellWithIdentifier:@"VideoTableCell"];如果(单元格 == 零){cell = [[[NSBundle mainBundle] loadNibNamed:@"VideoTableCell" owner:self options:nil]objectAtIndex:0];}int temp = [self getVisibleIndex];if (temp == indexPath.row && fullvisible){cell.imgThumb.hidden = 是;//NSLog(@"fullvisible == 1");NSURL *url = [NSURL URLWithString:[arrVideo objectAtIndex:indexPath.row]];cell.videoItem = [AVPlayerItem playerItemWithURL:url];cell.videoPlayer = [AVPlayer playerWithPlayerItem:cell.videoItem];cell.avLayer = [AVPlayerLayer playerLayerWithPlayer:cell.videoPlayer];[cell.avLayer setBackgroundColor:[UIColor whiteColor].CGColor];//[cell.avLayer setVideoGravity:AVLayerVideoGravityResizeAspectFill];[cell.contentView.layer addSublayer:cell.avLayer];[cell.videoPlayer 播放];[cell setSelectionStyle:UITableViewCellSelectionStyleNone];}别的{cell.imgThumb.hidden = NO;cell.videoPlayer = nil;[cell.avLayer removeFromSuperlayer];cell.videoItem = nil;[cell.videoPlayer 暂停];}返回单元格；}-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{返回 393 ；}-(int)getVisibleIndex{for (NSIndexPath *indexPath in _tblData.indexPathsForVisibleRows) {CGRect cellRect = [_tblData rectForRowAtIndexPath:indexPath];BOOL isVisible = CGRectContainsRect(_tblData.bounds, cellRect);如果(是可见的){index = (int)indexPath.row ;}}回报指数；}- (void)scrollViewDidScroll:(UIScrollView *)aScrollView{NSArray* 单元格 = _tblData.visibleCells;for (VideoTableCell* 单元格中的单元格){NSIndexPath *path = [_tblData indexPathForCell:cell] ;index =(int) path.row;完全可见 = 是；[_tblData reloadData];}}

解决方案

每个 UITableViewCell 子类都有一个方法 prepareForReuse: 所以在你的 VideoTableCell只需添加一个方法:

-(void)prepareForReuse {[超级prepareForReuse];[self.videoPlayer 播放];}

在你的控制器中实现一个委托方法:- (void)tableView:(UITableView *)tableView didEndDisplayingCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath

- (void)tableView:(UITableView *)tableView didEndDisplayingCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath {[单元格停止视频];}

并在 stopVideo 中添加 [self.videoPlayer pause] 或 [cell.videoPlayer stop]

What I had done :-

I had added the code which plays a video when cell is fully visible and when I scrolls down or up it reload the tableview again and plays video again. But, my requirement is different.

What I actually want :

I want to play a video untill the backward or forward cell fully visible. When user scroll downs or up it doesn’t affect untill the backward or forward cell fully visible.

Design

Table Cell Layout Description
-> Video Table Cell (Fix height 393) 
    -> Content View
    -> Main view - (as per Content view of Table view Cell)
        -> Title View (0, 0, MainView.width, 57)
        -> Video View (0, 57, MainView.width, 200);
        -> Description View (0, 257, MainView.width, 136) 

Coding :

VideoTableCell.h

#import <UIKit/UIKit.h>

#import <AVFoundation/AVFoundation.h>



@interface VideoTableCell : UITableViewCell

@property (strong, nonatomic) IBOutlet UIView *viewForVideo;

@property (strong, nonatomic) IBOutlet UIImageView *imgThumb;

@property (strong, nonatomic) IBOutlet UIButton *btnPlay;

@property (strong, nonatomic) AVPlayerItem* videoItem;

@property (strong, nonatomic) AVPlayer* videoPlayer;

@property (strong, nonatomic) AVPlayerLayer* avLayer;



@end

VideoTableCell.m

#import "VideoTableCell.h"

@implementation VideoTableCell

- (id)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier {
    self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];

    return self;
}
- (void)layoutSubviews
{
    [super layoutSubviews];
     [self.avLayer setFrame:CGRectMake(self.viewForVideo.frame.origin.x, self.viewForVideo.frame.origin.y, self.viewForVideo.frame.size.width,  self.viewForVideo.frame.size.height)];

}

@end

VideoVC.h

#import <UIKit/UIKit.h>

#import <AVFoundation/AVFoundation.h>

@interface VideoVC : UIViewController <UITableViewDataSource, UITableViewDelegate>

@property (strong, nonatomic) IBOutlet UITableView *tblData;

@end

VideoVC.m

#import "VideoVC.h"

#import "VideoTableCell.h"



@interface VideoVC ()

{
    NSArray *arrVideo ;
    bool isScrolling;
    int index;
BOOL fullvisible ;

}
@end  

@implementation VideoVC

- (void)viewDidLoad {

    [super viewDidLoad];    

    arrVideo = [[NSArray alloc]initWithObjects:@"http://video/1.mp4",@"http://video/2.mp4", @"http://video/3.mp4", @"http://video/4.mp4", @"http://video/5.mp4", nil];

    fullvisible = YES;   
}

-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    return arrVideo.count;
}

-(UITableViewCell*)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    VideoTableCell *cell = [tableView dequeueReusableCellWithIdentifier:@"VideoTableCell"];
    if (cell == nil)
    {
        cell = [[[NSBundle mainBundle] loadNibNamed:@"VideoTableCell" owner:self options:nil]objectAtIndex:0];
    }

    int temp =  [self getVisibleIndex];

    if (temp == indexPath.row && fullvisible)
    {
            cell.imgThumb.hidden = YES ;
            //NSLog(@"fullvisible == 1");
            NSURL *url = [NSURL URLWithString:[arrVideo objectAtIndex:indexPath.row]];

            cell.videoItem = [AVPlayerItem playerItemWithURL:url];
            cell.videoPlayer = [AVPlayer playerWithPlayerItem:cell.videoItem];
            cell.avLayer = [AVPlayerLayer playerLayerWithPlayer:cell.videoPlayer];

            [cell.avLayer setBackgroundColor:[UIColor whiteColor].CGColor];
            // [cell.avLayer setVideoGravity:AVLayerVideoGravityResizeAspectFill];
            [cell.contentView.layer addSublayer:cell.avLayer];
            [cell.videoPlayer play];

            [cell setSelectionStyle:UITableViewCellSelectionStyleNone];
    }
    else
    {
            cell.imgThumb.hidden = NO ;
            cell.videoPlayer = nil;
            [cell.avLayer removeFromSuperlayer];
            cell.videoItem = nil;
            [cell.videoPlayer pause];
    }
    return cell ;
}

-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
    return 393 ;
}


-(int)getVisibleIndex

{   
    for (NSIndexPath *indexPath in _tblData.indexPathsForVisibleRows) {

        CGRect cellRect = [_tblData rectForRowAtIndexPath:indexPath];
        BOOL isVisible = CGRectContainsRect(_tblData.bounds, cellRect);

        if (isVisible)

        {
            index = (int)indexPath.row ;
        }
    }
    return index ;
}

- (void)scrollViewDidScroll:(UIScrollView *)aScrollView

{

    NSArray* cells = _tblData.visibleCells;

    for (VideoTableCell* cell in cells)

    {

            NSIndexPath *path = [_tblData indexPathForCell:cell] ;

            index =(int) path.row;

            fullvisible = YES;

            [_tblData reloadData];

    }
}

解决方案

Every UITableViewCell subclass has a method prepareForReuse: so in your VideoTableCell just add a method:

-(void)prepareForReuse {
   [super prepareForReuse];
   [self.videoPlayer play];
}

And in your controller implement a delegate method: - (void)tableView:(UITableView *)tableView didEndDisplayingCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath

- (void)tableView:(UITableView *)tableView didEndDisplayingCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath {

   [cell stopVideo];
}

and in stopVideo just add [self.videoPlayer pause] or [cell.videoPlayer stop]

这篇关于TableView Cell 视频自动播放的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！