美文网首页iOS表格绘制
iOS与H5交互(WKWbebView)

iOS与H5交互(WKWbebView)

作者: hello_小磊 | 来源:发表于2019-02-22 16:13 被阅读0次

    前言:

    在iOS开发中,或多或少的会嵌入一些H5页面,有时候需要原生代码和H5页面进行交互。iOS8开始苹果推出性能更强大的WKWebView,所以一下方法是关于WKWebView与JS的交互。

    创建WKWebView:

    遵守协议

    -(WKWebView *)wkwebview

    {

     if (!_wkwebview) {

     _wkwebview = [[WKWebView alloc] initWithFrame:CGRectMake(0, HeightSignal, ScreenWidth, ScreenHeight-HeightSignal-HeightBottomSafe)];

     _wkwebview.scrollView.backgroundColor = [UIColor whiteColor];

     _wkwebview.navigationDelegate = self;

     _wkwebview.UIDelegate = self;

    [self.view addSubview:_wkwebview];

        }

     return _wkwebview;

    }

    顶部网页加载进度条:

    self.progressView = [[UIProgressView alloc] initWithFrame:CGRectMake(0, HeightSignal, [[UIScreen mainScreen] bounds].size.width, 2)];

     self.progressView.backgroundColor = [UIColor blueColor];

        //设置进度条的高度,下面这句代码表示进度条的宽度变为原来的1倍,高度变为原来的1.5倍.

     self.progressView.transform = CGAffineTransformMakeScale(1.0f, 1.5f);

    [self.view addSubview:self.progressView];

    [self.wkwebview addObserver:self forKeyPath:@"estimatedProgress" options:NSKeyValueObservingOptionNew context:nil];//进度监听

    #pragma mark 加载进度监听

    - (void)observeValueForKeyPath:(NSString *)keyPath ofObject:(id)object change:(NSDictionary *)change context:(void *)context {

     if ([keyPath isEqualToString:@"estimatedProgress"]) {

     self.progressView.progress = self.wkwebview.estimatedProgress;

     if (self.progressView.progress == 1) {

     /*

                 *添加一个简单的动画,将progressView的Height变为1.4倍,在开始加载网页的代理中会恢复为1.5倍

                 *动画时长0.25s,延时0.3s后开始动画

                 *动画结束后将progressView隐藏

                 */

     __weak typeof (self)weakSelf = self;

    [UIView animateWithDuration:0.25f delay:0.3f options:UIViewAnimationOptionCurveEaseOut animations:^{

    weakSelf.progressView.transform = CGAffineTransformMakeScale(1.0f, 1.4f);

    } completion:^(BOOL finished) {

    weakSelf.progressView.hidden = YES;

                }];

            }

    }else{

    [super observeValueForKeyPath:keyPath ofObject:object change:change context:context];

        }

    }

    添加JS事件监控:

    -(void)viewWillAppear:(BOOL)animated

    {

    [super viewWillAppear:animated];

    [self.wkwebview.configuration.userContentController addScriptMessageHandler:self name:@"share"];//分享

    }

    移除JS事件监控:

    -(void)viewWillDisappear:(BOOL)animated

    {

    [super viewWillDisappear:animated];

    [self.wkwebview.configuration.userContentController removeScriptMessageHandlerForName:@"share"];//分享

    }

    监听方法:

    -(void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message

    {

     if ([message.name isEqualToString:@"share"]) {

            }

    }

    相关文章

      网友评论

        本文标题:iOS与H5交互(WKWbebView)

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