美文网首页iOS备忘录
iOS iPad 直播 画中画实现探索

iOS iPad 直播 画中画实现探索

作者: 杨柳小易 | 来源:发表于2017-07-07 11:15 被阅读595次

    iPad 画中画 功能添加

    熊猫直播 iPad 版本 目前线上是没画中画功能的。这里画中画功能,主要模仿虎牙的画中画功能。
    如下画面。

    难点

    直播间播放的时候正常情况下 是 FLV 格式的。但是目前画中画功能只支持 hls 格式。并且使用系统自带的控件。

    接来来我们看看虎牙怎么实现的

    1:使用Charles 抓包。

    因为hls 格式的东东,会不断的发起http 请求,并且缓存10s 的短视频。

    初步怀疑,虎牙支持画中画的房间都是使用hls 格式的视频流。

    <strong>实践是打脸的唯一标准</strong>

    charles抓包

    虎牙只有在启动画中画功能的时候,才请求了http hls 格式的视频流。。

    所以,方案有了,退出直播间,的时候,切换视频流格式。

    2:使用hopper看看虎牙都做了什么,从iTunes 上下载虎牙 的 iPad 版本安装包,解压,看看里面的内容。不看不知道,一看吓一跳。里面有个短视频,mp4格式的,就是每次开打虎牙直播间的时候都是用的那个加载中,最开始我还一直以为是直播间自带的

    因为从iTunes 上下载的都是有壳的,我们也是能看个大概,

    解压之后的

    看到beginPip 那个MP4 文件了么。。

    在hopper 上,搜 pic 或者 pip (这里只是尝试,毕竟画中画系统的名字都是这样子取的),大概可以看到虎牙的实现画中的这些个类。

    hopper 上看到的东东

    1 2

    这里就是虎牙实现画中类的所有方法名了,我们可以根据方法名猜测个大概!!

    干货时间:

    实现如下:

    
    NS_ASSUME_NONNULL_BEGIN
    
    @interface PTVPictureInpicture : NSObject
    
    + (instancetype)pictureInpicture;
    
    ///是否支持画中画中能
    + (BOOL)isSupportPictureInPicture;
    
    @property (nonatomic, copy) NSString *roomID;
    
    ///#初始化 url m3u8格式
    - (void)openPictureInPicture:(NSString *)url;
    
    ///#开启画中画
    - (void)doPicInPic;
    
    ///#关闭画中画
    - (void)closePicInPic;
    
    @end
    
    NS_ASSUME_NONNULL_END
    
    

    .m文件

    ///kvo 监听状态
    static NSString *const kForPlayerItemStatus = @"status";
    
    @interface PTVPictureInpicture()<AVPictureInPictureControllerDelegate>
    
    ///#画中画
    @property (nonatomic, strong) AVPictureInPictureController *pipViewController;// 画中画
    
    @end
    
    @implementation PTVPictureInpicture
    {
        BOOL           _needEnterRoom;
        UIView        *_playerContent;
        AVQueuePlayer *_queuePlayer;
        ///#开始
        AVPlayerItem                 *_beginItem;
        AVPlayerItem                 *_playerItem;
        AVPlayerLayer                *_playerLayer;
    }
    + (instancetype)pictureInpicture {
        static PTVPictureInpicture *_p;
        static dispatch_once_t onceToken;
        dispatch_once(&onceToken, ^{
            _p = [PTVPictureInpicture new];
        });
        return _p;
    }
    
    + (BOOL)isSupportPictureInPicture {
        static BOOL _isSuportPic = NO;
        //    static dispatch_once_t onceToken;
        //    dispatch_once(&onceToken, ^{
        Class _c = NSClassFromString(@"AVPictureInPictureController");
        if (_c != nil) {
            _isSuportPic = [AVPictureInPictureController isPictureInPictureSupported];
        }
        //    });
        return _isSuportPic;
    }
    
    
    - (void)_initPicture {
        if (![[self class] isSupportPictureInPicture]) return;
        [self setupSuport];
    }
    
    -(void)setupSuport
    {
        if([AVPictureInPictureController isPictureInPictureSupported]) {
            _pipViewController =  [[AVPictureInPictureController alloc] initWithPlayerLayer:_playerLayer];
            _pipViewController.delegate = self;
        }
    }
    
    
    - (void)openPictureInPicture:(NSString *)url {
        
        if (![[self class] isSupportPictureInPicture]) return;
        if (!url || url.length == 0 ) return;
        if (![url containsString:@"m3u8"]) return;
        
        [self closePicInPic];
        
        [[AVAudioSession sharedInstance] setCategory:AVAudioSessionCategoryPlayback error:nil];
        [[AVAudioSession sharedInstance] setActive: YES error: nil];
        
        _playerItem = [AVPlayerItem playerItemWithURL:[NSURL URLWithString:url]];
        
        ///#等待资源加载好
        NSString *path = [[NSBundle mainBundle] pathForResource:@"BeginPIP"
                                                         ofType:@"mp4"];
        
        NSURL *sourceMovieUrl = [NSURL fileURLWithPath:path];
        AVAsset *movieAsset = [AVURLAsset URLAssetWithURL:sourceMovieUrl options:nil];
        _beginItem = [AVPlayerItem playerItemWithAsset:movieAsset];
        
        
        [_playerItem addObserver:self
                      forKeyPath:kForPlayerItemStatus
                         options:NSKeyValueObservingOptionNew context:nil];// 监听loadedTimeRanges属性
        
        [_beginItem addObserver:self
                     forKeyPath:kForPlayerItemStatus
                        options:NSKeyValueObservingOptionNew context:nil];// 监听loadedTimeRanges属性
        
        
        _queuePlayer = [AVQueuePlayer queuePlayerWithItems:@[_beginItem,_playerItem]];
        
        _playerLayer = [AVPlayerLayer playerLayerWithPlayer:_queuePlayer];
        _playerLayer.videoGravity = AVLayerVideoGravityResizeAspect;  // 适配视频尺寸
        _playerLayer.backgroundColor = (__bridge CGColorRef _Nullable)([UIColor blackColor]);
        
        [self _initPicture];
        
        if (!_playerContent) {
            _playerContent = [UIView new];
            _playerContent.frame = CGRectMake(-10, -10, 1, 1);
            _playerContent.alpha = 0.0;
            _playerContent.backgroundColor = [UIColor clearColor];
            _playerContent.userInteractionEnabled = NO;
        }
        _playerLayer.frame = CGRectMake(0, 0, 1, 1);
        [_playerContent.layer addSublayer:_playerLayer];
        
        UIWindow *window = (UIWindow *)GetAppDelegate.window;
        [window addSubview:_playerContent];
        
        [_queuePlayer play];
    }
    
    
    - (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary<NSString *,id> *)change context:(void *)context
    {
        if ([keyPath isEqualToString:@"status"]) {
            
            dispatch_after(dispatch_time(DISPATCH_TIME_NOW, (int64_t)(0 * NSEC_PER_SEC)), dispatch_get_main_queue(), ^{
                
                if (_queuePlayer.status == AVPlayerStatusReadyToPlay) {
                    [_queuePlayer play];
                    if (!_pipViewController.isPictureInPictureActive) {
                        [self doPicInPic];
                    }
                } else {
                    [self closePicInPic];
                }
                
            });
            
        }
        
    }
    
    
    - (void)doPicInPic {
        if (![[self class] isSupportPictureInPicture]) return;
        
        if (!_pipViewController.pictureInPictureActive) {
            [_pipViewController startPictureInPicture];
            _needEnterRoom = YES;
        }
    }
    
    
    - (void)closePicInPic {
        if (![[self class] isSupportPictureInPicture]) return;
        if (!_pipViewController) return;
        
        [self _removePlayerContentView];
        _needEnterRoom = NO;
        [self _removeObserve];
        
        if (_pipViewController.pictureInPictureActive) {
            [_pipViewController stopPictureInPicture];
        }
        
        ///# 释放资源
        _playerItem  = nil;
        _playerLayer = nil;
        _beginItem   = nil;
        _queuePlayer = nil;
    }
    
    - (void)_removeObserve {
        if (_playerItem) {
            [_playerItem removeObserver:self
                             forKeyPath:@"status"];
            _playerItem = nil;
        }
        if (_beginItem) {
            [_beginItem removeObserver:self
                            forKeyPath:@"status"];
            _beginItem = nil;
        }
        [[NSNotificationCenter defaultCenter] removeObserver:self];
    }
    
    
    - (void)pictureInPictureController:(AVPictureInPictureController *)pictureInPictureController restoreUserInterfaceForPictureInPictureStopWithCompletionHandler:(void (^)(BOOL restored))completionHandler {
        
        if (_needEnterRoom) {
            
            [self _removePlayerContentView];
            
            if (self.roomID) {
    ####进入直播间            
            }
            [self _removeObserve];
        }
        completionHandler(YES);
    }
    
    - (void)pictureInPictureControllerDidStopPictureInPicture:(AVPictureInPictureController *)pictureInPictureController {
    }
    
    - (void)pictureInPictureControllerDidStartPictureInPicture:(AVPictureInPictureController *)pictureInPictureController {
    }
    
    - (void)pictureInPictureControllerWillStopPictureInPicture:(AVPictureInPictureController *)pictureInPictureController {
        [self _removeObserve];
    }
    
    - (void)pictureInPictureController:(AVPictureInPictureController *)pictureInPictureController failedToStartPictureInPictureWithError:(NSError *)error {
        [self _removePlayerContentView];
    }
    
    - (void)pictureInPictureControllerWillStartPictureInPicture:(AVPictureInPictureController *)pictureInPictureController {
    }
    
    - (void)_removePlayerContentView {
        if (_playerContent && _playerContent.superview) {
            [_playerContent removeFromSuperview];
        }
    }
    
    @end
    
    

    稍微说两句。此处,最开始先加载一个本地视频,因为,切换视频格式的时候,不能马上唤起画中画的画面。只有等到 <code>AVPlayerItem</code> 的 status 是 AVPlayerStatusReadyToPlay 的时候才能显示,所以,直接加载一个本地视频,本地视频的 AVPlayerItem 就直接 AVPlayerStatusReadyToPlay 了。

    这里使用 AVQueuePlayer ,切换两个 AVPlayerItem 的时候,过程中间有一个 菊花在转动。挺好

    效果图:

    1 2 3 4

    相关文章

      网友评论

        本文标题:iOS iPad 直播 画中画实现探索

        本文链接:https://www.haomeiwen.com/subject/fselhxtx.html