• WKWebview点击图片查看大图


    大家都知道,WKWebview是没有查看大图的属性或者方法的,所以只能通过js与之交互来实现这一功能,原理:通过js获取页面的图片,把它存放到数组,给图片添加点击事件,通过index显示大图就行了

    其实很简单,给WKWebview写个类别,添加两个方法就行了,然后在WKWebview的两个协议中调用下这两个方法就行了

    首先声明个数组来接收图片数组,可是有个问题,那就是类别是声明不了属性的,那怎么办呢?我们可以通过runtime来设置属性,runtime非常有用,我们以后的篇章会说到。

    static char imgUrlArrayKey;

    - (void)setMethod:(NSArray *)imgUrlArray

    {

        objc_setAssociatedObject(self, &imgUrlArrayKey, imgUrlArray,OBJC_ASSOCIATION_RETAIN_NONATOMIC);

    }

    - (NSArray *)getImgUrlArray

    {

        returnobjc_getAssociatedObject(self, &imgUrlArrayKey);

    }

    这样就声明了个数组

    方法一:通过js获取网页图片数组

    /*

     *通过js获取htlm中图片url

     */

    -(NSArray *)getImageUrlByJS:(WKWebView *)wkWebView

    {

        //查看大图代码

        //js方法遍历图片添加点击事件返回图片个数

        static  NSString * const jsGetImages =

        @"function getImages(){

        var objs = document.getElementsByTagName("img");

        var imgUrlStr='';

        for(var i=0;i<objs.length;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获取全部图片

        [wkWebView evaluateJavaScript:jsGetImages completionHandler:^(id Result,NSError * error) {

            NSLog(@"js___Result==%@",Result);

            NSLog(@"js___Error -> %@", error);

        }];

        

        NSString *js2=@"getImages()";

        

        __block NSArray *array=[NSArray array];

        [wkWebView evaluateJavaScript:js2 completionHandler:^(id Result, NSError * error) {

            NSLog(@"js2__Result==%@",Result);

            NSLog(@"js2__Error -> %@", error);

            

            NSString *resurlt=[NSString stringWithFormat:@"%@",Result];

            

            if([resurlt hasPrefix:@"#"])

            {

                resurlt=[resurlt substringFromIndex:1];

            }

            NSLog(@"result===%@",resurlt);

            array=[resurlt componentsSeparatedByString:@"#"];

            NSLog(@"array====%@",array);

            [wkWebView setMethod:array];

        }];

        

        return array;

    }

    方法二:显示大图

    //显示大图

    -(BOOL)showBigImage:(NSURLRequest *)request

    {

        //将url转换为string

        NSString *requestString = [[request URL] absoluteString];

        

        //hasPrefix 判断创建的字符串内容是否以pic:字符开始

        if ([requestString hasPrefix:@"myweb:imageClick:"])

        {

            NSString *imageUrl = [requestStringsubstringFromIndex:@"myweb:imageClick:".length];

            NSLog(@"image url------%@", imageUrl);

            

            NSArray *imgUrlArr=[self getImgUrlArray];

            NSInteger index=0;

            for (NSInteger i=0; i<[imgUrlArr count]; i++) {

                if([imageUrl isEqualToString:imgUrlArr[i]])

                {

                    index=i;

                    break;

                }

            }

            

            [WFImageUtilshowImgWithImageURLArray:[NSMutableArrayarrayWithArray:imgUrlArr] index:index myDelegate:nil];

            

            return NO;

        }

        returnYES;

    }

    在WKWebview协议中调用上面两个类别的方法

    // 类似 UIWebView 的 -webViewDidFinishLoad:

    - (void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation*)navigation

    {

        //通过js获取htlm中图片url

        [webView getImageUrlByJS:webView];

    }

    // 类似 UIWebView 的 -webView: shouldStartLoadWithRequest: navigationType:

    - (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler {

        

        [webView showBigImage:navigationAction.request];

        

        decisionHandler(WKNavigationActionPolicyAllow);

    }

  • 相关阅读:
    C#设计一个简单的计算器,实现两个数的加,减,乘,除,求幂等计算,运行效果如下图所示:
    如何用C#中的窗体设计一款只含有加减乘除,求平方的简易版计算器?
    番外篇科普为什么1024是程序员日?2020年10月24日,程序员为啥都不放假?
    VS2019基础,C#编辑窗体时,工具箱如何调用,工具箱挡住窗体怎么办,如何改窗体名字
    C++用函数重载实现两个整数和三个浮点数的排序,按照从小到大的顺序将排序结果输出
    C++用引用形参实现两个变量的值互换
    C++用带有默认参数的函数实现,求2个或3个正整数中的最大数
    linux服务器磁盘速度测试
    CSS HACK收集
    分享一个web页面背景全屏的jquery插件Fullscreen Background
  • 原文地址:https://www.cnblogs.com/starainDou/p/5115293.html
Copyright © 2020-2023  润新知