iOS一个简单的图片预览

前言

公司项目有很多地方要用到图片上传功能，还有上传的历史记录，这方面就有需要预览这个需求啦，之前做的都没有这个功能，于是夏夏自己写了个简易的预览。。。

照片预览demo.gif

由于是模拟器，没有办法把放大，缩小等功能展示出来。

思路

1.只是简单的实现下预览的功能，于是夏夏只是单纯的写了个view用于展示，一般的预览都是全屏展示的，而且长按的时候要能保存图片，也就是说要present出sheet出来，于是夏夏就添加到NavigationController的View上了。当然，为了美观，夏夏也是加了个专场动画~ show code 思密达：

UIImageView *imageView = (UIImageView *)tap.view;
UIImage *image = imageView.image;
ReViewPhotoView *review = [[ReViewPhotoView alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height) Photo:image];

CATransition *transition = [CATransition animation];
transition.type = kCATransitionReveal;
transition.duration = 0.5;
[review.layer addAnimation:transition forKey:nil];
[self.navigationController.view addSubview:review];

2.先给一个整个window的背景View，再加个展现照片的imageView。一般图片都是剧中显示，每个图片都是带有size属性，可以根据图片原有的size和屏幕款高比，从而写出展示的imageView的frame。

CGFloat scale = photo.size.width / self.frame.size.width;
CGFloat height = photo.size.height / scale;
    
self.backgroundColor = [UIColor blackColor];
    
UIImageView *imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, (self.frame.size.height - height)/2, self.frame.size.width, height)];
imageView.image = photo;
imageView.userInteractionEnabled = YES;
[self addSubview:imageView];

3.接下来就是给imageView加手势了，加上了各种手势才能有各种交互的功能呀~

先加一个可以放大的功能思密达~~

UIPinchGestureRecognizer *pinchGesture = [[UIPinchGestureRecognizer alloc] initWithTarget:self action:@selector(pinchChangeScale:)];
[imageView addGestureRecognizer:pinchGesture];

- (void)pinchChangeScale:(UIPinchGestureRecognizer *)pinch {
    UIImageView *imageView = (UIImageView *)pinch.view;
    if (pinch.state == UIGestureRecognizerStateBegan) {
            lastScare = 1.0;
  }
    CGFloat scare = 1 - (lastScare - pinch.scale);
    CGAffineTransform currentTransform = imageView.transform;
    CGAffineTransform newTransform = CGAffineTransformScale(currentTransform, scare, scare);
    [imageView setTransform:newTransform];
    lastScare = pinch.scale;
}

当然咯，要是能放大肯定是要能拖动查看的说~

UIPanGestureRecognizer *panGesture = [[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(move:)];
[imageView addGestureRecognizer:panGesture];

- (void)move:(UIPanGestureRecognizer *)pan {
    CGPoint transpoint = [pan translationInView:self];
    UIImageView *imageView = (UIImageView *)pan.view;
    if (pan.state == UIGestureRecognizerStateBegan) {
        firstX = imageView.center.x;
       firstY = imageView.center.y;
    }
    if (lastScare == 1.0f) {
        return;
    }
    transpoint = CGPointMake(firstX+transpoint.x, firstY+transpoint.y);
    [imageView setCenter:transpoint];
}

唔~还要有一个双击可以返回原来的状态手势！

UITapGestureRecognizer *doubleTapGesture = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tapResolve:)];
    doubleTapGesture.numberOfTapsRequired = 2;
[imageView addGestureRecognizer:doubleTapGesture];

- (void)tapResolve:(UITapGestureRecognizer *)tap {
    UIImageView *imageView = (UIImageView *)tap.view;
    [imageView setTransform:transform];
    [imageView setFrame:imgFrame];
    lastScare = 1.0f;
}

但是还需要一个单击返回的手势，双击和单击会冲突，这个时候可以使用这个函数requireGestureRecognizerToFail。

最后如果是网上的图片预览，可能需要长按本地保存的功能，可以这样写哟：

- (void)longPress:(UILongPressGestureRecognizer *)longPress {
    UIImageView *imageView = (UIImageView *)longPress.view;
    if (longPress.state == UIGestureRecognizerStateBegan) {
        if (self.longpressblock && imageView.image) {
            self.longpressblock(imageView.image);
        }
    }
}

本地保存图片的方法是这个：UIImageWriteToSavedPhotosAlbum,之所以用block是因为这只是个view，没办法present出UIAlertController。

结束啦~

这就是一个简单的图片预览，demo的地址在这里：https://github.com/ioscick/-Demo
可以用于互相学习讨论哟！