iOS shape with border and corner cutoff

Question

I have this shape: http://screencast.com/t/9UUhAXT5Wu

But the border isn't following it at the cutoff - how could I fix it?

This is my code for the current view:

self.view.backgroundColor = color;
CALayer *backgroundLayer = self.view.layer;

CAShapeLayer *mask = CAShapeLayer.new;
mask.frame = backgroundLayer.bounds;
mask.fillColor = [[UIColor blackColor] CGColor];

CGFloat width = backgroundLayer.frame.size.width;
CGFloat height = backgroundLayer.frame.size.height;

CGMutablePathRef path = CGPathCreateMutable();

int cornerCutSize = 30;
CGPathMoveToPoint(path, NULL, 0, 0);
CGPathAddLineToPoint(path, nil, width, 0);
CGPathAddLineToPoint(path, nil, width, height - cornerCutSize);
CGPathAddLineToPoint(path, nil, width - cornerCutSize, height);
CGPathAddLineToPoint(path, nil, width, height);
CGPathAddLineToPoint(path, nil, 0, height);
CGPathAddLineToPoint(path, nil, 0, 0);
CGPathCloseSubpath(path);

mask.path = path;
CGPathRelease(path);

backgroundLayer.mask = mask;

//add border
CGColorRef borderColor = [UIColor redColor].CGColor;
[backgroundLayer setBorderColor:borderColor];
[backgroundLayer setBorderWidth:3];

Answer 1

Setting the mask layer doesn't change the shape of the border. You'll need to create two layers and assign one to the mask and stroke one, something like:

CAShapeLayer *mask = [CAShapeLayer new];
mask.frame = backgroundLayer.bounds;
mask.path = path;
backgroundLayer.mask = mask;

CAShapeLayer *stroke = [CAShapeLayer new];
stroke.frame = backgroundLayer.bounds;
stroke.path = path;
stroke.lineWidth = 3;
stroke.strokeColor = [UIColor redColor].CGColor;
stroke.fillColor = nil;

[backgroundLayer addSublayer:stroke];