IOS中实现图片点击全屏预览
//
// ViewController.m
// XWZoomImageView
//
// Created by xiao on 15/11/13.
// Copyright © 2015年 xiao. All rights reserved.
//
#import "ViewController.h"
@interface ViewController ()<UIScrollViewDelegate>
@property (weak, nonatomic) IBOutlet UIImageView *picView;
@property (weak, nonatomic) UIScrollView *scrollView;
@property (weak, nonatomic) UIImageView *lastImageView;
@property (nonatomic, assign)CGRect originalFrame;
@property (nonatomic, assign)BOOL isDoubleTap;
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
self.picView.userInteractionEnabled = YES;
//添加单击手势
UITapGestureRecognizer *tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(showZoomImageView:)];
[self.picView addGestureRecognizer:tap];
}
-(void)showZoomImageView:(UITapGestureRecognizer *)tap
{
if (![(UIImageView *)tap.view image]) {
return;
}
//scrollView作为背景
UIScrollView *bgView = [[UIScrollView alloc] init];
bgView.frame = [UIScreen mainScreen].bounds;
bgView.backgroundColor = [UIColor blackColor];
UITapGestureRecognizer *tapBg = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tapBgView:)];
[bgView addGestureRecognizer:tapBg];
UIImageView *picView = (UIImageView *)tap.view;
UIImageView *imageView = [[UIImageView alloc] init];
imageView.image = picView.image;
imageView.frame = [bgView convertRect:picView.frame fromView:self.view];
[bgView addSubview:imageView];
[[[UIApplication sharedApplication] keyWindow] addSubview:bgView];
self.lastImageView = imageView;
self.originalFrame = imageView.frame;
self.scrollView = bgView;
//最大放大比例
self.scrollView.maximumZoomScale = 1.5;
self.scrollView.delegate = self;
[UIView animateWithDuration:0.5 animations:^{
CGRect frame = imageView.frame;
frame.size.width = bgView.frame.size.width;
frame.size.height = frame.size.width * (imageView.image.size.height / imageView.image.size.width);
frame.origin.x = 0;
frame.origin.y = (bgView.frame.size.height - frame.size.height) * 0.5;
imageView.frame = frame;
}];
}
-(void)tapBgView:(UITapGestureRecognizer *)tapBgRecognizer
{
self.scrollView.contentOffset = CGPointZero;
[UIView animateWithDuration:0.5 animations:^{
self.lastImageView.frame = self.originalFrame;
tapBgRecognizer.view.backgroundColor = [UIColor clearColor];
} completion:^(BOOL finished) {
[tapBgRecognizer.view removeFromSuperview];
self.scrollView = nil;
self.lastImageView = nil;
}];
}
//返回可缩放的视图
-(UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView
{
return self.lastImageView;
}
第二种方法
.h文件-----------------------------------------------------------------
#import
@interface ZoomImage : NSObject
/**
*@brief点击图片放大,再次点击缩小
*
*@param oldImageView 头像所在的imageView
*/
+(void)showImage:(UIImageView*)avatarImageView;
@end
.m文件-----------------------------------------------------------------
#import "ZoomImage.h"
static CGRect oldframe;
@implementation ZoomImage
+(void)showImage:(UIImageView*)avatarImageView
{
UIImage *image =avatarImageView.image;
// 获得根窗口
UIWindow *window =[UIApplication sharedApplication].keyWindow;
UIView *backgroundView =[[UIView alloc]initWithFrame:CGRectMake(0, 0, WIDTH, HEIGHT)];
oldframe =[avatarImageView convertRect:avatarImageView.bounds toView:window];
backgroundView.backgroundColor =[UIColor blackColor];
backgroundView.alpha =0.5;
UIImageView *imageView =[[UIImageView alloc]initWithFrame:oldframe];
imageView.image =image;
imageView.tag =1;
[backgroundView addSubview:imageView];
[window addSubview:backgroundView];
//点击图片缩小的手势
UITapGestureRecognizer *tap =[[UITapGestureRecognizer alloc]initWithTarget:self action:@selector(hideImage:)];
[backgroundView addGestureRecognizer:tap];
[UIView animateWithDuration:0.3 animations:^{
imageView.frame =CGRectMake(0,([UIScreen mainScreen].bounds.size.height-image.size.height*[UIScreen mainScreen].bounds.size.width/image.size.width)/2, [UIScreen mainScreen].bounds.size.width, image.size.height*[UIScreen mainScreen].bounds.size.width/image.size.width);
backgroundView.alpha =1;
}];
}
+(void)hideImage:(UITapGestureRecognizer *)tap{
UIView *backgroundView =tap.view;
UIImageView *imageView =(UIImageView *)[tap.view viewWithTag:1];
[UIView animateWithDuration:0.3 animations:^{
imageView.frame =oldframe;
backgroundView.alpha =0;
} completion:^(BOOL finished) {
[backgroundView removeFromSuperview];
}];
}
IOS中实现图片点击全屏预览的更多相关文章
- IOS 图片全屏预览
如果你感觉累,那就对了那是因为你在走上坡路..这句话似乎有点道理的样子,时常提醒自己无论走到哪都不要忘记自己当初为什么出发.有时想想感觉有的东西可以记录一下,就把它记录下来吧,这次想写一下关于单张图片 ...
- JS 实现全屏预览 F11功能
老是不通过,没办法,只能是重新发布了,反正我就是杠上了,大大小小写过很多前端特效,当然也经常在网上copy或者修改人家的代码,我觉得也挺好的,为什么?!因为我想这样,你能怎么办,打我?少废话,直接上代 ...
- 解决iOS中tabBarItem图片默认颜色的问题(指定代码渲染模式为以原样模式的方式显示出来)
解决iOS中tabBarItem图片默认颜色的问题(指定代码渲染模式为以原样模式的方式显示出来) 解决办法:指定图片的渲染模式(imageWithRenderingMode为:UIImageRende ...
- 可嵌入图片视频jQuery全屏滑块
分享一款可嵌入图片视频jQuery全屏滑块.这是一款可定制的滑块幻灯片代码,支持键盘箭头切换.效果图如下: 在线预览 源码下载 实现的代码. html代码: <script type ...
- Android学习之Android 5.0分享动画实现微信点击全屏效果
Android5.0过渡动画,请看 http://blog.csdn.net/qq_16131393/article/details/51112772 今天用分享动画实现微信点击全屏效果 本文源代码下 ...
- 图片无损放大软件PhotoZoom分屏预览功能 ,简直好用!
PhotoZoom是一款智能放大图片软件,很多用户在初次使用PhotoZoom,发现图片所处的区域上方有四个不同方式的预览选项.因为很多初学者使用时不明白这四个按钮有什么作用,所以小编接下来讲解一下P ...
- 分离与继承的思想实现图片上传后的预览功能:ImageUploadView
本文要介绍的是网页中常见的图片上传后直接在页面生成小图预览的实现思路,考虑到该功能有一定的适用性,于是把相关的逻辑封装成了一个ImageUploadView组件,实际使用效果可查看下一段的git效果图 ...
- web 图片上传实现本地预览
在说上传之前先说说如何替换or美化浏览器自带的简陋上传按钮(自定义自己的上传按钮 如:img): 1.将自定义上传按钮上方添加 input file 框,实现input实现透明处理. 2.对自定义上传 ...
- java多图片上传--前端实现预览--图片压缩 、图片缩放,区域裁剪,水印,旋转,保持比例。
java多图片上传--前端实现预览 前端代码: https://pan.baidu.com/s/1cqKbmjBSXOhFX4HR1XGkyQ 解压后: java后台: <!--文件上传--&g ...
随机推荐
- 注意:php5.4删除了session_unregister函数
在php5.4版本中,应经删除了session_unregister该函数.朋友们注意一下 前几天安装了dedecms系统,当在后台安全退出的时候,后台出现空白,先前只分析其他功能去了,也没太注意安全 ...
- MAC上 nodejs express 安装
最近在MAC上搭建 nodejs环境以及安装 express 框架,遇到了一些问题,不过最后总算还是安装成功了,下面是操作步骤 1.node js 安装 访问nodejs官网进入下载mac上的安装包 ...
- Laravel 5 基础(二)- 路由、控制器和视图简介
查看 app/Http/routes.php Route::get('/', 'WelcomeController@index'); @是一个界定符,前面是控制器,后面是动作,表示当用户请求url / ...
- HDFS命令行操作
启动后可通过命令行使用hadoop. (1)所有命令 (先将$HADOOP_HOME/bin加入到.bashrc的$PATH变量中) [html] view plaincopy [hadoop@nod ...
- [转载]iOS面试题总
转载自:http://blog.sina.com.cn/s/blog_67eb608b0101r6xb.html (2014-06-13 20:23:33) 转载▼ 标签: 转载 crash 原文 ...
- openstack安装、卸载与启动
一.安装: 更新: sudo apt-get update sudo apt-get upgrade 安装图形化界面: sudo apt-get install ubuntu-desktop 安装gc ...
- nginx + tomcat集群和动静资源分离
开发的应用采用F5负载均衡交换机,F5将请求转发给5台hp unix服务器,每台服务器有多个webserver实例,对外提供web服务和socket等接口服务.之初,曾有个小小的疑问为何不采用开源的a ...
- hihocoder #1300 : 展胜地的鲤鱼旗 dp
题目链接: http://hihocoder.com/problemset/problem/1300 题解: 先用栈预处理出每个‘)’匹配的‘(’的位子,放在pos数组中. dp[i]表示以i结尾的合 ...
- ios开发之网络数据的下载与上传
要实现网络数据的下载与上传,主要有三种方式 > NSURLConnection 针对少量数据,使用“GET”或“POST”方法从服务器获取数据,使用“POST”方法向服务器传输数据; > ...
- ios iap 购买总是提示继续的解决方案
原地址:http://blog.csdn.net/kafeidev/article/details/8619984 ========================================== ...