IOS - combining trimming of two paths using the UIBezierPath appendPath

I am trying to create a clipping path in the shape of a plus sign, so that the subsequent paths that I draw in the same context remove this part. I create a clipping path using two rectangle paths superimposed on top of each other.

Here is what I would like the last drawing to look like when I subsequently drew a circle:

    xXX | | XXx
XXXX | | XXXX
  XXXXX | | XXXXX
  --- ---
  --- ---
  XXXXX | | XXXXX
XXXX | | Xxxx
      xxx | | x

However, it looks something like this:

    xXX | | XXx
XXXX | | XXXX
  XXXXX | | XXXXX
  --- XX ---
  --- XX ---
  XXXXX | | XXXXX
XXXX | | Xxxx
      xxx | | x

If I read this behavior correctly, the intersection of the two paths of the rectangle is not part of the masking.

It seems (not surprisingly) that appendPath does not create a single path from my two rectangle paths in this case - I assume that I can do nothing about it. In addition, Core Graphics has no functions related to path joins, etc.

Does anyone know what I can do? I have included the appropriate piece of code.

Drawing a plus sign using one path is not a solution, since I want to add other overlapping paths to my clipping mask.

        CGContextSaveGState(context);

        // create clipping path
        UIBezierPath *clippingPath = [UIBezierPath bezierPath];
        clippingPath = [UIBezierPath bezierPathWithRect:CGRectMake(centrePoint.x - 2.0f, 0.0f, 4.0f, self.sizeY)];
        [clippingPath appendPath:[UIBezierPath bezierPathWithRect:CGRectMake(0.0f, centrePoint.y - 2.0f, self.sizeX, 4.0f)]];

        // use the clipping path to create a hole in the context
        CGContextAddPath(context, clippingPath.CGPath);
        CGRect boundingRect = CGContextGetClipBoundingBox(context);
        CGContextAddRect(context, boundingRect);
        CGContextEOClip(context);

        // draw the icon shape (clipped portion is removed)
        iconBezierPath = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(self.sizeX / 3.0f, self.sizeY / 2.25f, self.sizeX / 3.0f, self.sizeX / 3.0f)];

        [highlightColor setFill];
        [iconBezierPath fill];
        CGContextRestoreGState(context);
+5
1

, CGRectIntersection

    CGContextSaveGState(context);

    CGRect rect1 = CGRectMake(centrePoint.x - 2.0f, 0.0f, 4.0f, self.sizeY);
    CGRect rect2 = CGRectMake(0.0f, centrePoint.y - 2.0f, self.sizeX, 4.0f);
    CGRect rect3 = CGRectIntersection(rect1, rect2);

    CGContextAddRect(context, rect1);
    CGContextAddRect(context, rect2);
    CGContextAddRect(context, rect3);

    CGRect boundingRect = CGContextGetClipBoundingBox(context);
    CGContextAddRect(context, boundingRect);
    CGContextEOClip(context);

        // draw the icon shape (clipped portion is removed)
    iconBezierPath = [UIBezierPath bezierPathWithOvalInRect:CGRectMake(self.sizeX / 3.0f, self.sizeY / 2.25f, self.sizeX / 3.0f, self.sizeX / 3.0f)];

    [highlightColor setFill];
    [iconBezierPath fill];

    CGContextRestoreGState(context);

, , " ".

enter image description here

+2

All Articles