iOS 图片剪裁附demo下载

文章目录


#Demo下载地址
http://download.csdn.net/detail/lovechris00/9873031

Demo 说明

  • 代码参考 杨淑园 的 YSHYClipViewController;
  • 可裁剪圆形、正方形、长方形(自己设置尺寸);
  • 界面都搭建好,拿来即用;

由于mardown处理图片尺寸很麻烦,所以效果图见文章最下方。如有问题,欢迎反馈留言~!


基本功能描述

  • 进入剪裁界面,图片适配剪裁框宽高。(根据尺寸比例,让图片的宽等于剪裁框宽度,或者高与之相等)。
  • 图片添加手势,和手势的代理。根据拖拽、捏合手势,来处理图片的放大、移动。
  • 拖拽、捏合时,让图片处于裁剪范围内。暂时没有做旋转。
  • 点击确定时,根据图片比例和位置,复制图片内容到画布,并输出画布。
  • 通过代理,输出结果到调用的控制器。

剪裁界面布局

用贝塞尔绘制半透明蒙版


#pragma mark - 绘制裁剪框
-(void)drawClipPath
{
    UIBezierPath *path= [UIBezierPath bezierPathWithRect:CGRectMake(0, 0, self.view.mj_w, self.view.mj_h)];
    CAShapeLayer *layer = [CAShapeLayer layer];
    
    UIBezierPath *clipPath;
    
    if (self.clipType == SQUARECLIP) {//方形
        clipPath = [UIBezierPath bezierPathWithRect:self.clipFrame];
    }else{
       
        clipPath = [UIBezierPath bezierPathWithArcCenter:CGPointMake(CGRectGetMidX(self.clipFrame), CGRectGetMidY(self.clipFrame)) radius:_clipw * 0.5 startAngle:0 endAngle:2*M_PI clockwise:NO];
    }
    [path appendpath:clipPath];
    
    [path setUsesEvenOddFillRule:YES];
    layer.path = path.CGPath;
    layer.fillRule = kCAFillRuleEvenOdd;
    
    layer.fillColor = [[UIColor blackColor] CGColor];
    layer.opacity = 0.5;
    
    [_overView.layer addSublayer:layer];
    
    //添加白线
    CAShapeLayer *shapeLayer = [CAShapeLayer layer];
    shapeLayer.frame = _overView.bounds;
    shapeLayer.path = clipPath.CGPath;
    shapeLayer.fillColor = [UIColor clearColor].CGColor;
    shapeLayer.linewidth = 1.0f;
    shapeLayer.strokeColor = [UIColor whiteColor].CGColor;
    
    [_overView.layer addSublayer:shapeLayer];
}

拖拽捏合图片

根据拖拽中 [panGesture translationInView:view.superview];改变图片位置

根据捏合中的 pinGesture.scale 改变图片大小。

##考虑事项:
###捏合后,图片宽、高,小于裁剪框的宽高
处理方式:如果图片宽度imgW 小于裁剪框的宽 clipw,则让图片 imgW = clipw; 如果处理后 图片高度imgH 小于裁剪框高度 clipH , 则让 imgH = clipH。
针对不同尺寸的裁剪框,我们要让图片宽高中的最小项,大于裁剪框宽高中的最大项。所以可以根据宽高比来方便判断。
重新设置尺寸的方法如下:

#pragma mark -- 处理图片大小
-(CGSize )handleScale
{
    CGFloat oriRate = _image.size.width / _image.size.height;
    CGFloat clipRate = _clipw / _clipH;
    
    CGSize resultSize;
    
    if (oriRate > clipRate) {
        resultSize.height = _clipH;
        resultSize.width = oriRate * _clipH;
    }else{
        resultSize.width = _clipw;
        resultSize.height = _clipw / oriRate;
    }
    
    return  resultSize;
}

###移动后、缩小后,图片四角不在裁剪框内;

经过上述操作,图片尺寸不会小于裁剪框尺寸。所以只需要判断四角的x,y值。
如果左上角在框内,则让x = clipX,同理亦然。具体代码如下:

