在同一中心位置缩放一个圆

Scale a circle at same center position

我正在努力缩放圆圈并保持相同的中心位置,它看起来像地图上的脉动圆圈。

AnimationView.m

@property (nonatomic, strong) UIBezierPath *ovalPath;

- (void)drawCircle
{
    UIGraphicsBeginImageContext(self.frame.size);
    CGRect rect = CGRectMake(25.45, 49.25, 5.8, 5.8);
    self.ovalPath = [UIBezierPath bezierPathWithOvalInRect: rect];
    [self.ovalPath fill];
    UIGraphicsEndImageContext();
}

- (void)bumpUpCircle
{
    CAShapeLayer *pathLayer = [CAShapeLayer layer];

    pathLayer.frame     = self.bounds;
    pathLayer.path      = self.ovalPath.CGPath;
    pathLayer.fillColor = [UIColor blackColor].CGColor;
    pathLayer.lineWidth = 2.0f;
    pathLayer.lineJoin  = kCALineJoinBevel;
    [self.layer addSublayer:pathLayer];

    CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"transform.scale"];
    animation.fromValue = [NSValue valueWithCATransform3D:CATransform3DMakeScale(0.0, 0.0, 0)];
    animation.toValue = [NSValue valueWithCATransform3D:CATransform3DMakeScale(10.0, 10.0, 10.0)];
    animation.repeatCount = 1;
    animation.removedOnCompletion = NO;
    animation.fillMode = kCAFillModeForwards;
    animation.duration = 1;
    animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut];
    [pathLayer addAnimation:animation forKey:@"transform.scale"];
    NSLog(@"%@",NSStringFromCGPoint(self.bounds.origin));
}

但是,缩放位置在一个奇怪的位置,而不是圆心。

任何想法将不胜感激。谢谢

编辑:

GIF uploaded

我对脉冲圈的建议是使用 UIView 并将其添加为 UIViewController 中的子视图。在下面的例子中,你得到一个脉冲圆(一个 UIView 和一个 cornerRadius 像半径)在几行中放大和缩小。包括这个,例如在你的 UIViewControllerviewDidLoad 中尝试一下。

int radius = 100;
UIView * circleView = [[UIView alloc] init];
circleView.backgroundColor = [UIColor greenColor];
circleView.frame = CGRectMake(0, 0, radius*2, radius*2);
circleView.center = self.view.center;
circleView.layer.cornerRadius = radius;
[self.view addSubview:circleView];

[UIView animateWithDuration:0.8f
                      delay:0.0f
                    options:UIViewAnimationOptionAutoreverse | UIViewAnimationOptionRepeat
                 animations:^{
                     circleView.transform = CGAffineTransformMakeScale(1.1, 1.1);
                 } completion:^(BOOL fin) { 
                     // Do nothing
                 }];