Generate a CGPath from another path's line width outline

Question

I might not be explaining this in the best way possible, so please bear with me.

What I have is a drawn CGPath on top of a MKMapView object:

The way I was able to achieve this is to create a CGPath for the darker blue line, then create a copy of that path, and then stroke a thicker version of it with a semi-transparent blue color. Here's the code that I'm currently using for this:

    // set the shadow around the path line
    CGContextRef context = UIGraphicsGetCurrentContext();
    CGContextSaveGState(context);
    CGContextSetRGBStrokeColor(context, 0.0f, 0.0f, 0.0f, 0.0f);
    CGContextSetRGBFillColor(context, 0.0f, 0.0f, 1.0f, 0.4f);
    CGPathRef shadowPath = CGPathCreateCopyByStrokingPath(self.path.CGPath, NULL, 80.0f, kCGLineCapRound, kCGLineJoinRound, 0.0f);
    CGContextBeginPath(context);
    CGContextAddPath(context, shadowPath);
    CGContextDrawPath(context, kCGPathFillStroke);
    CGContextRestoreGState(context);
    CGPathRelease(shadowPath);

Works pretty well, nothing wrong so far.

However, what I would like to do though is to get a CGPathRef of the outline of that thicker semi-transparent blue area. Here's another screenshot showing the pseudo-path that I want out of this (hand drawn in red):

How is this possible?

Answer 1

Simple: just use CGPathCreateCopyByStrokingPath. Pass in a wide line width, and a cap of kCGLineCapRound.

Answer 2

You can draw two stokes.

one stroke with width n (which n is the outline width) and black color. another stroke is then drawn on top of the first one, with eraser mode:

CGContextSetBlendMode(context, kCGBlendModeCopy);
CGContextSetFillColorWithColor(context, [[UIColor clearColor] CGColor]);