#pragma mark -- 缩放结束后 确保图片在裁剪框内
-(CGRect )handlePosition:(UIView *)view
{
    
    // 图片.top < 裁剪框.top
    if(view.frame.origin.y > self.clipFrame.origin.y)
    {
        CGRect viewFrame = view.frame;
        viewFrame.origin.y = self.clipFrame.origin.y;
        view.frame = viewFrame;
    }
    // 图片.left < 裁剪框.left
    if(view.frame.origin.x > self.clipFrame.origin.x)
    {
        CGRect viewFrame = view.frame;
        viewFrame.origin.x = self.clipFrame.origin.x;
        view.frame = viewFrame;
    }
    
    // 图片.right < 裁剪框.right
    if(CGRectGetMaxX(view.frame)< CGRectGetMaxX(self.clipFrame))
    {
        CGFloat right =CGRectGetMaxX(view.frame);
        CGRect viewFrame = view.frame;
        CGFloat space = CGRectGetMaxX(self.clipFrame) - right;
        viewFrame.origin.x+=space;
        view.frame = viewFrame;
    }
    
    // 图片.bottom < 裁剪框.bottom
    if(CGRectGetMaxY(view.frame) < CGRectGetMaxY(self.clipFrame))
    {
        CGRect viewFrame = view.frame;
        CGFloat space = CGRectGetMaxY(self.clipFrame) - (CGRectGetMaxY(view.frame));
        viewFrame.origin.y +=space;
        view.frame = viewFrame;
    }
    
    return view.frame;
}

剪裁方法

#pragma mark - 裁剪获取图片
-(UIImage *)getClippedImage
{
    CGFloat rationScale = (_imageView.mj_w /_image.size.width);
    
    CGFloat origX = (self.clipFrame.origin.x - _imageView.frame.origin.x) / rationScale;
    CGFloat origY = (self.clipFrame.origin.y - _imageView.frame.origin.y) / rationScale;
    
    CGFloat oriWidth = _clipw / rationScale;
    CGFloat oriHeight = _clipH / rationScale;
    
    CGRect myRect = CGRectMake(origX, origY, oriWidth, oriHeight);
    CGImageRef  imageRef = CGImageCreateWithImageInRect(_image.CGImage, myRect);
    UIGraphicsBeginImageContext(myRect.size);
    
    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextDrawImage(context, myRect, imageRef);
    UIImage * clipImage = [UIImage imageWithCGImage:imageRef];
    UIGraphicsEndImageContext();
    
    if(self.clipType == CIRculaRCLIP){
        return  [self clipCircularImage:clipImage];
    }
    return clipImage;
}

#pragma mark -- 裁剪图片为圆形效果
-(UIImage *)clipCircularImage:(UIImage *)image
{
    CGFloat arcCenterX = image.size.width/ 2;
    CGFloat arcCenterY = image.size.height / 2;
    
    UIGraphicsBeginImageContext(image.size);
    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextBeginPath(context);
    CGContextAddArc(context, arcCenterX , arcCenterY, image.size.width/ 2 , 0.0, 2*M_PI, NO);
    CGContextClip(context);
    CGRect myRect = CGRectMake(0 , 0, image.size.width ,  image.size.height);
    [image drawInRect:myRect];
    
    UIImage *newImage = UIGraphicsGetimageFromCurrentimageContext();
    UIGraphicsEndImageContext();
    
    return  newImage;
}


效果如下:

这里写图片描述

这里写图片描述

这里写图片描述


原文地址:https://blog.csdn.net/lovechris00/article/details/73381530

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐


当我们远离最新的 iOS 16 更新版本时,我们听到了困扰 Apple 最新软件的错误和性能问题。
欧版/美版 特别说一下,美版选错了 可能会永久丧失4G,不过只有5%的概率会遇到选择运营商界面且部分必须连接到iTunes才可以激活
一般在接外包的时候, 通常第三方需要安装你的app进行测试(这时候你的app肯定是还没传到app store之前)。
前言为了让更多的人永远记住12月13日,各大厂都在这一天将应用变灰了。那么接下来我们看一下Flutter是如何实现的。Flutter中实现整个App变为灰色在Flutter中实现整个App变为灰色是非常简单的,只需要在最外层的控件上包裹ColorFiltered,用法如下:ColorFiltered(颜色过滤器)看名字就知道是增加颜色滤镜效果的,ColorFiltered( colorFilter:ColorFilter.mode(Colors.grey, BlendMode.
flutter升级/版本切换
(1)在C++11标准时,open函数的文件路径可以传char指针也可以传string指针,而在C++98标准,open函数的文件路径只能传char指针;(2)open函数的第二个参数是打开文件的模式,从函数定义可以看出,如果调用open函数时省略mode模式参数,则默认按照可读可写(ios_base:in | ios_base::out)的方式打开;(3)打开文件时的mode的模式是从内存的角度来定义的,比如:in表示可读,就是从文件读数据往内存读写;out表示可写,就是把内存数据写到文件中;
文章目录方法一:分别将图片和文字置灰UIImage转成灰度图UIColor转成灰度颜色方法二:给App整体添加灰色滤镜参考App页面置灰,本质是将彩色图像转换为灰度图像,本文提供两种方法实现,一种是App整体置灰,一种是单个页面置灰,可结合具体的业务场景使用。方法一:分别将图片和文字置灰一般情况下,App页面的颜色深度是24bit,也就是RGB各8bit;如果算上Alpha通道的话就是32bit,RGBA(或者ARGB)各8bit。灰度图像的颜色深度是8bit,这8bit表示的颜色不是彩色,而是256
领导让调研下黑(灰)白化实现方案,自己调研了两天,根据网上资料,做下记录只是学习过程中的记录,还是写作者牛逼
让学前端不再害怕英语单词(二),通过本文,可以对css,js和es6的单词进行了在逻辑上和联想上的记忆,让初学者更快的上手前端代码
用Python送你一颗跳动的爱心
在uni-app项目中实现人脸识别,既使用uni-app中的live-pusher开启摄像头,创建直播推流。通过快照截取和压缩图片,以base64格式发往后端。
商户APP调用微信提供的SDK调用微信支付模块,商户APP会跳转到微信中完成支付,支付完后跳回到商户APP内,最后展示支付结果。CSDN前端领域优质创作者,资深前端开发工程师,专注前端开发,在CSDN总结工作中遇到的问题或者问题解决方法以及对新技术的分享,欢迎咨询交流,共同学习。),验证通过打开选择支付方式弹窗页面,选择微信支付或者支付宝支付;4.可取消支付,放弃支付会返回会员页面,页面提示支付取消;2.判断支付方式,如果是1,则是微信支付方式。1.判断是否在微信内支付,需要在微信外支付。
Mac命令行修改ipa并重新签名打包
首先在 iOS 设备中打开开发者模式。位于:设置 - 隐私&安全 - 开发者模式(需重启)
一 现象导入MBProgressHUD显示信息时,出现如下异常现象Undefined symbols for architecture x86_64: "_OBJC_CLASS_$_MBProgressHUD", referenced from: objc-class-ref in ViewController.old: symbol(s) not found for architecture x86_64clang: error: linker command failed wit
Profiles >> 加号添加 >> Distribution >> "App Store" >> 选择 2.1 创建的App ID >> 选择绑定 2.3 的发布证书(.cer)>> 输入描述文件名称 >> Generate 生成描述文件 >> Download。Certificates >> 加号添加 >> "App Store and Ad Hoc" >> “Choose File...” >> 选择上一步生成的证书请求文件 >> Continue >> Download。
今天有需求,要实现的功能大致如下:在安卓和ios端实现分享功能可以分享链接,图片,文字,视频,文件,等欢迎大佬多多来给萌新指正,欢迎大家来共同探讨。如果各位看官觉得文章有点点帮助,跪求各位给点个“一键三连”,谢啦~声明:本博文章若非特殊注明皆为原创原文链接。