How to animate the drawing of a CGPath?

Question

I am wondering if there is a way to do this using Core Animation. Specifically, I am adding a sub-layer to a layer-backed custom NSView and setting its delegate to another custom NSView. That class's drawInRect method draws a single CGPath:

- (void)drawInRect:(CGRect)rect inContext:(CGContextRef)context
{
    CGContextSaveGState(context);
    CGContextSetLineWidth(context, 12);

    CGMutablePathRef path = CGPathCreateMutable();
    CGPathMoveToPoint(path, NULL, 0, 0);
    CGPathAddLineToPoint(path, NULL, rect.size.width, rect.size.height);

    CGContextBeginPath(context);
    CGContextAddPath(context, path);
    CGContextStrokePath(context);
    CGContextRestoreGState(context);
}

My desired effect would be to animate the drawing of this line. That is, I'd like for the line to actually "stretch" in an animated way. It seems like there would be a simple way to do this using Core Animation, but I haven't been able to come across any.

Do you have any suggestions as to how I could accomplish this goal?

Answer 1

Sure—don't draw the line yourself. Add a 12-pixel-high sublayer with a flat background color, starting with a zero-width frame and animating out to your view's width. If you need the ends to be rounded, set the layer's cornerRadius to half its height.