如何使用UIBezierPath裁剪圖像與另一個形狀

我的代碼存在問題，因爲我不清楚使用UIBezierPath裁剪圖像。我繪製了一個形狀視圖，用於在一個imageview上裁剪。 MyViewController有2個圖像瀏覽和一個squareview。有原始圖像視圖和裁剪圖像視圖（裁剪時的結果）。我想將我的squareview移動到任何位置，以裁剪原始圖像視圖以使用我的形狀顯示在裁剪後的圖像視圖中。如何使用UIBezierPath裁剪圖像與另一個形狀

enter image description here

後，我將我的方形像圖像below.Then的originalImageView我挖掘作物。

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

請幫我解決這個問題。

來源

2013-12-16 Sovannarith

你爲什麼要繪製整個視圖進入情境？你應該計算一個矩形，並從圖像中將矩形繪製到上下文中。 – Wain

你的意思是？ – Sovannarith

'self.view drawViewHierarchyInRect'和'self.view.layer renderInContext'。這吸引了整個觀點。你只是想要圖像的一部分... – Wain

您的captureImage是從整個視圖的上下文中獲取的。然後將其繪製到另一個較小尺寸的上下文中，該尺寸等於squareView的大小，然後獲取名爲croppedImage的相同圖像。這正是你在上一張截圖上的圖片，這就是你的錯誤所在。

我居然沒有使用bezierPath裁剪工作，但如果你只需要長方形croppings可以使用多simplier方式做到這一點：Cropping an UIImage

來源

2013-12-16 16:27:25 Miroslav

如何使用UIBezierPath裁剪圖像與另一個形狀

回答

相關問題