如何在UIWebView视频播放器中添加OverLay视图?

时间:2015-07-17 10:33:37

标签: ios objective-c video uiwebview overlay

我想在UIWebView的视频播放器上添加一些自定义控件。 我可以通过以下代码添加对它的任何控制:

首先我要添加以下通知,

[[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(addOverLayView:) name:UIWindowDidBecomeVisibleNotification object:nil]; 

然后收到它,

-(void)addOverLayView:(NSNotification*)aNotification{
    UIWindow *window = (UIWindow *)aNotification.object;

    if (window != self.view.window) {
        [window addSubview:anyCustomview];
    }
}

但是此视图将静态地位于UIWebView的视频视图之上。但我希望实现像视频播放器的控件将隐藏,然后我想隐藏我的自定义视图。

换句话说,我想在OverLayView的视频播放器视图中实现自定义UIWebView

4 个答案:

答案 0 :(得分:0)

似乎不可能"开箱即用"。文档说明电影播放器​​在这些情况下发出通知:

When the movie player begins playing, is paused, or begins seeking forward or backward
When AirPlay playback starts or ends
When the scaling mode of the movie changes
When the movie enters or exits fullscreen mode
When the load state for network-based movies changes
When meta-information about the movie itself becomes available

所以没有办法知道控件何时隐藏/显示。

如果您只想显示一次视图,在用户打开视图后,您可以非常轻松地实现这一点,例如使用动画:

-(void)addOverLayView:(NSNotification*)aNotification{
    UIWindow *window = (UIWindow *)aNotification.object;

    if (window != self.view.window) {
        [window addSubview:anyCustomview];

        [UIView animateWithDuration:2 //choose a fitting value here
                              delay:3 //this has to be chosen experimentally if you want it to match with the timing of when the controls hide
                            options:UIViewAnimationOptionCurveEaseOut
                         animations:^{
                             anyCustomView.alpha = 0.0f; //fadeout animation, you can leave this block empty to have no animation
                       } completion:^(BOOL finished) {
                             [anyCustomView removeFromSuperview];
                       }];
    }
}

请注意,当用户丢弃控件时,这不会隐藏您的视图。

如果你想在每次显示/隐藏控件时显示/隐藏你的视图,它会变得更加棘手。一种方法是禁用标准控件并重新创建它们 - 请记住这并不容易。

答案 1 :(得分:0)

这很糟糕,但确实有效。

//
//  ViewController.m
//

#import "ViewController.h"

@interface ViewController ()

@property UIWebView *webView;

@property UIWindow *playerWindow;
@property UIView *customView;
@property UIView *transitionView;
@property NSTimer *timer;

@end

@implementation ViewController

-(void)loadView
{
    self.view = [[UIView alloc] initWithFrame:[UIScreen mainScreen].bounds];
    _webView = [[UIWebView alloc] initWithFrame:[UIScreen mainScreen].bounds];
    [self.view addSubview:_webView];

    [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(addOverLayView:) name:UIWindowDidBecomeVisibleNotification object:nil];

}

-(void)addOverLayView:(NSNotification*)aNotification
{
    UIWindow *window = (UIWindow *)aNotification.object;
    _customView = [UIView new];
    _customView.backgroundColor = [UIColor yellowColor];
    _customView.frame = CGRectMake(0, [UIScreen mainScreen].bounds.size.height - 80, [UIScreen mainScreen].bounds.size.width, 80);
    _customView.alpha = 0.0;
    if (window != self.view.window)
    {
        _playerWindow = window;
        [_playerWindow addSubview:_customView];
        _timer = [NSTimer scheduledTimerWithTimeInterval:0.1 target:self selector:@selector(timerMethod) userInfo:nil repeats:YES];
    }
}

- (void)timerMethod
{
    if(_transitionView)
    {
        UIView *view = [_transitionView.subviews lastObject];
        view = [view.subviews lastObject];
        for(UIView *subView in view.subviews)
        {
            if([subView.layer.sublayers count])
            {
                CALayer *finalLayer = [subView.layer.sublayers lastObject];
                CAAnimation *animation = [finalLayer animationForKey:@"opacity"];
                if(animation)
                {
                    if(finalLayer.opacity)
                    {
                        [UIView animateWithDuration:animation.duration delay:0.0 options:UIViewAnimationOptionCurveEaseInOut animations:^{
                        _customView.alpha = 1.0;} completion:nil];
                    }
                    else
                    {
                        [UIView animateWithDuration:animation.duration delay:0.0 options:UIViewAnimationOptionCurveEaseInOut animations:^{
                            _customView.alpha = 0.0;} completion:nil];
                    }
                } 
            }
        }
    }
    else
    {
        for(id view in _playerWindow.subviews)
        {
            NSString *className = [NSString stringWithFormat:@"%@", [view class]];
            if([className isEqualToString:@"UITransitionView"])
            {
                _transitionView = view;
                break;
            }
        }

    }
}

- (void)viewDidLoad {
    [super viewDidLoad];
    NSString *fullURL = @"http://www.youtube.com";
    NSURL *url = [NSURL URLWithString:fullURL];
    NSURLRequest *requestObj = [NSURLRequest requestWithURL:url];
    [_webView loadRequest:requestObj];
}

@end

答案 2 :(得分:0)

您可以使用iOS-JavaScript桥来完成此任务。

您可以在WebView中加载脚本,以观察某些元素或其属性更改。 并使用Bridge在您的java脚本和Native iOS代码之间进行通信。

您可以查看以下参考资料以获取更多帮助。 https://developer.apple.com/library/content/documentation/AppleApplications/Conceptual/SafariJSProgTopics/ObjCFromJavaScript.html#//apple_ref/doc/uid/30001215-BBCBFJCD

如果您足够强大,可以使用HTML创建此类视图,也可以在播放器上添加HTML叠加视图。

答案 3 :(得分:0)

您可以添加从中心透明并从边框着色的图像