CAShapeLayer preenchendo com outro CAShapeLayer como uma máscara
Minha pergunta é sobre o preenchimento da animação 1CAShapeLayer
com outroCAShapeLayer
. Então, eu escrevi um código que quase atinge meu objetivo.
Criei uma camada baseada e a preencha com outra. Código abaixo:
- (void)viewDidLoad {
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
_shapeLayer = [CAShapeLayer layer];
[self drawBackgroundLayer];
}
// my main/backgound layer
- (void)drawBackgroundLayer {
_shapeLayer.frame = CGRectMake(0, 0, 250, 250);
_shapeLayer.lineWidth = 3;
_shapeLayer.strokeColor = [UIColor blackColor].CGColor;
_shapeLayer.fillColor = UIColor.whiteColor.CGColor;
_shapeLayer.path = [UIBezierPath bezierPathWithRect:_shapeLayer.bounds].CGPath;
[self.view.layer addSublayer:_shapeLayer];
[self createCircleLayer];
}
Crie uma camada de máscara circulada para preenchimento:
- (void)createCircleLayer {
_shapeLayer.fillColor = UIColor.greenColor.CGColor;
CAShapeLayer *layer = [CAShapeLayer layer];
CGFloat radius = _shapeLayer.bounds.size.width*sqrt(2)/2;
layer.bounds = CGRectMake(0, 0, 2*radius, 2*radius);
layer.position = CGPointMake(_shapeLayer.bounds.size.width/2, _shapeLayer.bounds.size.height/2);
UIBezierPath *path = [UIBezierPath bezierPathWithRoundedRect:layer.bounds cornerRadius:radius];
layer.path = path.CGPath;
layer.transform = CATransform3DMakeScale(0.1, 0.1, 1);
_shapeLayer.mask = layer;
}
// nosso resultado é o próximo]
Então, vamos animá-lo. Acabei de transformar a camada para preencher todo o "_shapeLayer".
- (void)animateMaskLayer:(CAShapeLayer *)maskLayer {
CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform"];
animation.toValue = [NSValue valueWithCATransform3D:CATransform3DMakeScale(1, 1, 1.0)];
animation.duration = 1;
animation.removedOnCompletion = NO;
animation.fillMode = kCAFillModeForwards;
[newLayer addAnimation:animation forKey:@"transform"];
}
Agora, quero fazer o mesmo com essa camada verde (preencha com a cor vermelha). Mas quando uso a máscara, tenho um círculo vermelho e o fundo branco o que é obviamente. Meu objetivo aqui é ter um círculo vermelho e fundo verde. Como enchimento normal com outra cor. Usar máscara inversa também não ajudará. Então, eu simplesmente não tenho idéia de como fazê-lo.
Se você sugere usar:
[_shapeLayer addSublayer:layer];
não funcionará, pois haverá não apenas quadrados, mas caminhos diferentes e clipToBounds não são uma opção.
Obrigado por qualquer ajuda!