我們都知道近刘,WKWebview是沒有查看大圖的屬性或者方法的,所以只能通過(guò)js與之交互來(lái)實(shí)現(xiàn)這一功能宁昭,原理:通過(guò)js獲取頁(yè)面的圖片跌宛,把它存放到數(shù)組,給圖片添加點(diǎn)擊事件积仗,通過(guò)index顯示大圖就行了其實(shí)很簡(jiǎn)單疆拘,給WKWebview寫個(gè)類別,添加兩個(gè)方法就行了寂曹,然后在WKWebview的兩個(gè)協(xié)議中調(diào)用下這兩個(gè)方法就行了
第一步:
首先聲明個(gè)數(shù)組來(lái)接收?qǐng)D片數(shù)組哎迄,可是有個(gè)問(wèn)題,那就是類別是聲明不了屬性的隆圆,那怎么辦呢漱挚?我們可以通過(guò)runtime來(lái)設(shè)置屬性,runtime非常有用渺氧,我們以后的篇章會(huì)說(shuō)到旨涝。
staticcharimgUrlArrayKey;
- (void)setMethod:(NSArray*)imgUrlArray
{
? ??objc_setAssociatedObject(self, &imgUrlArrayKey, imgUrlArray,?OBJC_ASSOCIATION_RETAIN_NONATOMIC);
}
- (NSArray*)getImgUrlArray
{
? ??returnobjc_getAssociatedObject(self, &imgUrlArrayKey);
}
這樣就聲明了個(gè)數(shù)組
第二步:
方法一:通過(guò)js獲取網(wǎng)頁(yè)圖片數(shù)組
/*
*通過(guò)js獲取htlm中圖片url
?*/
-(NSArray*)getImageUrlByJS:(WKWebView*)wkWebView {
? ??//查看大圖代碼
? ??//js方法遍歷圖片添加點(diǎn)擊事件返回圖片個(gè)數(shù)
staticNSString*constjsGetImages =
? ??@"function getImages(){\
? ? var objs = document.getElementsByTagName(\"img\");\
? ? var imgUrlStr='';\
? ? for(var i=0;i
? ? if(i==0){\
? ? if(objs[i].alt==''){\
? ? imgUrlStr=objs[i].src;\
? ? }\
? ? }else{\
? ? if(objs[i].alt==''){\
? ? imgUrlStr+='#'+objs[i].src;\
? ? }\
? ? }\
? ? objs[i].onclick=function(){\
? ? if(this.alt==''){\
? ? document.location=\"myweb:imageClick:\"+this.src;\
? ? }\
? ? };\
? ? };\
? ? return imgUrlStr;\
};";
? ? //用js獲取全部圖片
[wkWebViewevaluateJavaScript:jsGetImagescompletionHandler:^(idResult,NSError* error) {
NSLog(@"js___Result==%@",Result);
? ? ? ??NSLog(@"js___Error -> %@", error);
? ? }];
? ??NSString?*js2=@"getImages()";
__blockNSArray*array=[NSArrayarray];
[wkWebViewevaluateJavaScript:js2completionHandler:^(idResult,NSError* error) {
NSLog(@"js2__Result==%@",Result);
? ? ? ??NSLog(@"js2__Error -> %@", error);
NSString*resurlt=[NSStringstringWithFormat:@"%@",Result];
if([resurlthasPrefix:@"#"])
? ? ? ? {
resurlt=[resurltsubstringFromIndex:1];
? ? ? ? }
NSLog(@"result===%@",resurlt);
? ? ? ? array=[resurlt?componentsSeparatedByString:@"#"];
NSLog(@"array====%@",array);
[wkWebViewsetMethod:array];
? ? }];
returnarray;
}
第三步:
在加載頁(yè)面導(dǎo)入頭文件,#import "WKWebView+HtmlImages.h"侣背;#import "SDPhotoBrowser.h"http:// 圖片瀏覽器白华;然后實(shí)現(xiàn)wkWebView的代理方法。
// 頁(yè)面加載完成之后調(diào)用
- (void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation {
? ? //通過(guò)js獲取htlm中圖片url
? ? [self.wkWebView getImageUrlByJS:webView];
}
第四步:
#pragma mark - WKNavigationDelegate
- (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler {
? ? NSURL *URL = navigationAction.request.URL;
? ? NSString *scheme = [URL scheme];
? ? //前綴
? ? NSString *path = [navigationAction.request.URL.absoluteString stringByRemovingPercentEncoding];
?if ([scheme isEqualToString:@"myweb"]){
? ? ? ? if ([path hasPrefix:@"myweb:imageClick:"]){
? ? ? ? ? ? NSString *imageUrl = [path substringFromIndex:@"myweb:imageClick:".length];
? ? ? ? ? ? NSLog(@"image url------%@", imageUrl);
? ? ? ? ? ? NSArray *imgUrlArr=[self.wkWebView getImgUrlArray];
? ? ? ? ? ? if (imgUrlArr.count == 0) {
? ? ? ? ? ? ? ? NSMutableArray *tempArray = [[NSMutableArray alloc] init];
? ? ? ? ? ? ? ? [tempArray addObject:imageUrl];
? ? ? ? ? ? ? ? imgUrlArr = [tempArray copy];
? ? ? ? ? ? }
? ? ? ? ? ? NSInteger index=0;
? ? ? ? ? ? for (NSInteger i=0; i<[imgUrlArr count]; i++) {
? ? ? ? ? ? ? ? DLog(@"imgUrlArr == %@",imgUrlArr[i]);
? ? ? ? ? ? ? ? if([imageUrl isEqualToString:imgUrlArr[i]]) {
? ? ? ? ? ? ? ? ? ? index=i;
? ? ? ? ? ? ? ? ? ? SDPhotoBrowser *browser = [[SDPhotoBrowser alloc] init];
? ? ? ? ? ? ? ? ? ? browser.sourceImagesContainerView = self.view; // 原圖的父控件
? ? ? ? ? ? ? ? ? ? browser.imageCount = imgUrlArr.count; // 圖片總數(shù)
? ? ? ? ? ? ? ? ? ? browser.currentImageIndex = index;
? ? ? ? ? ? ? ? ? ? browser.delegate = self;
? ? ? ? ? ? ? ? ? ? [browser show];
? ? ? ? ? ? ? ? ? ? break;
? ? ? ? ? ? ? ? }
? ? ? ? ? ? }
? ? ? ? }
? ? }
? ? decisionHandler(WKNavigationActionPolicyAllow);
}