iOS实现头像裁剪( 方或圆)功能，支持缩放拖拽。

类似微信头像选择裁剪功能 ，设置UIImagePickerController的allowsEditing属性为YES即可实现，但如何自己实现此功能呢？如何实现类似系统联系人圆形头像裁剪选取呢？

图片要支持缩放和拖拽，首先想到scrollView，具体实现方法如下：

//CropImageController.h@protocolCropImageDelegate- (void)cropImageDidFinishedWithImage:(UIImage*)image;@end@interfaceCropImageController:UIViewController@property(nonatomic,weak)id delegate;//圆形裁剪，默认NO;@property(nonatomic,assign)BOOLovalClip;- (instancetype)initWithImage:(UIImage*)originalImage delegate:(id)delegate;@end

在viewDidLoad初始化scrollView,设置frame为裁剪框大小，若需要超出边界线内容仍然可以显示，设置其layer属性masksToBounds即可

- (void)viewDidLoad { [superviewDidLoad];// Do any additional setup after loading the view.self.view.backgroundColor = [UIColorblackColor];self.automaticallyAdjustsScrollViewInsets =NO;CGFloatheight = (ScreenHeight - ScreenWidth)/2.0; _scrollView = [[UIScrollViewalloc] initWithFrame:CGRectMake(0, height ,ScreenWidth,ScreenWidth)]; _scrollView.bouncesZoom =YES; _scrollView.minimumZoomScale =1; _scrollView.maximumZoomScale =3; _scrollView.zoomScale =1; _scrollView.delegate =self; _scrollView.layer.masksToBounds =NO; _scrollView.showsHorizontalScrollIndicator =NO; _scrollView.showsVerticalScrollIndicator =NO; _scrollView.layer.borderWidth =1.5; _scrollView.layer.borderColor = [UIColorwhiteColor].CGColor;if(_ovalClip) { _scrollView.layer.cornerRadius = ScreenWidth/2.0; }self.view.layer.masksToBounds =YES;if(_originalImage) { _imageView = [[UIImageViewalloc] initWithImage:_originalImage];CGFloatimg_width = ScreenWidth;CGFloatimg_height = _originalImage.size.height * (img_width/_originalImage.size.width);CGFloatimg_y= (img_height -self.view.bounds.size.width)/2.0; _imageView.frame =CGRectMake(0,0, img_width, img_height); _imageView.userInteractionEnabled =YES; [_scrollView addSubview:_imageView]; _scrollView.contentSize =CGSizeMake(img_width, img_height); _scrollView.contentOffset =CGPointMake(0, img_y); [self.view addSubview:_scrollView]; } [selfuserInterface];}

设置self.view中间镂空效果：

- (void)userInterface {CGRectcropframe = _scrollView.frame;UIBezierPath* path = [UIBezierPathbezierPathWithRoundedRect:self.view.bounds cornerRadius:0];UIBezierPath* cropPath = [UIBezierPathbezierPathWithRoundedRect:cropframe cornerRadius:0];if(_ovalClip) { cropPath = [UIBezierPathbezierPathWithOvalInRect:cropframe]; } [path appendPath:cropPath];CAShapeLayer* layer = [[CAShapeLayeralloc] init]; layer.fillColor = [UIColorcolorWithRed:.0green:.0blue:.0alpha:0.5].CGColor;//填充规则layer.fillRule=kCAFillRuleEvenOdd; layer.path = path.CGPath; [self.view.layer addSublayer:layer];}

UIScrollViewDelegate,缩放和滑动过程中调整内容视图大小：

#pragma mark -- UIScrollViewDelegate

- (UIView*)viewForZoomingInScrollView:(UIScrollView*)scrollView {returnself.imageView;}- (void)scrollViewDidZoom:(UIScrollView*)scrollView {//调整位置[selfcenterContent];}- (void)centerContent {CGRectimageViewFrame = _imageView.frame;CGRectscrollBounds =CGRectMake(0,0, ScreenWidth, ScreenWidth);if(imageViewFrame.size.height > scrollBounds.size.height) { imageViewFrame.origin.y =0.0f; }else{ imageViewFrame.origin.y = (scrollBounds.size.height - imageViewFrame.size.height) /2.0; }if(imageViewFrame.size.width < scrollBounds.size.width) { imageViewFrame.origin.x = (scrollBounds.size.width - imageViewFrame.size.width) /2.0; }else{ imageViewFrame.origin.x =0.0f; } _imageView.frame = imageViewFrame;}

调整位置确定选取图片时候，可根据当前ScrollView的contentOffset和缩放倍数确定具体裁剪位置：

- (UIImage*)cropImage {CGPointoffset = _scrollView.contentOffset;//图片缩放比例CGFloatzoom = _imageView.frame.size.width/_originalImage.size.width;//视网膜屏设备像素相关zoom = zoom / [UIScreenmainScreen].scale;CGFloatwidth = _scrollView.frame.size.width;CGFloatheight = _scrollView.frame.size.height;if(_imageView.frame.size.height < _scrollView.frame.size.height) {//太胖了,取中间部分offset =CGPointMake(offset.x + (width - _imageView.frame.size.height)/2.0,0); width = height = _imageView.frame.size.height; }CGRectrec =CGRectMake(offset.x/zoom, offset.y/zoom,width/zoom,height/zoom);CGImageRefimageRef =CGImageCreateWithImageInRect([_originalImageCGImage],rec);UIImage* image = [[UIImagealloc]initWithCGImage:imageRef];CGImageRelease(imageRef);if(_ovalClip) { image = [image ovalClip]; }returnimage;}

UIImage分类(图片指定尺寸缩放和圆形裁剪)：

//UIImage+Crop.m- (UIImage*)resizeImageWithSize:(CGSize)newSize {CGFloatnewWidth = newSize.width;CGFloatnewHeight = newSize.height;floatwidth =self.size.width;floatheight =self.size.height;if(width != newWidth || height != newHeight) {UIGraphicsBeginImageContextWithOptions(CGSizeMake(newWidth, newHeight),YES, [UIScreenmainScreen].scale); [selfdrawInRect:CGRectMake(0,0, newWidth, newHeight)];UIImage*resized =UIGraphicsGetImageFromCurrentImageContext();UIGraphicsEndImageContext();returnresized; }returnself;}- (UIImage*)ovalClip {CGSizesize =self.size;UIGraphicsBeginImageContextWithOptions(size,NO, [UIScreenmainScreen].scale);UIBezierPath*path = [UIBezierPathbezierPathWithOvalInRect:CGRectMake(0,0,self.size.width,self.size.height)]; [path addClip]; [selfdrawAtPoint:CGPointZero];UIImage* image =UIGraphicsGetImageFromCurrentImageContext();UIGraphicsEndImageContext();returnimage;}

注：由于对图片进行裁剪，先将原始图片等比缩放到指定裁剪宽度。

源码下载 : https://github.com/limuyun/CropImage