title: iOS - Clipping union of two paths using UIBezierPath appendPath
body: <p>I'm attempting the create a clipping path in the shape of a plus sign, so that subsequent paths that I draw into the same context have this portion removed. I create the clipping path using two rectangle paths overlaid on each other. </p>
  
  <p>This is what I'd like the final drawing to look like when I subsequently draw a circle:</p>
  
  <blockquote>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;xXX|&nbsp;&nbsp;&nbsp;|XXx<br />
  &nbsp;&nbsp;&nbsp;XXXX|&nbsp;&nbsp;&nbsp;|XXXX<br />
  &nbsp;XXXXX|&nbsp;&nbsp;&nbsp;|XXXXX<br />
  &nbsp;———&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;———<br />
  &nbsp;———&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;———<br />
  &nbsp;XXXXX|&nbsp;&nbsp;&nbsp;|XXXXX<br />
  &nbsp;&nbsp;&nbsp;XXXX|&nbsp;&nbsp;&nbsp;|XXXX<br />
  &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;xXX|&nbsp;&nbsp;&nbsp;|XXx</blockquote>
  
  <p>However, it actually looks like this:</p>
  
  <blockquote>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;xXX|&nbsp;&nbsp;&nbsp;|XXx<br />
  &nbsp;&nbsp;&nbsp;XXXX|&nbsp;&nbsp;&nbsp;|XXXX<br />
  &nbsp;XXXXX|&nbsp;&nbsp;&nbsp;|XXXXX<br />
  &nbsp;———&nbsp;XX———<br />
  &nbsp;———&nbsp;XX———<br />
  &nbsp;XXXXX|&nbsp;&nbsp;&nbsp;|XXXXX<br />
  &nbsp;&nbsp;&nbsp;XXXX|&nbsp;&nbsp;&nbsp;|XXXX<br />
  &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;xXX|&nbsp;&nbsp;&nbsp;|XXx</blockquote>
  
  <p>If I read this behaviour correctly, the intersection of the two rectangle paths is not forming part of the clipping mask.</p>
  
  <p>It seems (not surprisingly) that appendPath does not create a single unified path from my two rectangle paths in this case - I'm assuming that there is nothing I can do about this. Furthermore, Core Graphics doesn't seem to have any functions relating to path unions etc.</p>
  
  <p>Does anyone have any idea what I can do? I've included the relevant code snippet.</p>
  
  <p>Drawing the plus sign using one path isn't a solution, as I want to add other overlapping paths to my clipping mask.</p>
  
  <pre><code>        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);
  </code></pre>