Masking a sublayer gradient to CAShapeLayer

Question

I have this CAShapeLayer with a bezierPathWithOvalInRect. I want to make the gradient layer fill only the circle, but at the moment it fills the whole frame.

How do I do this?

CAShapeLayer *layerInsides = [CAShapeLayer layer];
layerInsides.path = [UIBezierPath bezierPathWithOvalInRect:rectFrom(frameInsides)].CGPath;

CAGradientLayer *gradientLayer = [CAGradientLayer layer];
gradientLayer.frame = layerInsides.frame;
gradientLayer.colors = @[(id)[UIColor colorWithRed:1 green:0 blue:0 alpha:1].CGColor, (id)[UIColor colorWithRed:0 green:0 blue:0 alpha:1].CGColor];
gradientLayer.locations = @[@0.0, @1];
gradientLayer.cornerRadius = self.layer.cornerRadius;
[layerInsides addSublayer:gradientLayer];

Answer 1

Instead of adding your content to the shape as a sublayer you need to set your CAShapeLayer as a mask for your colored layer:

gradientLayer.mask = layerInsides;