1:设置代理
@interface WkWebViewController ()<WKNavigationDelegate,WKUIDelegate>//网页内容 _webView = [[WKWebView alloc] initWithFrame:CGRectMake(0, 64, kScreenWidth - 64, kScreenHeight)]; _webView.userInteractionEnabled = YES; _webView.navigationDelegate = self; _webView.UIDelegate = self;2:实现代理方法。假设需要交互的是,在webview界面,点击包含图片的a标签,需要弹出图片浏览并保存的功能。
a标签的显示为:
bytedance://large_image?url=http://static.lingfo.com/upload/bbs/2017-02-27/c18bc717-d737-4841-90ee-9b93257ea3e5.png&index=0其中“bytedance://large_image”这个是判断条件。index=0,是显示的第1张图片。中间url=http://....png是图片的链接URL。根据要求,点击A标签需要弹出对应图片,并浏览文章所有的图片和保存本地的功能。
#PRagma mark - WKNavigationDelegate// 类似 UIWebView的 -webView: shouldStartLoadWithRequest: navigationType:- (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler { NSString *strRequest = [navigationAction.request.URL.absoluteString stringByReplacingPercentEscapesUsingEncoding:NSUTF8StringEncoding]; if([strRequest isEqualToString:@"about:blank"]) {//主页面加载内容 decisionHandler(WKNavigationActionPolicyAllow);//允许跳转 } else if([strRequest containsString:@"bytedance://large_image"]){//截获页面里面的链接点击 //do something you want decisionHandler(WKNavigationActionPolicyCancel);//不允许跳转 NSLog(@"%@",strRequest); NSRange range = [strRequest rangeOfString:@"index="]; NSString *indexStr = [strRequest substringFromIndex:range.location+range.length]; [self showBigPicWithIndex:[indexStr integerValue]]; }else{ //截获页面里面的链接点击 //do something you want decisionHandler(WKNavigationActionPolicyCancel);//不允许跳转 } }-(WKWebView *)webView:(WKWebView *)webView createWebViewWithConfiguration:(WKWebViewConfiguration *)configuration forNavigationAction:(WKNavigationAction *)navigationAction windowFeatures:(WKWindowFeatures *)windowFeatures{ if (!navigationAction.targetFrame.isMainFrame) { [webView loadRequest:navigationAction.request]; } return nil; }至此,完成了交互。对于点击图片查看大图,使用的第三方框架SDPhotoBrowser。
//self.picPathURLArray:从返回的数据中拿到所有图片的URL链接。-(void)showBigPicWithIndex:(NSInteger)index{ SDPhotoBrowser *brower = [[SDPhotoBrowser alloc]init]; brower.currentImageIndex = index; brower.sourceImagesContainerView = self.webView; brower.imageCount = self.picPathURLArray.count; brower.delegate = self; [brower show];}#pragma mark - SDPhotoBrowersDelegate-(NSURL *)photoBrowser:(SDPhotoBrowser *)browser highQualityImageURLForIndex:(NSInteger)index{ NSURL *url = self.picPathURLArray[index]; return url;}-(UIImage *)photoBrowser:(SDPhotoBrowser *)browser placeholderImageForIndex:(NSInteger)index{ UIImage *image = [UIImage imageNamed:@"image_default"]; return image;}使用WKWebView时,使用的懒加载的方法,滚动到即将出现图片的位置时,图片再显示出来。节省省流量并节省加载时间。需要与后台js数据进行交互,传递一个实时偏移量,让写js代码的实现。#pragma mark - 懒加载-滚动到图片的时候,图片再显示出来。节省省流量并节省加载时间// 页面加载完成之后调用- (void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation{ //第一次的时候 传给服务器屏幕滚动值 NSString *param = [NSString stringWithFormat:@"scrollevent('%f')",kScreenHeight]; [self.webView evaluatejavaScript:param completionHandler:nil]; YJWeakSelf; [_webView evaluateJavascript:@"document.getElementById(/"content/").offsetHeight;" completionHandler:^(id _Nullable result,NSError * _Nullable error) {//result:当前已经看到的webview的高度。 //获取页面高度,并重置webview的frame CGFloat webViewHeight = [result floatValue] + 10.0; //记录wkwebview内容新旧高度 weakSelf.oldWkHeight = webViewHeight; weakSelf.newWkHeight = webViewHeight; CGRect frame =_webView.frame; CGFloat webY = frame.origin.y; if (webViewHeight < kScreenHeight-kNavBarHeight) { webViewHeight = kScreenHeight-kNavBarHeight; } frame.size.height = webViewHeight; weakSelf.webView.frame = frame; //webview的高度加上 webview的y值 CGFloat contentHeight = webY + webViewHeight + 35 + 45; weakSelf.headerView.contentSize = CGSizeMake(kScreenWidth,contentHeight); if (contentHeight > kScreenHeight) { weakSelf.headerView.showsVerticalScrollIndicator = YES; weakSelf.headerView.scrollEnabled = YES; } }]; }#pragma mark - scrollview delegate-(void)scrollViewDidScroll:(UIScrollView *)scrollView{ CGFloat useroff = scrollView.contentOffset.y + kScreenHeight; NSString *param = [NSString stringWithFormat:@"scrollevent('%f')",useroff]; [self.webView evaluateJavaScript:param completionHandler:nil]; YJWeakSelf; [_webView evaluateJavaScript:@"document.getElementById(/"content/").offsetHeight;" completionHandler:^(id _Nullable result,NSError * _Nullable error) { //获取页面高度,并重置webview的frame CGFloat webViewHeight = [result floatValue] + 10.0; weakSelf.oldWkHeight = weakSelf.newWkHeight; weakSelf.newWkHeight = webViewHeight; if (weakSelf.oldWkHeight != weakSelf.newWkHeight) { CGRect frame = _webView.frame; CGFloat webY = frame.origin.y; frame.size.height = webViewHeight; weakSelf.webView.frame = frame; //webview的高度加上 webview的y值 CGFloat contentHeight = webY + webViewHeight + 35 + 45; weakSelf.headerView.contentSize = CGSizeMake(kScreenWidth,contentHeight); if (contentHeight > kScreenHeight) { weakSelf.headerView.showsVerticalScrollIndicator = YES; weakSelf.headerView.scrollEnabled = YES; } } }];}
新闻热点
疑难解答