CABasicAnimation 起源于右上角而不是中心

Question

我有一个圆圈，我用动画制作了它向外生长和变大的动画。不幸的是，尽管我设置了anchorPoint，但它并没有从中心向外动画，它似乎锁定了左上角的位置。怎么回事？

查看这张描绘偏离中心的圆圈的图片

代码

- (void)setLayerProperties {
    rippleLayer = [[CAShapeLayer alloc] init];
    rippleLayer.fillColor = [UIColor clearColor].CGColor;

    rippleLayer.strokeColor = _Color.CGColor;
    //rippleLayer.contentsGravity = @"center";
    rippleLayer.anchorPoint = CGPointMake(0.5,0.5);
    rippleLayer.bounds = self.bounds;

    rippleLayer.path = bezierPath.CGPath;
    [self.layer addSublayer:rippleLayer];
}

// Now animate the circle outwards
rippleLayer.opacity = 1;
CABasicAnimation *scale = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
[scale setFromValue:[NSNumber numberWithFloat:1.0f]];
[scale setToValue:[NSNumber numberWithFloat:2.0f]];
[scale setRepeatCount:1];
[scale setDuration:1.0f];
//[scale setRemovedOnCompletion:YES];
[scale setFillMode:kCAFillModeForwards];

[rippleLayer addAnimation:scale forKey:scale.keyPath];

Answer 1

要在其中心缩放图层，您需要设置图层的位置。这可能会对您有所帮助

I want to draw a Smooth animations in iOS using CAPropertyAnimations

定义弧度(角度) ((角度) / 180.0 * M_PI)

CGPoint testCenter = CGPointMake(144.5, 230.0);
CAShapeLayer *aTestLayer = [CAShapeLayer layer];
aTestLayer.path = [UIBezierPath bezierPathWithArcCenter:**CGPointZero** radius:15.0 startAngle:RADIANS(0) endAngle:RADIANS(360) clockwise:YES].CGPath;
aTestLayer.fillColor = [UIColor clearColor].CGColor;
aTestLayer.strokeColor = [UIColor whiteColor].CGColor;
**aTestLayer.position = testCenter;**
aTestLayer.borderWidth = 2.0;

[self.view.layer addSublayer:aTestLayer];

CABasicAnimation *pulse = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
pulse.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut];
pulse.duration = 2;
pulse.repeatCount = HUGE_VALF;
pulse.autoreverses = YES;
pulse.fromValue = [NSNumber numberWithFloat:1.0];
pulse.toValue = [NSNumber numberWithFloat:2.0];


[aTestLayer addAnimation:pulse forKey:nil];