图片剪裁

2017-06-28  本文已影响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。。。。

上一篇下一篇

猜你喜欢

热点阅读