iOS固定大小截圖

最近項目中修改個人資料等需要用到頭像,這就需要用到截圖,故留下這篇博文,供自己以後參考。

先上效果圖:


這裏的圖片顯示效果就沒有做過多處理了,因爲小編直接採用的storyBoard佈局,設置了圖片的Mode爲Aspect Fit,需要什麼樣的mode,可自行設置。

1.在控制器中設置一個UI ImageView和一個UIButton,UIImageView用來顯示圖片,UIButton用來進行截圖跳轉。小編這都是在storyboard中完成的,所以,只是在代碼中進行了效果處理。

ViewController.h  中實現了截圖控制器的代理等

//
//  ViewController.h
//  TestImageZoom
//
//  Created by NapoleonBai on 14-7-24.
//  Copyright (c) 2014年 NapoleonBai. All rights reserved.
//

#import <UIKit/UIKit.h>
#import "ImageCropper.h"
@interface ViewController : UIViewController<ImageCropperDelegate>
@property (weak, nonatomic) IBOutlet UIImageView *imageView;
- (IBAction)onClick:(id)sender;<span style="font-family: Arial, Helvetica, sans-serif;">//按鈕點擊事件</span>
@end
在ViewController.m 中實現了協議方法,以及對截圖的加載顯示和截圖控制器的跳轉

//點擊按鈕方法
- (IBAction)onClick:(id)sender {
    //打開縮放圖片控制器
    ImageCropper *cropper = [[ImageCropper alloc] initWithImage:[_imageView image]];
    //設置代理
	[cropper setDelegate:self];
	//模態跳轉
	[self presentViewController:cropper animated:YES completion:nil];
}
//實現協議方法,將剪切得到的圖片,設置到當前界面的UIIamgeView上顯示
- (void)imageCropper:(ImageCropper *)cropper didFinishCroppingWithImage:(UIImage *)image {
	[_imageView setImage:image];
}

2.處理截圖控制器,這個截圖控制器是使用的一個UIScroolView和一個UIImageView完成的基本構造,使用的UIView形成的固定截圖框大小。這裏就不做過多解釋了,言語都在註釋中。

在ImageCropper.h 中聲明方法/屬性等 和構建協議方法

//
//  ImageCropper.h
//  Created by NapoleonBai on 14-7-24.
//  Copyright (c) 2014年 NapoleonBai. All rights reserved.
//

#import <UIKit/UIKit.h>

@protocol ImageCropperDelegate;
@interface ImageCropper : UIViewController <UIScrollViewDelegate> {
	UIView *viewZoom;//縮放截圖View
}
@property (nonatomic, strong) UIScrollView *scrollView;//滾動視圖
@property (nonatomic, strong) UIImageView *imageView;//顯示圖片View
@property (nonatomic, assign) id <ImageCropperDelegate> delegate;
- (id)initWithImage:(UIImage *)image;//初始化方法
@end
//代理
@protocol ImageCropperDelegate <NSObject>
//完成剪切的代理方法
- (void)imageCropper:(ImageCropper *)cropper didFinishCroppingWithImage:(UIImage *)image;
@end

2.1完成初始化方法,在ImageCropper.m文件中

