效果
思路:
1. webview加载url,js交互图片插入点击事件、获取图片数组和图片宽高比数组.
2.点击webview上的图片,计算图片在Windows上的位置,添加UIImageView到Windows上然后动画全屏显示,动画结束后使用三方的图片浏览
3.当三方的图片浏览消失后,判断浏览的最后一张图片是否是第一次点击的图片,如果是动画返回原来的位置后移除,不是动画透明消失后移除
1.插入js代码，给图片添加点击事件
[webViewstringByEvaluatingJavaScriptFromString:@"\
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(){\
getImage(this.src,this.getBoundingClientRect().top,this.clientWidth/this.clientHeight );\
}\
}\
};\
assignImageClickAction();"];
//插入js代码，获取所有图片宽高比
id object = [webView stringByEvaluatingJavaScriptFromString:@"\
function getImages(){\
var objs = document.getElementsByTagName(\"img\");\
var imgScr = '';\
for(var i=0;i
if(i === objs.length-1) \
imgScr = imgScr + objs[i].src;\
else\
imgScr = imgScr + objs[i].src + '+';\
};\
return imgScr;\
};\
getImages();" ] ;
self.imageArray = [NSMutableArray arrayWithArray:[object componentsSeparatedByString:@"+"]];
//插入js代码，获取所有图片
id object1 = [webView stringByEvaluatingJavaScriptFromString:@"\
function getImages(){\
var objs = document.getElementsByTagName(\"img\");\
var imgScr = '';\
for(var i=0;i
if(i === objs.length-1) \
imgScr = imgScr + objs[i].clientWidth/objs[i].clientHeight;\
else\
imgScr = imgScr + objs[i].clientWidth/objs[i].clientHeight + '+';\
};\
return imgScr;\
};\
getImages();" ] ;
self.WHArray = [NSMutableArray arrayWithArray:[object1 componentsSeparatedByString:@"+"]];
2.计算位置、显示图片浏览
__weak typeof(self) weakSelf = self;
self.context[@"getImage"] = ^(){
NSArray*args = [JSContextcurrentArguments];
dispatch_async(dispatch_get_main_queue(), ^{
weakSelf.bigImage_url= [NSStringstringWithFormat:@"%@",args[0]];
CGFloat y = [[NSStringstringWithFormat:@"%@",args[1]]floatValue]+self.commentariesTableView.y-self->consetY+Navigation_height;
CGFloath = (WIDTH-30)/[[NSStringstringWithFormat:@"%@",args[2]]floatValue];
weakSelf.bigImage_rect=CGRectMake(15, y,WIDTH-30, h);
weakSelf.bigImageView= [[UIImageViewalloc]initWithFrame:weakSelf.bigImage_rect];
[weakSelf.bigImageViewsd_setImageWithURL:[NSURLURLWithString:weakSelf.bigImage_url]];
[WINDOWS_ViewaddSubview:weakSelf.bigImageView];
CGFloath1 =WIDTH/[[NSStringstringWithFormat:@"%@",args[2]]floatValue];
[UIView animateWithDuration:0.5 animations:^{
weakSelf.bigImageView.frame=CGRectMake(0, (HEIGHT- h1)/2,WIDTH, h1);
}completion:^(BOOLfinished) {
weakSelf.view.userInteractionEnabled=YES;
HZPhotoBrowser*browserVc = [[HZPhotoBrowseralloc]init];
browserVc.imageCount= weakSelf.imageArray.count;// 图片总数
browserVc.currentImageIndex= [weakSelf.imageArrayindexOfObject:weakSelf.bigImage_url];//当前点击的图片
browserVc.delegate= weakSelf;
[browserVcshow];
}];
});
};
3.移除
//图片浏览移除后 imageview消失移除
- (void)dismissViewControllerIndex:(NSInteger)tag {
if (tag == [self.imageArray indexOfObject:self.bigImage_url]) {
[UIView animateWithDuration:0.5 animations:^{
self.bigImageView.frame = self.bigImage_rect;
}completion:^(BOOLfinished) {
[self.bigImageView removeFromSuperview];
}];
}else{
[UIView animateWithDuration:0.5 animations:^{
self.bigImageView.alpha=0;
}completion:^(BOOLfinished) {
[self.bigImageView removeFromSuperview];
}];
}
}
//图片浏览滑动后imageview的位置修改
- (void)didScrollviewCurrentIndex:(NSInteger)index {
CGFloatw =WIDTH;
CGFloath = w/[self.WHArray[index]floatValue];
CGFloatx =0;
CGFloaty = (HEIGHT- h)/2;
[self.bigImageView sd_setImageWithURL:[NSURL URLWithString:self.imageArray[index]]];
self.bigImageView.frame=CGRectMake(x, y, w, h);
}
网友评论