美文网首页
图片剪裁

图片剪裁

作者: 风飞燕 | 来源:发表于2017-06-28 10:23 被阅读36次

    做项目是经常会遇见需要对图片进行剪裁的情况,下面来点干货

    #import <UIKit/UIKit.h>
    
    @protocol PassImageDelegate <NSObject>
    
    -(void)passImage:(UIImage *)image;
    
    @end
    
    @interface CutImgageVC : UIViewController
    @property(nonatomic,strong) id<PassImageDelegate> delegate;
    @property(nonatomic,strong) UIImage *image;
    @property(nonatomic,assign) float ratioWidth;//宽
    @property(nonatomic,assign) float ratioHeight;//高
    @property(nonatomic,assign) float minWidth;//最小宽
    @end
    
    
    
    #import "CutImgageVC.h"
    
    #define imgViewWigth 30
    @interface CutImgageVC ()<UIGestureRecognizerDelegate>{
        float imageX;
        float imageY;
        float imageW;
        float imageH;
    
    }
    @property(nonatomic,strong) UIImageView *bgImgView;
    @property(nonatomic,strong) UIView *cutView;
    @property(nonatomic,strong) UIImageView *topLeftImgView;
    @property(nonatomic,strong) UIImageView *topRigthImgView;
    @property(nonatomic,strong) UIImageView *bottomLeftImgView;
    @property(nonatomic,strong) UIImageView *bottomRigthImgView;
    @end
    
    @implementation CutImgageVC
    
    - (void)viewDidLoad {
        [super viewDidLoad];
        
        //添加导航栏和完成按钮
        
        UINavigationBar *naviBar = [[UINavigationBar alloc] initWithFrame:CGRectMake(0, 0,ScreenWidth, 64)];
        [self.view addSubview:naviBar];
        
        UINavigationItem *naviItem = [[UINavigationItem alloc] initWithTitle:@"图片裁剪"];
        [naviBar pushNavigationItem:naviItem animated:YES];
        
        //保存按钮
        UIBarButtonItem *doneItem = [[UIBarButtonItem alloc] initWithTitle:@"完成" style:UIBarButtonItemStylePlain target:self action:@selector(saveButton)];
        naviItem.rightBarButtonItem = doneItem;
        [self createImageView];
    }
    
    
    
    - (void)didReceiveMemoryWarning {
        [super didReceiveMemoryWarning];
        // Dispose of any resources that can be recreated.
    }
    -(void)saveButton{
    
        [self clipWithRect];
        [self dismissModalViewControllerAnimated:YES];
    }
    
    -(void)clipWithRect{
        CGRect cropFrame = self.cutView.frame;
        CGFloat orgX = (cropFrame.origin.x-imageX) * (self.image.size.width / imageW);
        CGFloat orgY = (cropFrame.origin.y-imageY) * (self.image.size.height /imageH);
        CGFloat width = cropFrame.size.width * (self.image.size.width / imageW);
        CGFloat height = width*_ratioHeight/_ratioWidth;
        CGRect cropRect = CGRectMake(orgX, orgY, width, height);
        CGImageRef imgRef = CGImageCreateWithImageInRect(self.bgImgView.image.CGImage, cropRect);
        
        CGFloat deviceScale = [UIScreen mainScreen].scale;
        UIGraphicsBeginImageContextWithOptions(cropRect.size, 0, deviceScale);
        CGContextRef context = UIGraphicsGetCurrentContext();
        CGContextTranslateCTM(context, 0, cropRect.size.height);
        CGContextScaleCTM(context, 1, -1);
        CGContextDrawImage(context, CGRectMake(0, 0, cropRect.size.width, cropRect.size.height), imgRef);
        UIImage *newImg = UIGraphicsGetImageFromCurrentImageContext();
        CGImageRelease(imgRef);
        UIGraphicsEndImageContext();
        [self.delegate passImage:newImg];
    }
    
    -(void)createImageView{
        [self.view addSubview:self.bgImgView];
        [self.view addSubview:self.cutView];
        [self.view addSubview:self.topLeftImgView];
        [self.view addSubview:self.topRigthImgView];
        [self.view addSubview:self.bottomLeftImgView];
        [self.view addSubview:self.bottomRigthImgView];
        
        //设置默认值
        [self setDefaultInfo];
        
        self.cutView.origin=self.topLeftImgView.center;
    }
    
    -(void)setDefaultInfo{
        if (self.cutView.width<_minWidth) {
            self.cutView.width=_minWidth;
            self.cutView.height=self.cutView.width *_ratioHeight/_ratioWidth;
        }
        if (self.cutView.height<_minWidth *_ratioHeight/_ratioWidth) {
            self.cutView.height=_minWidth*_ratioHeight/_ratioWidth;
            self.cutView.width=_minWidth;
        }
        
        if (self.cutView.x<imageX) {
            self.cutView.x=imageX;
        }
        if (self.cutView.y<imageY){
            self.cutView.y=imageY;
        }
        if (self.cutView.x+self.cutView.width>imageW+imageX) {
            self.cutView.x=imageW+imageX-self.cutView.width;
            if (self.cutView.x<imageX) {
                self.cutView.x=imageX;
            }
            if (self.cutView.width>imageW) {
                self.cutView.width=imageW;
                self.cutView.height=self.cutView.width *_ratioHeight/_ratioWidth;
                
            }
    
           
        }
        if (self.cutView.y+self.cutView.height>imageH+imageY) {
            self.cutView.y=imageH+imageY-self.cutView.height;
            if (self.cutView.y<imageY){
                self.cutView.y=imageY;
            }
            if (self.cutView.height>imageH) {
                self.cutView.height=imageH;
                self.cutView.width=self.cutView.height *_ratioWidth/_ratioHeight;
            }
          
        }
        
        //更新4个imgView 的位置
        self.topLeftImgView.origin=CGPointMake(self.cutView.origin.x-imgViewWigth/2, self.cutView.origin.y-imgViewWigth/2);
        self.topRigthImgView.x=self.topLeftImgView.x+self.cutView.width;
        self.topRigthImgView.y=self.topLeftImgView.y;
        
        self.bottomLeftImgView.x=self.topLeftImgView.x;
        self.bottomLeftImgView.y=self.topLeftImgView.y+self.cutView.height;
        
        self.bottomRigthImgView.x= self.topRigthImgView.x;
        self.bottomRigthImgView.y= self.bottomLeftImgView.y;
        
    }
    
    -(void)updateFrameWithImgView{
    
    }
    
    - (void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event
    {
        // 拿到UITouch就能获取当前点
        UITouch *touch = [touches anyObject];
        if (touch.view ==self.cutView) {
            // 获取当前点
            CGPoint curP = [touch locationInView:self.cutView];
            // 获取上一个点
            CGPoint preP = [touch previousLocationInView:self.cutView];
            // 获取手指x轴偏移量
            CGFloat offsetX = curP.x - preP.x;
            // 获取手指y轴偏移量
            CGFloat offsetY = curP.y - preP.y;
            // 移动当前view
            self.cutView.transform = CGAffineTransformTranslate(self.cutView.transform, offsetX, offsetY);
            
            
         [self setDefaultInfo];
        }
    }
    
    
    - (void)handleTDTap:(UIPanGestureRecognizer *)theTDTap{
        if (theTDTap.state==UIGestureRecognizerStateChanged) {
            UIImageView *imgView=(UIImageView *)[theTDTap view];
            CGPoint point = [theTDTap locationInView:self.view];
            
            CGPoint translation = [theTDTap translationInView:theTDTap.view];
            CGFloat absX = fabs(translation.x);
            CGFloat absY = fabs(translation.y);
            // 设置滑动有效距离
            if (MAX(absX, absY) < 10)
                return;
            //根据拖动点的Origin和比例更新当前框的大小
            if (absX>absY) {
                //横滑
                NSLog(@"123");
                [self slideWithHorizontally:imgView andPoint:point];
            }else if (absX<absY){
                //竖滑
                NSLog(@"1234");
                [self slideWithVerticaly:imgView andPoint:point];
            }else{
                NSLog(@"12345");
            }
            [self setDefaultInfo];
        }
    }
    
    //横滑判断
    -(void)slideWithHorizontally:(UIImageView *)imgView andPoint:(CGPoint)point{
    
        if (imgView ==self.topLeftImgView) {
            //如果为第一个点
            imgView.origin=point;//更新当前imgView 的位置
            //改变第二个点的Y
            self.topRigthImgView.y= imgView.y;
            
            //更新self.cutView frame
            self.cutView.origin=self.topLeftImgView.center;
            self.cutView.width=self.topRigthImgView.x-self.topLeftImgView.x;
           
            self.cutView.height=self.cutView.width *_ratioHeight/_ratioWidth;
            
            //改变第三个点的X
            self.bottomLeftImgView.x=imgView.x;
            self.bottomLeftImgView.y= imgView.y+self.cutView.height;
            
            //第4个点的位置
            //            self.bottomRigthImgView.x= self.topRigthImgView.x;
            self.bottomRigthImgView.y= self.bottomLeftImgView.y;
        }else if (imgView ==self.topRigthImgView){
            //如果为第二个点
             imgView.origin=point;//更新当前imgView 的位置
            //改变第一个点的Y
            self.topLeftImgView.y=imgView.y;
            //更新self.cutView frame
            self.cutView.origin=self.topLeftImgView.center;
            self.cutView.width=self.topRigthImgView.x-self.topLeftImgView.x;
            self.cutView.height=self.cutView.width *_ratioHeight/_ratioWidth;
            
            //第3个点的位置
            //            self.bottomLeftImgView.x=self.topLeftImgView.x;
            self.bottomLeftImgView.y= imgView.y+self.cutView.height;
            
            //第4个点的位置
            self.bottomRigthImgView.x=imgView.x;
            self.bottomRigthImgView.y= self.bottomLeftImgView.y;
        }else if (imgView ==self.bottomLeftImgView){
            //如果为第3个点
            imgView.origin=point;//更新当前imgView 的位置
    
            //更新self.cutView frame
            
            //第4个点的位置
            self.bottomRigthImgView.y= imgView.y;
            
            self.cutView.width=self.bottomRigthImgView.x-self.bottomLeftImgView.x;
            self.cutView.height=self.cutView.width *_ratioHeight/_ratioWidth;
            
            //第1个点的位置
            self.topLeftImgView.x=imgView.x;
            self.topLeftImgView.y= imgView.y-self.cutView.height;;
            
            //第2个点的位置
            self.topRigthImgView.y= self.topLeftImgView.y;
            
            self.cutView.origin=self.topLeftImgView.center;
            
            
        }else if (imgView ==self.bottomRigthImgView){
            //如果为第4个点
            imgView.origin=point;//更新当前imgView 的位置
            //第3个点的位置
            self.bottomLeftImgView.y= imgView.y;
            //更新self.cutView frame
            
            self.cutView.width=self.bottomRigthImgView.x-self.bottomLeftImgView.x;
            self.cutView.height=self.cutView.width *_ratioHeight/_ratioWidth;
            
            //第1个点的位置
            self.topLeftImgView.y= imgView.y-self.cutView.height;
            
            //第2个点的位置
            self.topRigthImgView.x=imgView.x;
            self.topRigthImgView.y= self.topLeftImgView.y;
            
            self.cutView.origin=self.topLeftImgView.center;
        }else{
            return;
        }
    //    [self setDefaultInfo];
        
    }
    
    -(void)slideWithVerticaly:(UIImageView *)imgView andPoint:(CGPoint)point{
       
        if (imgView ==self.topLeftImgView) {
            //如果为第一个点
            imgView.origin=point;//更新当前imgView 的位置
            //更新self.cutView frame
            self.cutView.origin=self.topLeftImgView.center;
            self.cutView.height=self.bottomLeftImgView.y-self.topLeftImgView.y;
            self.cutView.width=self.cutView.height *_ratioWidth/_ratioHeight;
            
            //改变第3个点
            self.bottomLeftImgView.x=imgView.x;
           
            //改变第二个点的Y
            self.topRigthImgView.x=imgView.x+self.cutView.width;
            self.topRigthImgView.y= imgView.y;
            
            //第4个点的位置
            self.bottomRigthImgView.x= self.topRigthImgView.x;
            self.bottomRigthImgView.y= self.bottomLeftImgView.y;
        }else if (imgView ==self.topRigthImgView){
            //如果为第二个点
             imgView.origin=point;//更新当前imgView 的位置
            //更新self.cutView frame
            self.cutView.height=self.bottomLeftImgView.y-self.topLeftImgView.y;
            self.cutView.width=self.cutView.height *_ratioWidth/_ratioHeight;
            
            //改变第4个点的X
            self.bottomRigthImgView.x=imgView.x;
            
            //改变第1个点的X
            self.topLeftImgView.x=imgView.x-self.cutView.width;
            self.topLeftImgView.y=imgView.y;
            self.cutView.origin=self.topLeftImgView.center;
            
            //第3个点的位置
            self.bottomLeftImgView.x=self.topLeftImgView.x;
            self.bottomLeftImgView.y= self.bottomRigthImgView.y;
            
        }else if (imgView ==self.bottomLeftImgView){
            //如果为第3个点
    
            imgView.origin=point;//更新当前imgView 的位置
    
            //更新self.cutView frame
            self.cutView.height=self.bottomLeftImgView.y-self.topLeftImgView.y;
            self.cutView.width=self.cutView.height *_ratioWidth/_ratioHeight;
            
            //第4个点的位置
            self.bottomRigthImgView.x= imgView.x+self.cutView.width;
            self.bottomRigthImgView.y=imgView.y;
            
            //第1个点的位置
            self.topLeftImgView.x=imgView.x;
            
            //第2个点的位置
            self.topRigthImgView.x=self.bottomRigthImgView.x;
            self.topRigthImgView.y= self.topLeftImgView.y;
            
            self.cutView.origin=self.topLeftImgView.center;
            
            
        }else if (imgView ==self.bottomRigthImgView){
            //如果为第4个点
            
            imgView.origin=point;//更新当前imgView 的位置
    
            //更新self.cutView frame
            self.cutView.height=imgView.y-self.topLeftImgView.y;
            self.cutView.width=self.cutView.height *_ratioWidth/_ratioHeight;
    
            
            //第3个点的位置
            self.bottomLeftImgView.x= imgView.x-self.cutView.width;
            self.bottomLeftImgView.y= imgView.y;
         
            //第1个点的位置
            self.topLeftImgView.x= self.bottomLeftImgView.x;
            
            //第2个点的位置
            self.topRigthImgView.x=imgView.x;
            self.topRigthImgView.y= self.topLeftImgView.y;
            
            self.cutView.origin=self.topLeftImgView.center;
        }else{
            return;
        }
        
        
    }
    
    -(UIImageView *)bgImgView{
        if (!_bgImgView) {
            _bgImgView=[[UIImageView alloc]initWithFrame:CGRectMake(0, 64, ScreenWidth, ScreenHeight-64)];
            _bgImgView.image=_image;
            _bgImgView.contentMode=UIViewContentModeScaleAspectFit;
            if (_bgImgView.image.size.width>=_bgImgView.image.size.height) {
                imageW=ScreenWidth;
                imageH=ScreenWidth *_bgImgView.image.size.height/_bgImgView.image.size.width;
            }else{
                imageH=ScreenHeight-64;
                imageW=imageH *_bgImgView.image.size.width/_bgImgView.image.size.height;
            }
            //计算图片X,Y
             imageX=(ScreenWidth-imageW)/2;
             imageY=(ScreenHeight-64-imageH)/2 +64;
        }
        return _bgImgView;
    }
    
    -(UIView *)cutView{
        if (!_cutView) {
            _cutView=[[UIView alloc]initWithFrame:CGRectMake((ScreenWidth-_minWidth)/2, 0, _minWidth, _minWidth*_ratioHeight/_ratioWidth)];
            _cutView.centerY= self.bgImgView.centerY;
            _cutView.backgroundColor=[UIColor clearColor];
            [Methods setBorder:_cutView andFloat:1.0 andColor:RGB(35, 198, 167)];
        }
        return _cutView;
    }
    
    -(UIImageView *)topLeftImgView{
        if (!_topLeftImgView) {
            _topLeftImgView=[[UIImageView alloc]initWithFrame:CGRectMake(55, 80, imgViewWigth, imgViewWigth)];
    //        _topLeftImgView.backgroundColor=RGB(35, 198, 167);
           _topLeftImgView.image= [Methods ImageFromColor:RGB(35, 198, 167) andCGRect:CGRectMake(0, 0, 10, 10)];
            _topLeftImgView.userInteractionEnabled=YES;
            _topLeftImgView.contentMode=UIViewContentModeCenter;
            UIPanGestureRecognizer *tap=[[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(handleTDTap:)];
            tap.delegate = self;
            tap.cancelsTouchesInView = NO;
            tap.delaysTouchesEnded = NO;
            [self.topLeftImgView addGestureRecognizer:tap];
           
        }
        return _topLeftImgView;
    }
    -(UIImageView *)topRigthImgView{
        if (!_topRigthImgView) {
            _topRigthImgView=[[UIImageView alloc]initWithFrame:CGRectMake(55, 100, imgViewWigth, imgViewWigth)];
    //        _topRigthImgView.backgroundColor=RGB(35, 198, 167);
            _topRigthImgView.image= [Methods ImageFromColor:RGB(35, 198, 167) andCGRect:CGRectMake(0, 0, 10, 10)];
            _topRigthImgView.contentMode=UIViewContentModeCenter;
            _topRigthImgView.userInteractionEnabled=YES;
            UIPanGestureRecognizer *tap=[[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(handleTDTap:)];
            tap.delegate = self;
            tap.cancelsTouchesInView = NO;
            tap.delaysTouchesEnded = NO;
            [self.topRigthImgView addGestureRecognizer:tap];
           
        }
        return _topRigthImgView;
    }
    -(UIImageView *)bottomLeftImgView{
        if (!_bottomLeftImgView) {
            _bottomLeftImgView=[[UIImageView alloc]initWithFrame:CGRectMake(55, 120, imgViewWigth, imgViewWigth)];
    //        _bottomLeftImgView.backgroundColor=RGB(35, 198, 167);
            _bottomLeftImgView.image= [Methods ImageFromColor:RGB(35, 198, 167) andCGRect:CGRectMake(0, 0, 10, 10)];
            _bottomLeftImgView.contentMode=UIViewContentModeCenter;
            _bottomLeftImgView.userInteractionEnabled=YES;
            UIPanGestureRecognizer *tap=[[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(handleTDTap:)];
            tap.delegate = self;
            tap.cancelsTouchesInView = NO;
            tap.delaysTouchesEnded = NO;
            [self.bottomLeftImgView addGestureRecognizer:tap];
         
        }
        return _bottomLeftImgView;
    }
    
    -(UIImageView *)bottomRigthImgView{
        if (!_bottomRigthImgView) {
            _bottomRigthImgView=[[UIImageView alloc]initWithFrame:CGRectMake(55, 140, imgViewWigth, imgViewWigth)];
    //        _bottomRigthImgView.backgroundColor=RGB(35, 198, 167);
            _bottomRigthImgView.image= [Methods ImageFromColor:RGB(35, 198, 167) andCGRect:CGRectMake(0, 0, 10, 10)];
            _bottomRigthImgView.contentMode=UIViewContentModeCenter;
            _bottomRigthImgView.userInteractionEnabled=YES;
            UIPanGestureRecognizer *tap=[[UIPanGestureRecognizer alloc] initWithTarget:self action:@selector(handleTDTap:)];
            tap.delegate = self;
            tap.cancelsTouchesInView = NO;
            tap.delaysTouchesEnded = NO;
            [self.bottomRigthImgView addGestureRecognizer:tap];
       
        }
        return _bottomRigthImgView;
    }
    
    - (void)viewDidAppear:(BOOL)animated
    {
        [super viewDidAppear:animated];
        
        // 禁用 iOS7 返回手势
        if ([self.navigationController respondsToSelector:@selector(interactivePopGestureRecognizer)]) {
            self.navigationController.interactivePopGestureRecognizer.enabled = NO;
        }
    }
    -(void)viewWillDisappear:(BOOL)animated{
        [super viewWillDisappear:animated];
    //    self.navigationController.navigationBar.hidden=NO;
        
        
        // 开启
        if ([self.navigationController respondsToSelector:@selector(interactivePopGestureRecognizer)]) {
            self.navigationController.interactivePopGestureRecognizer.enabled = YES;
        }
    }
    @end
    
    、、、
    
    创建一个类,copy 你懂的,使用的时候需要添加PassImageDelegate这个代理方法,
    然后在
    、、、
    - (void)imagePickerController:(UIImagePickerController *)picker didFinishPickingMediaWithInfo:(NSDictionary *)info
    {
    //在这个代理方法里面我们做这样的处理
      CutImgageVC *vc = [[CutImgageVC alloc] init];
        vc.delegate = self;
        vc.image = _picImage;//你获取到的图片
        vc.ratioWidth = 1.0;
        vc.ratioHeight = 1.0;
        vc.minWidth = 80.0;
        vc.view.backgroundColor = [UIColor whiteColor];
        picker.navigationBar.hidden = YES;
        [picker pushViewController:vc animated:YES];
    
    }
    //剪裁后回调的image
    - (void)passImage:(UIImage *)image {
        _headImage.image = image;
        [self uploadimage];//这个是上传图片的方法,看你们怎么处理了
    }
    
    

    是不是很简单啊,end。。。。

    相关文章

      网友评论

          本文标题:图片剪裁

          本文链接:https://www.haomeiwen.com/subject/xoaycxtx.html