- (id)initWithImage:(UIImage *)image {
	self = [super init];
	if (self) {
        
		[[UIApplication sharedApplication] setStatusBarStyle:UIStatusBarStyleLightContent animated:YES];
		//初始化UIScrollView 大小可以自行設定
		_scrollView = [[UIScrollView alloc] initWithFrame:CGRectMake(0, 64, 320, 436)];
		[_scrollView setBackgroundColor:[UIColor blackColor]];
		[_scrollView setDelegate:self];
		[_scrollView setShowsHorizontalScrollIndicator:NO];
		[_scrollView setShowsVerticalScrollIndicator:NO];
		[_scrollView setMaximumZoomScale:2.0];
		//初始化圖片View
		_imageView = [[UIImageView alloc] initWithImage:image];
		
        //設置圖片現實大小等
		CGRect rect;
		rect.size.width = image.size.width;
		rect.size.height = image.size.height;
		[_imageView setFrame:rect];
		//設置UIScrollView的內容大小
		[_scrollView setContentSize:[_imageView frame].size];
        //設置最小縮放等級
		[_scrollView setMinimumZoomScale:[_scrollView frame].size.width / [_imageView frame].size.width];
        //設置初始等級
		[_scrollView setZoomScale:[_scrollView minimumZoomScale]];
        //添加到UIScrollView上
		[_scrollView addSubview:_imageView];
		
		[[self view] addSubview:_scrollView];
		
        //創建導航欄控制器
		UINavigationBar *navigationBar = [[UINavigationBar alloc] initWithFrame:CGRectMake(0, 0, 320, 64)];
		//設置導航欄標題
		UINavigationItem *aNavigationItem = [[UINavigationItem alloc] initWithTitle:@"縮放和剪切"];
        //設置取消按鈕
		[aNavigationItem setLeftBarButtonItem:[[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemCancel target:self action:@selector(cancelCropping)]];
        //設置確認剪切按鈕
		[aNavigationItem setRightBarButtonItem:[[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemDone target:self action:@selector(finishCropping)]];
		//添加到導航欄上
		[navigationBar setItems:[NSArray arrayWithObject:aNavigationItem]];
		//設置導航欄
		[[self view] addSubview:navigationBar];
		//初始化截圖框
        [self initView];
	}
	
	return self;
}
2. 2上面也提到了一個initView函數,這個函數是用來初始化截圖框的大小的,如下

//創建一個截圖框
- (void)initView{
    //初始化截圖框信息
    viewZoom=[[UIView alloc]initWithFrame:CGRectMake(10, 10, 100, 100)];
    [viewZoom setBackgroundColor:[UIColor clearColor]];//清除背景色
    viewZoom.layer.borderColor=[[UIColor greenColor]CGColor];//設置邊框顏色
    viewZoom.layer.borderWidth=1;//設置邊框寬度
    viewZoom.layer.cornerRadius=5;//設置圓角
    [[self scrollView] addSubview:viewZoom];//添加到視圖上
    // 設置可操作  特別注意,這裏必須這樣,不然手勢將不可用
    [viewZoom setUserInteractionEnabled:YES];
    //設置拖動手勢事件方法
    UIPanGestureRecognizer *panGestureRecognizer = [[UIPanGestureRecognizer alloc]
                                                    initWithTarget:self
                                                    action:@selector(handlePan:)];
    //添加拖動手勢
    [viewZoom addGestureRecognizer:panGestureRecognizer];
}

2.3到這裏,基本佈局就算完成了,但是,爲了方便,小編給截圖框添加了一個拖動手勢,這樣就可拖動截圖 框了。在拖動方法中,需要改變View 的座標,小編是通過移動的座標點來重新設置View的座標的,如下

//進行截圖框拖放時執行
- (void)handlePan:(UIPanGestureRecognizer *)recognizer{
    //得到移動座標點
    CGPoint translation = [recognizer translationInView:self.view];
    //設置拖動視圖的中心座標
    recognizer.view.center = CGPointMake(recognizer.view.center.x + translation.x,
                                         recognizer.view.center.y + translation.y);
    //重新設置視圖位置
    [recognizer setTranslation:CGPointZero inView:self.view];
}
2.4實現UIScrollView的協議方法,監控它的縮放返回圖片視圖,在scrollViewDidScroll函數中固定剪切框的位置,這個函數是監控UIScrollView滾動的函數

#pragma 實現滾動視圖的協議方法
//進行縮放時進入,返回圖片View
- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollViews {
	return _imageView;
}
//滾動時候進入
- (void)scrollViewDidScroll:(UIScrollView *)scrollViews{
    //得到截圖框的frame
    CGRect frame=viewZoom.frame;
    //將截圖框鎖定在屏幕(x=10,y=10)的位置 可以根據自己需要自行設定
    frame.origin.x=[self.scrollView contentOffset].x+10;
    frame.origin.y=[self.scrollView contentOffset].y+10;
    [viewZoom setFrame:frame];
}


2.5 完成這最後一步,截圖,退出當前界面,這是導航欄上面的兩個按鈕,一個取消,一個完成。

//取消方法
- (void)cancelCropping {
    [self dismissViewControllerAnimated:NO completion:nil];
}

//這是點擊截圖按鈕觸發
- (void)finishCropping {
    //得到縮放級別
	float zoomScale = 1.0 / [_scrollView zoomScale];
    //得到需要的截圖大小
	CGRect rect;
	rect.origin.x = viewZoom.frame.origin.x * zoomScale;
	rect.origin.y = viewZoom.frame.origin.y * zoomScale;
	rect.size.width = viewZoom.frame.size.width * zoomScale;
	rect.size.height = viewZoom.frame.size.height * zoomScale;
	//裁剪圖片  需要裁剪的圖片  裁剪的位置
	CGImageRef cr = CGImageCreateWithImageInRect([[_imageView image] CGImage], rect);
	//得到image
	UIImage *cropped = [UIImage imageWithCGImage:cr];
    //釋放內存<span style="white-space:pre">	</span>這裏可以不做出操作,但是爲了內存的嚴謹,推薦釋放
	CGImageRelease(cr);
	//使用代理將截圖傳回界面
	[self.delegate imageCropper:self didFinishCroppingWithImage:cropped];
    [self dismissViewControllerAnimated:NO completion:nil];
}


到這裏就結束了截圖和縮放功能

記下,只爲了留下開發生涯中的點點滴滴;

可能不是最好,但小編已經全力以赴了。

謝謝,若有不對,煩勞路過的大牛指點一二。



發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章