一、自定义裁剪相册照片核心点
1、读取照片
2、自定义UI和初始化缩放比例
3、自由点缩放
4、裁剪指定区域
设计要求
1、保留边距，初始化居中铺满高亮区域
2、自由点缩放，铺满全屏
3、裁剪方形图片
image.png
image.png
二、视图层级搭建
1、最底层是UIScrollview，UIScrollview上放置UIimageView。
2、和UIScrollview同父视图，创建自定义navbarView。
3、和UIScrollview同父视图，创建一个mask模糊层，禁用手势，模糊层可以使用layer图层实现，或用4块小视图拼接都行。
- (void)createSubviews
{
//注意： 此处不要使用约束布局，因为scrollview存在缩、滚动、弹簧动画等混合效果，使用约束计算容易崩溃
self.scrollView.frame = CGRectMake(0, 0, DD_SCREEN_WIDTH, DD_SCREEN_HEIGHT);
[self.view addSubview:self.scrollView];
[self.scrollView addSubview:self.imageView];
self.scrollView.contentInset =
UIEdgeInsetsMake(self.contentInsetTop, self.contentInsetLeft, self.contentInsetTop, self.contentInsetLeft);
[self.view addSubview:self.navBarView];
[self.navBarView mas_makeConstraints:^(MASConstraintMaker *make) {
make.left.right.top.equalTo(self.view);
make.height.mas_equalTo(navBarHeight);
}];
//镂空蒙层
[self.view addSubview:self.maskView];
[self.maskView mas_makeConstraints:^(MASConstraintMaker *make) {
make.left.right.bottom.equalTo(self.view);
make.top.equalTo(self.view).offset(navBarHeight);
}];
}
三、功能实现
1、读取照片
推荐使用iOS7新框架photokit。
注意：读取相册照片时，系统会两次回调resultHandler，第一次传出缩略图(模糊图)，第二次会传出高清图(图片数据不完整时，存在回传失败，image为nil)，要做校验处理。
- (void)setAssetPh:(PHAsset *)assetPh
{
_assetPh = assetPh;
self.image = nil;
self.viewIndicator.hidden = NO;
[self.viewIndicator startAnimating];
dispatch_async(dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_DEFAULT, 0), ^{
PHImageRequestOptions *option = [PHImageRequestOptions new];
option.synchronous = NO;
[[DDWPhotoImageManger sharedInstance] requestImageForAsset:assetPh targetSize:[DDWimagePickerManger sharedInstance].getImageSizeOfBrower contentMode:PHImageContentModeAspectFit options:option resultHandler:^(UIImage * _Nullable result, NSDictionary * _Nullable info) {
//图片有可能读取失败，要做校验
if (result) {
self.image = result;
}
[self.viewIndicator stopAnimating];
self.viewIndicator.hidden = YES;
}];
});
}
2、初始化UI 照片居中，铺满显示
- (void)setImage:(UIImage *)image
{
if (image != _image) {
_image = image;
dispatch_async(dispatch_get_main_queue(), ^{
self.imageView.image = image;
CGSize maxSize = self.hollowSize;
CGFloat widthRatio = maxSize.width / image.size.width;
CGFloat heightRatio = maxSize.height / image.size.height;
CGFloat initialZoom = (widthRatio > heightRatio) ? heightRatio : widthRatio;
if (initialZoom > 1) {
initialZoom = 1;
}
// 初始化显示imageView
CGRect initialFrame = self.scrollView.frame;
initialFrame.size.width = image.size.width * initialZoom;
initialFrame.size.height = image.size.height * initialZoom;
self.imageView.frame = initialFrame;
[self.scrollView setMinimumZoomScale:initialZoom];
[self.scrollView setMaximumZoomScale:5];
//初次铺满缩放
self.isFirstZoom = YES;
[self.scrollView setZoomScale:1.0];
[self scrollViewDidZoom:self.scrollView];
});
}
}
3、自由点缩放
实现UIScrollViewDelegate的缩放方法，
#pragma mark- Methods
- (void)scrollViewDidZoom:(UIScrollView *)scrollView
{
CGFloat w_content = self.scrollView.contentSize.width;
CGFloat h_content = self.scrollView.contentSize.height;
//容错处理
if (w_content <= 0) {
w_content = self.hollowSize.width * 0.5;
}
if (h_content <= 0) {
h_content = self.hollowSize.height * 0.5;
}
//限定铺满处理
if (w_content < self.hollowSize.width) {
h_content = h_content * self.hollowSize.width / w_content;
w_content = self.hollowSize.width;
}
if (h_content < self.hollowSize.height) {
w_content = w_content * self.hollowSize.height / h_content;
h_content = self.hollowSize.height;
}
self.imageView.width = w_content;
self.imageView.height = h_content;
self.scrollView.contentSize = CGSizeMake(w_content, h_content);
self.imageView.center = CGPointMake(self.scrollView.contentSize.width * 0.5 ,
self.scrollView.contentSize.height * 0.5);
if (self.isFirstZoom) {
// 初始化缩放居中显示
CGFloat offset_x = (self.imageView.frame.size.width - self.hollowSize.width) * 0.5 - self.contentInsetLeft;
CGFloat offset_y = (self.imageView.frame.size.height - self.hollowSize.height) * 0.5 - self.contentInsetTop;
[self.scrollView setContentOffset:CGPointMake(offset_x , offset_y) animated:NO];
self.isFirstZoom = NO;
}
}
- (UIView *)viewForZoomingInScrollView:(UIScrollView *)scrollView
{
return self.imageView;
}
4、裁剪指定区域为图片
调用系统裁剪方法即可。
#pragma mark- 裁剪 Methods
- (UIImage *)getSubImage
{
UIGraphicsBeginImageContextWithOptions(CGSizeMake(self.hollowSize.width, self.hollowSize.height), YES, [UIScreen mainScreen].scale);
CGPoint offset = self.scrollView.contentOffset;
CGContextTranslateCTM(UIGraphicsGetCurrentContext(), -(offset.x + self.contentInsetLeft), -(offset.y + self.contentInsetTop));
[self.scrollView.layer renderInContext:UIGraphicsGetCurrentContext()];
UIImage *img = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
img = [self imageWithImage:img scaledToSize:CGSizeMake(self.hollowSize.width, self.hollowSize.height)];
return img;
}
-(UIImage *)imageWithImage:(UIImage*)image scaledToSize:(CGSize)newSize
{
UIGraphicsBeginImageContextWithOptions(newSize, NO, 0.0);
[image drawInRect:CGRectMake(0, 0, newSize.width, newSize.height)];
UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return newImage;
}
