如何使用UIBezierPath使用另一个Shape裁剪图像

时间:2013-12-16 16:11:13

标签: ios objective-c ipad uibezierpath

我的代码有问题,因为我不清楚使用UIBezierPath裁剪图像。我已经绘制了一个形状视图来移动以在一个imageview上进行裁剪。 MyViewController有2个图像视图和一个squareview。 有originalImageView和croppedImageView(裁剪时的结果)。我想将squareview移动到任何位置以裁剪originalImageView以在我的形状的croppedImageView中显示。

enter image description here

在下面的原始图像上移动我的方形Shape后,然后点击裁剪。

enter image description here

但是,croppedImageView上的结果显示错误的图像。

enter image description here

我将详细说明我的代码:

在SquareView.m

   #import "SquareView.h"
   #import <QuartzCore/QuartzCore.h>
   @interface SquareView()
   {
         UIBezierPath *aPath;
         UILabel *textLabel;
   }

   @end
   @implementation SquareView

   - (id)initWithFrame:(CGRect)frame
   {
         self = [super initWithFrame:frame];
         if (self) {
               self.backgroundColor = [UIColor clearColor];
               self.opaque = NO;
               CGRect labelRect = CGRectMake(self.frame.size.width/2 - 30, self.frame.size.height/2 - 10, 150, 20);
               textLabel = [[UILabel alloc] initWithFrame:labelRect];
               [textLabel setBackgroundColor:[UIColor clearColor]];
        }
         return self;
   }


   -(void)touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event
   {
         UITouch *aTouch = [touches anyObject];
         CGPoint location = [aTouch locationInView:self];
         CGPoint previousLocation = [aTouch previousLocationInView:self];
         self.frame = CGRectOffset(self.frame, location.x-previousLocation.x, location.y-    previousLocation.y);
         [textLabel setText:@"Click To Crop"];
         [textLabel setTextColor:[UIColor greenColor]];
         [self addSubview:textLabel];
   }

   -(void)touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event
   {
         [textLabel removeFromSuperview];
   }


   - (void)drawRect:(CGRect)rect
   {
         aPath = [UIBezierPath bezierPath];
        // Start Point and Draw the lines.
         [aPath moveToPoint:CGPointMake(0,0)];
         [aPath addLineToPoint:CGPointMake(300,0)];
         [aPath addLineToPoint:CGPointMake(300, 300)];
         [aPath addLineToPoint:CGPointMake(0, 300)];
         [aPath closePath];

         //Fill Color and Line Color
         UIColor *colorBg = [UIColor clearColor];
         UIColor *lineColor = [UIColor redColor];
         [aPath setLineWidth:5];
         [lineColor setStroke];
         [aPath stroke];
         [colorBg setFill];
         [aPath fill];

     }
     @end

在MyViewController.m

     -(void)initSquareView
     {
           sqaure = [[SquareView alloc] initWithFrame:CGRectMake(100, 200, 300, 300)];

           tapeGesture = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(cropImage:)];
           tapeGesture.numberOfTapsRequired = 1;

           [sqaure addGestureRecognizer:tapeGesture];
           [sqaure addGestureRecognizer:pinchGesture];
           [self.view addSubview:sqaure];
     }

    -(void)cropImage:(UITapGestureRecognizer *)gesture
    {

            [sqaure removeFromSuperview];

            UIGraphicsBeginImageContextWithOptions(self.view.frame.size, NO, 0.0);
            CGContextRef context_ = UIGraphicsGetCurrentContext();

            //(if iOS 7), (else iOS 6)
            if ([self respondsToSelector:@selector(drawViewHierarchyInRect:afterScreenUpdates:)])
               [self.view drawViewHierarchyInRect:self.view.bounds afterScreenUpdates:NO];
            else
               [self.view.layer renderInContext:context_];
            UIImage *captureImage = UIGraphicsGetImageFromCurrentImageContext();
            UIGraphicsEndImageContext();

            CGRect imageRect = CGRectMake(0, 0, sqaure.frame.size.width, sqaure.frame.size.height);
            UIGraphicsBeginImageContextWithOptions(sqaure.bounds.size, NO, 0.0f);
           //Capture as square shape
           //My problem is here 
            UIBezierPath *sqaurepath = [UIBezierPath bezierPath];
            [sqaurepath moveToPoint:CGPointMake(0,0)];
            [sqaurepath addLineToPoint:CGPointMake(300,0)];
            [sqaurepath addLineToPoint:CGPointMake(300, 300)];
            [sqaurepath addLineToPoint:CGPointMake(0, 300)];
            [sqaurepath closePath];
            [sqaurepath addClip];

            [captureImage drawInRect:imageRect];
            UIImage *croppedImage = UIGraphicsGetImageFromCurrentImageContext();
            UIGraphicsEndImageContext();

            [self.captureImageView setContentMode:UIViewContentModeScaleAspectFit];
            [self.captureImageView setImage:croppedImage];
            [self.captureImageView setUserInteractionEnabled:YES];
            [[self.captureImageView layer] setBorderColor:[UIColor redColor].CGColor];
            [[self.captureImageView layer] setBorderWidth:3];;

   }
   @end

请帮我解决这个问题。

1 个答案:

答案 0 :(得分:0)

您的captureImage是从整个视图的上下文中获取的。然后将其绘制到另一个尺寸较小的上下文中,该上下文等于squareView的大小,然后获取名为croppedImage的相同图像。这正是你在最后一个截图上所拥有的,这就是你的错误。

我实际上没有使用bezierPath进行裁剪,但如果只需要矩形裁剪,则可以使用更简单的方法来执行此操作:Cropping an UIImage