WKWebView常见功能及如何返回上级界面

1、WKWebView的简单初始化

- (WKWebView *)webView{
    if (_webView == nil) {
        _webView = [[WKWebView alloc] initWithFrame:self.sContentView.bounds];
        [_webView setAutoresizingMask:UIViewAutoresizingFlexibleWidth | UIViewAutoresizingFlexibleHeight];
        [_webView setNavigationDelegate:self];
        [_webView setUIDelegate:self];
        [_webView setMultipleTouchEnabled:YES];
        [_webView setAutoresizesSubviews:YES];
        [_webView.scrollView setAlwaysBounceVertical:YES];
        // 这行代码可以是侧滑返回webView的上一级,而不是根控制器(*只针对侧滑有效)
        [_webView setAllowsBackForwardNavigationGestures:true];
    }
    return _webView;
}

至于如何加载webView用法和UIWebViewle类似,自行百度,下面介绍r如何返回上一层,代码结合ReactiveCocoa,ReactiveCocoa的简单使用

@weakify(self)
    // 返回按钮
    [self.baseView.navView addSubview:self.backBtn];
    [[self.backBtn rac_signalForControlEvents:UIControlEventTouchUpInside] subscribeNext:^(id x) {
        @strongify(self)
        if ([self.webView canGoBack]) {
            [self.webView goBack];
        } else {
            [self.viewModel.services popViewModelAnimated:YES];
        }
    }];

如果要做到类似于微信里面的返回上一级出现有好的提示,可以采用ReactiveCocoa非常牛逼的监听机制:

// 绑定关闭按钮
    RAC(self.baseView.popBtn, hidden) = [RACObserve(self.webView, canGoBack) map:^id(NSNumber *canGoBackNum) {
        @strongify(self)
        if (canGoBackNum.boolValue) {
            [self.backBtn setTitle:@"返回" forState:UIControlStateNormal];
        } else {
            [self.backBtn setTitle:@"" forState:UIControlStateNormal];
        }
        [self.backBtn sizeToFit];

        return @(!canGoBackNum.boolValue);
    }];

现在好多APP都会在导航栏下方添加进度条,提醒用户webView的加载进度,这在WKWebView中实现起来也非常简单,只需自定义UIProgressView即可:

// 监听进度
    [RACObserve(self.webView, estimatedProgress) subscribeNext:^(id x) {
        @strongify(self)

        [self.progressView setAlpha:1.0f];

        BOOL animated = self.webView.estimatedProgress > self.progressView.progress;
        [self.progressView setProgress:self.webView.estimatedProgress animated:animated];

        if(self.webView.estimatedProgress >= 1.0f) {
            [UIView animateWithDuration:0.3f delay:0.3f options:UIViewAnimationOptionCurveEaseOut animations:^{
                [self.progressView setAlpha:0.0f];

            } completion:^(BOOL finished) {
                [self.progressView setProgress:0.0f animated:NO];
            }];
        }
    }];
  • 1
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
要在 WKWebView 中实现侧滑返回功能,你可以按照以下步骤进行操作: 1. 首先,确保你的 WKWebView 处于导航栈中的顶层。这是因为侧滑返回通常与导航控制器 (UINavigationController) 关联。 2. 然后,获取 WKWebView 的 UIScrollView 对象。你可以通过遍历 WKWebView 的 subviews 属性找到它。例如,使用下面的代码: ```swift extension UIView { func findScrollView() -> UIScrollView? { if let scrollView = self as? UIScrollView { return scrollView } for subview in subviews { if let scrollView = subview.findScrollView() { return scrollView } } return nil } } // 在你的视图控制器中调用该方法来获取 WKWebView 的 UIScrollView 对象 if let scrollView = webView.findScrollView() { // 在这里进行后续操作 } ``` 3. 为 UIScrollView 添加一个 UIPanGestureRecognizer 手势识别器,并实现手势的处理方法。在手势处理方法中,你可以检测到用户的滑动手势并执行相应的操作。例如,你可以使用下面的代码: ```swift let swipeBackGesture = UIPanGestureRecognizer(target: self, action: #selector(handleSwipeBackGesture(_:))) scrollView.addGestureRecognizer(swipeBackGesture) @objc func handleSwipeBackGesture(_ gesture: UIPanGestureRecognizer) { let translation = gesture.translation(in: webView) let velocity = gesture.velocity(in: webView) switch gesture.state { case .began: if velocity.x > 0 && translation.x > 0 && scrollView.contentOffset.x <= 0 { // 在开始拖动时,检测到向右滑动的手势,并且 webView 的 contentOffset.x 小于等于 0 // 在这里执行你想要的操作,例如返回上一级页面 } case .changed: // 在拖动过程中,你可以根据需要执行一些操作 case .ended, .cancelled: // 手势结束或取消时,你可以根据需要执行一些操作 default: break } } ``` 在上述代码中,我们通过手势的位移和速度等信息来判断用户是否进行了向右滑动的操作。如果满足条件,你可以执行相应的操作,例如返回上一级页面。 希望以上信息对你有帮助!如果还有其他问题,请随时提问。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值