iOS实现点击图片放大和长按保存图片的示例

所属分类: 软件编程 / IOS 阅读数: 509
收藏 0 赞 0 分享

一:简介

在项目中免不了会遇到,实名认证上传身份证、绑定银行卡等功能。在实际操作中呢,会涉及到上传图片,在页面布局时,可能图片不是一张,考虑到布局的美观等因素,显示图片的位置变得很小,如果想查看上传的图片是否清晰,内容是否完整,可能就需要放大才能实现,下面就和大家分享一下我封装的一类,完美的实现了图片的缩放功能。

另外,这些博文都是来源于我日常开发中的技术总结,在时间允许的情况下,我会针对技术点分别分享iOS、Android两个版本,尽量附上demo以供大家参考,如果有其他技术点需要,可在文章后留言,我会尽全力帮助大家。

二:实现思路分析

  1. 给UIImageView添加手势
  2. 封装一个继承NSObject的FBYImageZoom类
  3. 写一个函数用来接收出入的UIImageView
  4. 根据传入的UIImageView重新绘制在Window中
  5. 添加放大后背景视图的颜色和透明度
  6. 使用动画放大展示ImageView
  7. 添加恢复ImageView原始尺寸的tap点击事件
  8. 完成之后将背景视图删掉

三:实现源码分析

根据实现思路分析,一步步进行编码实现:

1. 给UIImageView添加手势

self.myImageView = [[UIImageView alloc]initWithFrame:CGRectMake(50, 150, SCREEN_WIDTH-100, SCREEN_WIDTH-100)];
self.myImageView.image = [UIImage imageNamed:@"bankcard"];
//添加点击事件
UITapGestureRecognizer *tapGestureRecognizer = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(scanBigImageClick:)];
[_myImageView addGestureRecognizer:tapGestureRecognizer];
[_myImageView setUserInteractionEnabled:YES];
[self.view addSubview:_myImageView];

2. 封装一个继承NSObject的FBYImageZoom类

#import <Foundation/Foundation.h>
#import <UIKit/UIKit.h>
@interface FBYImageZoom : NSObject
@end

3. 写一个函数用来接收出入的UIImageView

/**
 * @param contentImageview 图片所在的imageView
 */
+(void)ImageZoomWithImageView:(UIImageView *)contentImageview;

4. 根据传入的UIImageView重新绘制在Window中

+(void)ImageZoomWithImageView:(UIImageView *)contentImageview{  
  UIWindow *window = [UIApplication sharedApplication].keyWindow;
  [self scanBigImageWithImage:contentImageview.image frame:[contentImageview convertRect:contentImageview.bounds toView:window]];
}

5. 添加放大后背景视图的颜色和透明度

//当前视图
  UIWindow *window = [UIApplication sharedApplication].keyWindow;
  //背景
  UIView *backgroundView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, [UIScreen mainScreen].bounds.size.height)];
  [backgroundView setBackgroundColor:[UIColor colorWithRed:107/255.0 green:107/255.0 blue:99/255.0 alpha:0.6]];

6. 使用动画放大展示ImageView

  //动画放大所展示的ImageView
  [UIView animateWithDuration:0.4 animations:^{
    CGFloat y,width,height;
    y = ([UIScreen mainScreen].bounds.size.height - image.size.height * [UIScreen mainScreen].bounds.size.width / image.size.width) * 0.5;
    //宽度为屏幕宽度
    width = [UIScreen mainScreen].bounds.size.width;
    //高度 根据图片宽高比设置
    height = image.size.height * [UIScreen mainScreen].bounds.size.width / image.size.width;
    [imageView setFrame:CGRectMake(0, y, width, height)];
    //重要! 将视图显示出来
    [backgroundView setAlpha:1];
  } completion:^(BOOL finished) {
    
  }];

7. 添加恢复ImageView原始尺寸的tap点击事件

//添加点击事件同样是类方法 -> 作用是再次点击回到初始大小
UITapGestureRecognizer *tapGestureRecognizer = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(hideImageView:)];
[backgroundView addGestureRecognizer:tapGestureRecognizer];

/**
 * 恢复imageView原始尺寸
 */
+(void)hideImageView:(UITapGestureRecognizer *)tap{
  UIView *backgroundView = tap.view;
  //原始imageview
  UIImageView *imageView = [tap.view viewWithTag:1024];
  //恢复
  [UIView animateWithDuration:0.4 animations:^{
    [imageView setFrame:oldframe];
    [backgroundView setAlpha:0];
  } completion:^(BOOL finished) {
    [backgroundView removeFromSuperview];
  }];
}

8. 完成之后将背景视图删掉

//完成后操作->将背景视图删掉
[backgroundView removeFromSuperview];

四:项目实际使用

1. 引入封装类FBYImageZoom

#import "FBYImageZoom.h"

2. 给UIImageView添加手势

//添加点击事件
UITapGestureRecognizer *tapGestureRecognizer = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(scanBigImageClick:)];

3. 调用封装类函数

//浏览大图点击事件
-(void)scanBigImageClick:(UITapGestureRecognizer *)tap{
  NSLog(@"点击图片");
  UIImageView *clickedImageView = (UIImageView *)tap.view;
  [FBYImageZoom ImageZoomWithImageView:clickedImageView];
}

好了,到这里点击图片放大到全屏就完成了

4. 长按保存图片

另外就是实现长按保存图片的功能,这个功能很简单

首先增加长按手势

  //创建长按手势
  UILongPressGestureRecognizer *longTap = [[UILongPressGestureRecognizer alloc] initWithTarget:self action:@selector(imglongTapClick:)];
  //添加手势
  [_myImageView addGestureRecognizer:longTap];

