Ios 重复忙圈动画

我目前正在尝试创建一个繁忙的动画，如下所示：

环路的断开部分不断围绕圆圈旋转，以表示正在进行操作

我用CAShapeLayer定义了两个圆，一个是用strokeEnd“填充”圆，另一个是用strokeStart“清除”。“清理圈”从“填充圈”前面的1/10开始：

NSInteger radius = self.frame.size.width / 2;
CGFloat lineWidth = radius / 7.5;

UIColor *color = [UIColor redColor];

//add the outer circle
_outerCircle1 = [CAShapeLayer layer];
_outerCircle1.path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(0, 0, 2.0*radius, 2.0*radius) cornerRadius:radius].CGPath;
_outerCircle1.position = CGPointMake(0, 0);
_outerCircle1.strokeStart = 1;
_outerCircle1.fillColor = [UIColor clearColor].CGColor;
_outerCircle1.strokeColor = color.CGColor;
_outerCircle1.lineWidth = lineWidth;
[self.layer addSublayer:_outerCircle1];

_outerCircle2 = [CAShapeLayer layer];
_outerCircle2.path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(0, 0, 2.0*radius, 2.0*radius) cornerRadius:radius].CGPath;
_outerCircle2.position = CGPointMake(0, 0);
_outerCircle2.strokeEnd = 0;
_outerCircle2.fillColor = [UIColor clearColor].CGColor;
_outerCircle2.strokeColor = color.CGColor;
_outerCircle2.lineWidth = lineWidth;
[self.layer addSublayer:_outerCircle2];

[self createAnimations];

这里是我定义动画的地方。当“清除圆”完全围绕圆时，我必须开始一个新的动画，完成动画的其余部分，然后重新开始动画：

- (void)createAnimations {
[CATransaction begin];
[CATransaction setCompletionBlock:^{
    [CATransaction begin];
    [CATransaction setCompletionBlock:^{
        [self createAnimations];
    }];

    CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
    animation.duration = .5;
    animation.fromValue = [NSNumber numberWithFloat:.9];
    animation.toValue = [NSNumber numberWithFloat:1];
    animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
    [_outerCircle2 addAnimation:animation forKey:@"fillingAnimation"];

    animation = [CABasicAnimation animationWithKeyPath:@"strokeStart"];
    animation.duration = .5;
    animation.fromValue = [NSNumber numberWithFloat:0];
    animation.toValue = [NSNumber numberWithFloat:.1];
    animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
    [_outerCircle2 addAnimation:animation forKey:@"clearingAnimation"];

    [CATransaction commit];
}];

CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
animation.duration = 5;
animation.fromValue = [NSNumber numberWithFloat:0];
animation.toValue = [NSNumber numberWithFloat:.9];
animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
[_outerCircle2 addAnimation:animation forKey:@"fillingAnimation"];

animation = [CABasicAnimation animationWithKeyPath:@"strokeStart"];
animation.duration = 5;
animation.fromValue = [NSNumber numberWithFloat:.1];
animation.toValue = [NSNumber numberWithFloat:1];
animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
[_outerCircle1 addAnimation:animation forKey:@"clearingAnimation"];

[CATransaction commit];

}

此代码具有持续设置圆动画的预期效果，但每次为主动画或后续动画触发完成块时，动画都会结巴

---

我不确定最好的方式来执行这个动画。谁能帮我改进一下吗？？谢谢

要创建旋转动画，请在

createAnimations

方法中，将现有的替换为：

CABasicAnimation *spinAnimation = [CABasicAnimation animationWithKeyPath:@"transform.rotation"];
spinAnimation.byValue = [NSNumber numberWithFloat:2.0f*M_PI];
spinAnimation.duration = 1.3;
spinAnimation.repeatCount = HUGE_VALF;
[self.viewThatHasTheDrawings.layer addAnimation:spinAnimation forKey:@"indeterminateAnimation"];

这将永远旋转动画

要取消动画，请使用：

[self.viewThatHasTheDrawings.layer removeAllAnimations];

---

那很有效，谢谢！！当然，在我提交这个问题后，我开始研究旋转动画（你的帖子验证了这一点）。。。我不知道为什么我之前没有想到这一点！我发现上面的代码有一个问题。如果我使用

self.layer addAnimation

将动画添加到视图中，则每当我的表视图刷新时（此视图位于表视图单元格中），动画都会停止。如果我将动画添加到外圆，它将永远旋转，但它将围绕左上角而不是视图的中心旋转。我怎么才能让这个视图保持旋转？我想出来了。如果我为outerCircle层设置

frame

而不是

position

，它将围绕帧的中心适当旋转。以前，宽度和高度都设置为0。