ios webView简单点击展示图片

  • 在webView中的代理方法中插入js代码,对图片进行点击操作
- (void)webViewDidFinishLoad:(IMYWebView *)webView
{
   self.finishLoad = YES;

   //    插入js代码,对图片进行点击操作
   [webView evaluateJavaScript:@"function assignImageClickAction(){var imgs=document.getElementsByTagName('img');var length=imgs.length;for(var i=0; i < length;i++){img=imgs[i];if(\"ad\" ==img.getAttribute(\"flag\")){var parent = this.parentNode;if(parent.nodeName.toLowerCase() != \"a\")return;}img.onclick=function(){window.location.href='image-preview:'+this.src}}}" completionHandler:^(id object, NSError *error) {
       
   }];
   [webView evaluateJavaScript:@"assignImageClickAction();" completionHandler:^(id object, NSError *error) {
       
   }];

   //获取HTML中的图片
   [self getImgs];
   
}
  • 获取文章图片个数的方法
#pragma mark -- 获取文章中的图片个数
- (NSArray *)getImgs
{

    NSMutableArray *arrImgURL = [[NSMutableArray alloc] init];
    for (int i = 0; i < [self nodeCountOfTag:@"img"]; i++) {
        NSString *jsString = [NSString stringWithFormat:@"document.getElementsByTagName('img')[%d].src", i];
        [_htmlWebView evaluateJavaScript:jsString completionHandler:^(NSString *str, NSError *error) {

            if (error ==nil) {
                [arrImgURL addObject:str];
            }

        }];
    }
    _imageArray = [NSMutableArray arrayWithArray:arrImgURL];


    return arrImgURL;
}

// 获取某个标签的结点个数
- (NSInteger)nodeCountOfTag:(NSString *)tag
{

    NSString *jsString = [NSString stringWithFormat:@"document.getElementsByTagName('%@').length", tag];

   int count =  [[_htmlWebView stringByEvaluatingJavaScriptFromString:jsString] intValue];

    return count;
}
  • 在webView中的代理方法中获取到图片的url
-(BOOL)webView:(IMYWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request
             navigationType:(UIWebViewNavigationType)navigationType
{
    if ([request.URL.absoluteString isEqualToString:@"about:blank"])
    {
        return YES;
    }
    if ([request.URL.scheme isEqualToString: @"image-preview"])
    {
        NSString *url = [request.URL.absoluteString substringFromIndex:14];
        //启动图片浏览器, 跳转到图片浏览页面
        if (_imageArray.count != 0) {
            [self showBigImage:url];
        }
        return NO;
    }
  • 创建灰色背景及显示图片
-(void)showBigImage:(NSString *)imageUrl{
   //创建灰色透明背景,使其背后内容不可操作
   UIView *bgView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, LAScreenWidth, LAScreenHeight)];
   UITapGestureRecognizer * removeTap = [[UITapGestureRecognizer alloc]initWithTarget:self action:@selector(removeBigImage)];
   [bgView addGestureRecognizer:removeTap];
   [bgView setBackgroundColor:[UIColor colorWithRed:0.3
                                              green:0.3
                                               blue:0.3
                                              alpha:1]];
   self.bgView = bgView;
   [[UIApplication sharedApplication].keyWindow addSubview:self.bgView];

   //创建显示图像视图
  UIImageView *imgView = [[UIImageView alloc] initWithFrame:bgView.frame];
   imgView.contentMode = UIViewContentModeScaleAspectFit;    
   imgView.userInteractionEnabled = YES;
   [imgView sd_setImageWithURL:[NSURL URLWithString:imageUrl]];
   [bgView addSubview:imgView];

   //添加捏合手势  
   [imgView addGestureRecognizer:[[UIPinchGestureRecognizer alloc]initWithTarget:self action:@selector(handlePinch:)]];
   UITapGestureRecognizer * imgRemove = [[UITapGestureRecognizer alloc]initWithTarget:self action:@selector(removeBigImage)];
   [imgView addGestureRecognizer:imgRemove];

}
  • 关闭视图
-(void)removeBigImage
{
    [self.bgView removeFromSuperview];
}
  • 设置放大缩放比例
- (void) handlePinch:(UIPinchGestureRecognizer*) recognizer
{
    //缩放:设置缩放比例
    recognizer.view.transform = CGAffineTransformScale(recognizer.view.transform, recognizer.scale, recognizer.scale);
    recognizer.scale = 1;
}
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 发现 关注 消息 iOS 第三方库、插件、知名博客总结 作者大灰狼的小绵羊哥哥关注 2017.06.26 09:4...
    肇东周阅读 12,259评论 4 61
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 173,663评论 25 708
  • 计算机系统-JZP Part1 11000100+11100111=10101011(丢失进位1,且结果不正确) ...
    ZoeyeoZ阅读 176评论 0 1
  • 近来,心情起伏不定,生活的琐事煞费人心。亲情,友情,责任等等错综交杂,心情焦灼烦闷。愁云催人老,短短的半月对镜容衰...
    菩提院落阅读 328评论 2 2
  • 分娩时最常出现的问题之一,就是医院的产房只能进去一人,这个时候你是让老公陪产,还是让导乐陪产呢?这篇文章帮你分析分...
    妈咪学多多高效孕育课阅读 976评论 0 0