UIWebView中點擊圖片放大

今天遇到一個問題，要在webview裏面點擊放大圖片。因爲是新手，我便在網上搜集了一下。其中感受這種方法仍是比較不錯的。原文地址：http://my.oschina.net/linxiaoxi1993/blog/465905?p={{page}}

親測，沒問題。

第一步在webView加載完成的代理方法添加這些方法

- (void)webViewDidFinishLoad:(UIWebView *)webView{

    
    //調整字號
    NSString *str = @"document.getElementsByTagName('body')[0].style.webkitTextSizeAdjust= '95%'";
    [webView stringByEvaluatingJavaScriptFromString:str];
    
    //js方法遍歷圖片添加點擊事件 返回圖片個數
    static  NSString * const jsGetImages =
    @"function getImages(){\
    var objs = document.getElementsByTagName(\"img\");\
    for(var i=0;i<objs.length;i++){\
    objs[i].onclick=function(){\
    document.location=\"myweb:imageClick:\"+this.src;\
    };\
    };\
    return objs.length;\
    };";
    
    [webView stringByEvaluatingJavaScriptFromString:jsGetImages];//注入js方法
    
    //注入自定義的js方法後別忘了調用 不然不會生效（不調用也同樣生效了，，，不明白）
    NSString *resurlt = [webView stringByEvaluatingJavaScriptFromString:@"getImages()"];
    //調用js方法
    NSLog(@"---調用js方法--%@  %s  jsMehtods_result = %@",self.class,__func__,resurlt);
}

在處理webView事件的代理方法

- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType{
   
    
    //將url轉換爲string
    NSString *requestString = [[request URL] absoluteString];
    //    NSLog(@"requestString is %@",requestString);
    
    //hasPrefix 判斷建立的字符串內容是否以pic:字符開始
    if ([requestString hasPrefix:@"myweb:imageClick:"]) {
        NSString *imageUrl = [requestString substringFromIndex:@"myweb:imageClick:".length];
        //        NSLog(@"image url------%@", imageUrl);
        
        if (_bgView) {
            //設置不隱藏，還原放大縮小，顯示圖片
            _bgView.hidden = NO;
            _imgView.frame = CGRectMake(10, 10, KScreenWidth-40, 220);
            [_imgView sd_setImageWithURL:[NSURL URLWithString:imageUrl]];
            //[_imgView setImageWithURL:[NSURL URLWithString:imageUrl] placeholderImage:LOAD_IMAGE(@"house_moren")];
        }
        else
            [self showBigImage:imageUrl];//建立視圖並顯示圖片
        
        return NO;
    }
    return YES;
}

放大圖片的一些操做

#pragma mark 顯示大圖片
-(void)showBigImage:(NSString *)imageUrl{
    //建立灰色透明背景，使其背後內容不可操做
    _bgView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, KScreenWidth, KScreenHeight)];
    [_bgView setBackgroundColor:[UIColor colorWithRed:0.3
                                               green:0.3
                                                blue:0.3
                                               alpha:0.7]];
    [self.view addSubview:_bgView];
    
    //建立邊框視圖
    UIView *borderView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, KScreenWidth-20, 240)];
    //將圖層的邊框設置爲圓腳
    borderView.layer.cornerRadius = 8;
    borderView.layer.masksToBounds = YES;
    //給圖層添加一個有色邊框
    borderView.layer.borderWidth = 8;
    borderView.layer.borderColor = [[UIColor colorWithRed:0.9
                                                    green:0.9
                                                     blue:0.9
                                                    alpha:0.7] CGColor];
    [borderView setCenter:_bgView.center];
    [_bgView addSubview:borderView];
    
    //建立關閉按鈕
    UIButton *closeBtn = [UIButton buttonWithType:UIButtonTypeCustom];
    //    [closeBtn setImage:[UIImage imageNamed:@"close.png"] forState:UIControlStateNormal];
    closeBtn.backgroundColor = [UIColor redColor];
    [closeBtn addTarget:self action:@selector(removeBigImage) forControlEvents:UIControlEventTouchUpInside];
    [closeBtn setFrame:CGRectMake(borderView.frame.origin.x+borderView.frame.size.width-20, borderView.frame.origin.y-6, 26, 27)];
    [_bgView addSubview:closeBtn];
    
    //建立顯示圖像視圖
    _imgView = [[UIImageView alloc] initWithFrame:CGRectMake(10, 10, CGRectGetWidth(borderView.frame)-20, CGRectGetHeight(borderView.frame)-20)];
    _imgView.userInteractionEnabled = YES;
    [_imgView sd_setImageWithURL:[NSURL URLWithString:imageUrl]];
    //[imgView setImageWithURL:[NSURL URLWithString:imageUrl] placeholderImage:LOAD_IMAGE(@"house_moren")];
    [borderView addSubview:_imgView];
    
    //添加捏合手勢
    [_imgView addGestureRecognizer:[[UIPinchGestureRecognizer alloc]initWithTarget:self action:@selector(handlePinch:)]];
    
}

//關閉按鈕
-(void)removeBigImage
{
    _bgView.hidden = YES;
}

- (void) handlePinch:(UIPinchGestureRecognizer*) recognizer
{
    //縮放:設置縮放比例
    recognizer.view.transform = CGAffineTransformScale(recognizer.view.transform, recognizer.scale, recognizer.scale);
    recognizer.scale = 1;
}