然后长按手势弹出警告视图确认

-(void)imglongTapClick:(UILongPressGestureRecognizer*)gesture
{  
  if(gesture.state==UIGestureRecognizerStateBegan)    
  {    
    UIAlertController *alertControl = [UIAlertController alertControllerWithTitle:@"保存图片" message:nil preferredStyle:UIAlertControllerStyleAlert];    
    UIAlertAction *cancel = [UIAlertAction actionWithTitle:@"取消" style:UIAlertActionStyleCancel handler:^(UIAlertAction * _Nonnull action) {
      
      NSLog(@"取消保存图片");
    }];
    
    UIAlertAction *confirm = [UIAlertAction actionWithTitle:@"确认" style:UIAlertActionStyleDestructive handler:^(UIAlertAction * _Nonnull action) {
      
      NSLog(@"确认保存图片");      
      // 保存图片到相册
      UIImageWriteToSavedPhotosAlbum(self.myImageView.image,self,@selector(imageSavedToPhotosAlbum:didFinishSavingWithError:contextInfo:),nil);
      
    }];    
    [alertControl addAction:cancel];
    [alertControl addAction:confirm];    
    [self presentViewController:alertControl animated:YES completion:nil];
    
  }  
}

最后保存图片后的回调

- (void)imageSavedToPhotosAlbum:(UIImage*)image didFinishSavingWithError: (NSError*)error contextInfo:(id)contextInfo

{
  NSString *message;  
  if(!error) {    
    message =@"成功保存到相册";    
    UIAlertController *alertControl = [UIAlertController alertControllerWithTitle:@"提示" message:message preferredStyle:UIAlertControllerStyleAlert];    
    UIAlertAction *action = [UIAlertAction actionWithTitle:@"确定" style:UIAlertActionStyleDestructive handler:^(UIAlertAction * _Nonnull action) {
      
    }];
    [alertControl addAction:action];    
    [self presentViewController:alertControl animated:YES completion:nil];    
  }else
    
  {
    message = [error description];      
    UIAlertController *alertControl = [UIAlertController alertControllerWithTitle:@"提示" message:message preferredStyle:UIAlertControllerStyleAlert];    
    UIAlertAction *action = [UIAlertAction actionWithTitle:@"确定" style:UIAlertActionStyleCancel handler:^(UIAlertAction * _Nonnull action) {
      
    }];    
    [alertControl addAction:action];    
    [self presentViewController:alertControl animated:YES completion:nil];    
  }  
}

到这里实现点击图片放大和长按保存图片功能就都是实现了,demo源码已经放在github上。

五:项目展示

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

更多精彩内容其他人还在看

iOS 仿百度外卖-首页重力感应的实例

这篇文章主要介绍了iOS 仿百度外卖-首页重力感应的实例,具有一定的参考价值,感兴趣的小伙伴们可以参考一下。
收藏 0 赞 0 分享

iOS实现时间显示几分钟前,几小时前以及刚刚的方法示例

这篇文章主要介绍了如何利用iOS实现时间显示是在几小时前,几分钟前以及刚刚的格式,类似大家在qq空间和朋友圈微博看到的效果,文中给出了详细的示例代码,有需要的朋友们可以参考借鉴,下面来一起学习学习吧。
收藏 0 赞 0 分享

iOS 条码及二维码扫描(从相册中读取条形码/二维码)及扫码过程中遇到的坑

本文主要给大家介绍ios中从手机相册中读取条形码和二维码的问题及解决办法,需要的朋友参考下
收藏 0 赞 0 分享

IOS Cache设计详细介绍及简单示例

这篇文章主要介绍了IOS Cache设计详细介绍及简单示例的相关资料,Cache的目的是为了追求更高的速度体验,Cache的源头是两种数据读取方式在成本和性能上的差异,需要的朋友可以参考下
收藏 0 赞 0 分享

iOS本地动态生成验证码的方法

这篇文章主要介绍了iOS本地动态生成验证码的方法,非常不错,具有参考借鉴价值,需要的朋友可以参考下
收藏 0 赞 0 分享

iOS绘制3D饼图的实现方法

饼图常用于统计学模块。常见的一般为2D饼图,这篇文章主要介绍了iOS绘制3D饼图的实现方法,3D饼图更加立体,用户的好感度也比较高,下面需要的朋友可以参考借鉴,一起来看看吧。
收藏 0 赞 0 分享

谈谈iOS开发之JSON格式数据的生成与解析

JSON格式取代了xml给网络传输带来了很大的便利,本篇文章主要介绍了iOS开发:对象直接转化成JSON详解,具有一定的参考价值,有兴趣的可以了解一下。
收藏 0 赞 0 分享

IOS 身份证校验详细介绍及示例代码

这篇文章主要介绍了IOS 身份证校验详细介绍及示例代码的相关资料,这里对身份校验比较详细,附有简单实例,需要的朋友可以参考下
收藏 0 赞 0 分享

IOS 自定义UICollectionView的头视图或者尾视图UICollectionReusableView

这篇文章主要介绍了IOS 自定义UICollectionView的头视图或者尾视图UICollectionReusableView的相关资料,需要的朋友可以参考下
收藏 0 赞 0 分享

IOS 仿支付宝支付屏幕亮度变化机制

这篇文章主要介绍了IOS 仿支付宝支付屏幕亮度变化机制的相关资料,非常不错,具有参考借鉴价值,需要的朋友可以参考下
收藏 0 赞 0 分享
查看更多