溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點(diǎn)擊 登錄注冊 即表示同意《億速云用戶服務(wù)條款》

iOS如何實(shí)現(xiàn)點(diǎn)擊圖片放大和長按保存圖片

發(fā)布時(shí)間:2021-05-24 11:57:44 來源:億速云 閱讀:481 作者:小新 欄目:移動(dòng)開發(fā)

這篇文章將為大家詳細(xì)講解有關(guān)iOS如何實(shí)現(xiàn)點(diǎn)擊圖片放大和長按保存圖片,小編覺得挺實(shí)用的,因此分享給大家做個(gè)參考,希望大家閱讀完這篇文章后可以有所收獲。

一:簡介

在項(xiàng)目中免不了會(huì)遇到,實(shí)名認(rèn)證上傳身份證、綁定銀行卡等功能。在實(shí)際操作中呢,會(huì)涉及到上傳圖片,在頁面布局時(shí),可能圖片不是一張,考慮到布局的美觀等因素,顯示圖片的位置變得很小,如果想查看上傳的圖片是否清晰,內(nèi)容是否完整,可能就需要放大才能實(shí)現(xiàn),下面就和大家分享一下我封裝的一類,完美的實(shí)現(xiàn)了圖片的縮放功能。

二:實(shí)現(xiàn)思路分析

  1. 給UIImageView添加手勢

  2. 封裝一個(gè)繼承NSObject的FBYImageZoom類

  3. 寫一個(gè)函數(shù)用來接收出入的UIImageView

  4. 根據(jù)傳入的UIImageView重新繪制在Window中

  5. 添加放大后背景視圖的顏色和透明度

  6. 使用動(dòng)畫放大展示ImageView

  7. 添加恢復(fù)ImageView原始尺寸的tap點(diǎn)擊事件

  8. 完成之后將背景視圖刪掉

三:實(shí)現(xiàn)源碼分析

根據(jù)實(shí)現(xiàn)思路分析,一步步進(jìn)行編碼實(shí)現(xiàn):

1. 給UIImageView添加手勢

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

2. 封裝一個(gè)繼承NSObject的FBYImageZoom類

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

3. 寫一個(gè)函數(shù)用來接收出入的UIImageView

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

4. 根據(jù)傳入的UIImageView重新繪制在Window中

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

5. 添加放大后背景視圖的顏色和透明度

//當(dāng)前視圖
  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. 使用動(dòng)畫放大展示ImageView

  //動(dòng)畫放大所展示的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;
    //高度 根據(jù)圖片寬高比設(shè)置
    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. 添加恢復(fù)ImageView原始尺寸的tap點(diǎn)擊事件

//添加點(diǎn)擊事件同樣是類方法 -> 作用是再次點(diǎn)擊回到初始大小
UITapGestureRecognizer *tapGestureRecognizer = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(hideImageView:)];
[backgroundView addGestureRecognizer:tapGestureRecognizer];

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

8. 完成之后將背景視圖刪掉

//完成后操作->將背景視圖刪掉
[backgroundView removeFromSuperview];

四:項(xiàng)目實(shí)際使用

1. 引入封裝類FBYImageZoom

#import "FBYImageZoom.h"

2. 給UIImageView添加手勢

//添加點(diǎn)擊事件
UITapGestureRecognizer *tapGestureRecognizer = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(scanBigImageClick:)];

3. 調(diào)用封裝類函數(shù)

//瀏覽大圖點(diǎn)擊事件
-(void)scanBigImageClick:(UITapGestureRecognizer *)tap{
  NSLog(@"點(diǎn)擊圖片");
  UIImageView *clickedImageView = (UIImageView *)tap.view;
  [FBYImageZoom ImageZoomWithImageView:clickedImageView];
}

好了,到這里點(diǎn)擊圖片放大到全屏就完成了

4. 長按保存圖片

另外就是實(shí)現(xiàn)長按保存圖片的功能,這個(gè)功能很簡單

首先增加長按手勢

  //創(chuàng)建長按手勢
  UILongPressGestureRecognizer *longTap = [[UILongPressGestureRecognizer alloc] initWithTarget:self action:@selector(imglongTapClick:)];
  //添加手勢
  [_myImageView addGestureRecognizer:longTap];

然后長按手勢彈出警告視圖確認(rèn)

-(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:@"確認(rèn)" style:UIAlertActionStyleDestructive handler:^(UIAlertAction * _Nonnull action) {
      
      NSLog(@"確認(rèn)保存圖片");      
      // 保存圖片到相冊
      UIImageWriteToSavedPhotosAlbum(self.myImageView.image,self,@selector(imageSavedToPhotosAlbum:didFinishSavingWithError:contextInfo:),nil);
      
    }];    
    [alertControl addAction:cancel];
    [alertControl addAction:confirm];    
    [self presentViewController:alertControl animated:YES completion:nil];
    
  }  
}

最后保存圖片后的回調(diào)

- (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];    
  }  
}

到這里實(shí)現(xiàn)點(diǎn)擊圖片放大和長按保存圖片功能就都是實(shí)現(xiàn)了,demo源碼已經(jīng)放在github上。

五:項(xiàng)目展示

iOS如何實(shí)現(xiàn)點(diǎn)擊圖片放大和長按保存圖片

關(guān)于“iOS如何實(shí)現(xiàn)點(diǎn)擊圖片放大和長按保存圖片”這篇文章就分享到這里了,希望以上內(nèi)容可以對大家有一定的幫助,使各位可以學(xué)到更多知識,如果覺得文章不錯(cuò),請把它分享出去讓更多的人看到。

向AI問一下細(xì)節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。

ios
AI