IOS实现裁剪框和图片剪裁功能
来源:爱站网时间:2019-04-22编辑:网友分享
现如今2019年已过好几月,就不空谈大理想大抱负,但是小计划还是要有的。下面爱站技术小编就带来IOS实现裁剪框和图片剪裁功能,可能有些小伙伴接触过,但是这里还是要分享给大家,正所谓一起学习,一起进步嘛。
现如今2019年已过好几月,就不空谈大理想大抱负,但是小计划还是要有的。下面爱站技术小编就带来IOS实现裁剪框和图片剪裁功能,可能有些小伙伴接触过,但是这里还是要分享给大家,正所谓一起学习,一起进步嘛。
图片处理中经常用的图片剪裁,就是通过剪裁框确定图片剪裁的区域,然后剪去该区域的图片,今天实现了一下,其实图片剪裁本身不难,主要剪裁框封装发了点时间,主要功能可以拖动四个角缩放,但不能超出父视图,拖动四个边单方向缩放,不能超出父视图,拖动中间部分单单移动,不改变大小,不能超出父视图。下面列举一些主要代码。
四个角的处理代码:
-(void)btnPanGesture:(UIPanGestureRecognizer*)panGesture { UIView *vw = panGesture.view; CGRect oldFrame = self.frame; CGRect oldIntersectRect = CGRectIntersection(self.frame, self.superview.bounds); CGPoint transport = [panGesture translationInView:vw]; if (vw.tag == 4) { self.width = self.preFrame.size.width + transport.x; self.height = self.preFrame.size.height + transport.y; } else if(vw.tag == 3) { self.x = self.preFrame.origin.x + transport.x; self.width = self.preFrame.size.width - transport.x; self.height = self.preFrame.size.height + transport.y; } else if(vw.tag == 2) { self.width = self.preFrame.size.width + transport.x; self.y = self.preFrame.origin.y + transport.y; self.height = self.preFrame.size.height - transport.y; } else if(vw.tag == 1) { self.x = self.preFrame.origin.x + transport.x; self.width = self.preFrame.size.width - transport.x; self.y = self.preFrame.origin.y + transport.y; self.height = self.preFrame.size.height - transport.y; } if (panGesture.state == UIGestureRecognizerStateEnded) { self.preFrame = self.frame; } if (self.width < MinWidth || self.height < MinHeight) { self.frame = oldFrame; } CGRect newFrame = self.frame; if (newFrame.size.width * newFrame.size.height > oldFrame.size.height * oldFrame.size.width) { CGRect newIntersectRect = CGRectIntersection(self.frame, self.superview.bounds); if (newFrame.size.width * newFrame.size.height > newIntersectRect.size.width * newIntersectRect.size.height) { self.frame = oldFrame; } } self.preCenter = self.center; }
我是通过视图于父视图的frame的交集部分的面积判断是否超出父视图的。
四个边的控制代码:
-(void)viewPanGesture:(UIPanGestureRecognizer*)panGesture { UIView *vw = panGesture.view; CGRect oldFrame = self.frame; CGRect oldIntersectRect = CGRectIntersection(self.frame, self.superview.bounds); CGPoint transport = [panGesture translationInView:vw]; if (vw.tag == 1) { self.y = self.preFrame.origin.y + transport.y; self.height = self.preFrame.size.height - transport.y; } else if(vw.tag == 2) { self.x = self.preFrame.origin.x + transport.x; self.width = self.preFrame.size.width - transport.x; } else if(vw.tag == 3) { self.height = self.preFrame.size.height + transport.y; } else if(vw.tag == 4) { self.width = self.preFrame.size.width + transport.x; } if (panGesture.state == UIGestureRecognizerStateEnded) { self.preFrame = self.frame; } if (self.width < MinWidth || self.height < MinHeight) { self.frame = oldFrame; } self.preCenter = self.center; CGRect newFrame = self.frame; if (newFrame.size.width * newFrame.size.height > oldFrame.size.height * oldFrame.size.width) { CGRect newIntersectRect = CGRectIntersection(self.frame, self.superview.bounds); if (oldIntersectRect.size.width * oldIntersectRect.size.height >= newIntersectRect.size.width * newIntersectRect.size.height) { self.frame = oldFrame; self.preCenter = self.preCenter; } } }
中间部分移动的控制代码:
-(void)contentViewPanGestureAction:(UIPanGestureRecognizer*)panGesture { CGPoint transport = [panGesture translationInView:self]; CGRect oldFrame = self.frame; CGRect oldIntersectRect = CGRectIntersection(self.frame, self.superview.bounds); CGFloat oldMj = oldIntersectRect.size.width * oldIntersectRect.size.height; self.center = CGPointMake(self.preCenter.x + transport.x, self.preCenter.y + transport.y); if (panGesture.state == UIGestureRecognizerStateEnded) { self.preCenter = self.center; } CGRect newIntersectRect = CGRectIntersection(self.frame, self.superview.bounds); CGFloat newMj = newIntersectRect.size.width * newIntersectRect.size.height; if (newMj < oldMj) { self.frame = oldFrame; self.preCenter = self.center; } }
剪裁框实现的核心代码如上,个人觉得最不好处理的是对超出父视图的控制,要保证不能超出父视图,个人主要用到的是通过子视图与父视图的交集部分的面积的改变来获知是否超出父视图,如果超出父视图,就会退到之前的frame,不知道是否还有其他好的方法,有的话可以一起交流一下。
图片剪裁部分
代码如下:
-(void)cropImg { CGRect cropFrame = self.cropView.frame; CGFloat orgX = cropFrame.origin.x * (self.img.size.width / self.imgView.frame.size.width); CGFloat orgY = cropFrame.origin.y * (self.img.size.height / self.imgView.frame.size.height); CGFloat width = cropFrame.size.width * (self.img.size.width / self.imgView.frame.size.width); CGFloat height = cropFrame.size.height * (self.img.size.height / self.imgView.frame.size.height); CGRect cropRect = CGRectMake(orgX, orgY, width, height); CGImageRef imgRef = CGImageCreateWithImageInRect(self.img.CGImage, cropRect); CGFloat deviceScale = [UIScreen mainScreen].scale; UIGraphicsBeginImageContextWithOptions(cropFrame.size, 0, deviceScale); CGContextRef context = UIGraphicsGetCurrentContext(); CGContextTranslateCTM(context, 0, cropFrame.size.height); CGContextScaleCTM(context, 1, -1); CGContextDrawImage(context, CGRectMake(0, 0, cropFrame.size.width, cropFrame.size.height), imgRef); UIImage *newImg = UIGraphicsGetImageFromCurrentImageContext(); CGImageRelease(imgRef); UIGraphicsEndImageContext(); ALAssetsLibrary *library = [[ALAssetsLibrary alloc] init]; [library toolWriteImageToSavedPhotosAlbum:newImg.CGImage metadata:nil completionBlock:^(NSURL *assetURL, NSError *error) { if(error) { JGLog(@"写入出错"); } } groupName:@"相册名称"]; }
这里要注意一点CGContextDrawImage这个函数的坐标系和UIKIt的坐标系上下颠倒,需对坐标系处理如下:
CGContextTranslateCTM(context, 0, cropFrame.size.height); CGContextScaleCTM(context, 1, -1);
看看效果:
剪裁之后的图片:
以上便是IOS实现裁剪框和图片剪裁功能的全部内容,希望本文对于你学习IOS有所帮助,还想了解的更深入的话,可以继续关注爱站技术频道。
上一篇:IOS图片设置毛玻璃效果
下一篇:IOS实现百度地图导航开发功能