对于图片来说，除了表情包，几乎都会被点击查看大图。今天就讲解一个查看和收起大图的动画效果，先直接看效果图：
如图所示，最开始是一个小图，点击小图可以查看大图。大图会从小图的位置和大小“弹”出来，同时背景变成半透明的阴影。点击大图或者阴影后，收起大图，同样地弹回到小图去，同时去掉阴影背景，就像是一张图片在伸大缩小一样。
现在看看这是怎么实现的。在思考一个动画的实现方法时，把动画的动作进行分解然后再一个个去思考怎么实现是一个好的习惯，我们稍微分解一下，这个动画在显示大图和收起大图的时候做了这些事情：
打开时先显示一个半透明的阴影背景； 然后显示一个逐渐变大的图片，直到撑到屏幕的边界； 收起时先让阴影背景消失； 然后将图片逐渐收小到小图原本的大小。这样看其实还蛮简单的，下面看代码怎么实现。
首先我们定义三个属性，因为我们需要在多个方法中调用，所以定义为类的@property：
@property (nonatomic, strong) UIImageView *smallImageView;// 小图视图
@property (nonatomic, strong) UIImageView *bigImageView;// 大图视图
@property (nonatomic, strong) UIView *bgView;// 阴影视图
然后我们将小图片直接添加到界面上去：
- (void)viewDidLoad {
[super viewDidLoad];
// 小图
self.smallImageView = [[UIImageView alloc] initWithFrame:CGRectMake((SCREENWIDTH - 100)/2, (SCREENHEIGHT - 100)/2, 100, 100)];
self.smallImageView.image = [UIImage imageNamed:@"icon"];
// 添加点击响应
self.smallImageView.userInteractionEnabled = YES;
UITapGestureRecognizer *imageTap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(viewBigImage)];
[self.smallImageView addGestureRecognizer:imageTap];
[self.view addSubview:self.smallImageView];
}
注意这里我在设置小图的大小时用到了两个事先设好的常量：屏幕的高和宽，这样就会根据手机的屏幕大小来保证图片始终是居中显示的，关于这两个常量，可以查看我这篇博客：iOS获取屏幕宽高、设备型号、系统版本信息
好现在小图已经添加到界面上了，我们也给小图添加了响应点击的方法，只需要在响应方法中实现动画就可以了。但是在这之前，我们先来完成大图片和阴影背景的初始化：
// 大图视图
- (UIImageView *)bigImageView {
if (nil == _bigImageView) {
_bigImageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, (SCREENHEIGHT - SCREENWIDTH) / 2, SCREENWIDTH, SCREENWIDTH)];
[_bigImageView setImage:self.smallImageView.image];
// 设置大图的点击响应，此处为收起大图
_bigImageView.userInteractionEnabled = YES;
UITapGestureRecognizer *imageTap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(dismissBigImage)];
[_bigImageView addGestureRecognizer:imageTap];
}
return _bigImageView;
}
// 阴影视图
- (UIView *)bgView {
if (nil == _bgView) {
_bgView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, SCREENWIDTH, SCREENHEIGHT)];
_bgView.backgroundColor = [UIColor colorWithWhite:0 alpha:0.5];
// 设置阴影背景的点击响应，此处为收起大图
_bgView.userInteractionEnabled = YES;
UITapGestureRecognizer *bgTap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(dismissBigImage)];
[_bgView addGestureRecognizer:bgTap];
}
return _bgView;
}
