Animate drawing arc with UIBezierPath

问题

I have drawn an arc using:

- (void)drawRect:(CGRect)rect {
    UIBezierPath *stripePath = [UIBezierPath bezierPath];
    [arcColor set];
    [stripePath addArcWithCenter:center radius:radius startAngle:startAngle endAngle:endAngle clockwise:clockwise];
    stripePath.lineWidth = arcWidth;
    stripePath.lineCapStyle = kCGLineCapRound;
    stripePath.lineJoinStyle = kCGLineCapRound;
    [stripePath stroke];
}

Now I want to animate this arc by the angle.

I am trying it with something like:

angle = startAngle;
[UIView animateWithDuration:1
                      delay:0
                    options:UIViewAnimationOptionCurveEaseInOut
                 animations:^{
                     angle = endAngle;
                     [stripePath addArcWithCenter:center radius:radius startAngle:startAngle endAngle:angle clockwise:clockwise];
                     [stripePath stroke];
}];

However no animation is being displayed on screen. How to animate the arc with the angle as the changing variable? Thanks.

回答1:

May MHRadialProgressView will help you to animating arc by specific angle.

回答2:

Below code achieved my goal:

UIBezierPath *stripePath = [UIBezierPath bezierPath];
[arcColor set];
stripePath.lineWidth = arcWidth;
stripePath.lineCapStyle = kCGLineCapRound;
stripePath.lineJoinStyle = kCGLineCapRound;
[stripePath addArcWithCenter:center radius:radius startAngle:startAngle endAngle:endAngle clockwise:clockwise];

[_stripeLayer setPath:stripePath.CGPath];
[_stripeLayer setStrokeColor:arcColor.CGColor];
[_stripeLayer setFillColor:[UIColor clearColor].CGColor];
[_stripeLayer setLineWidth:arcWidth];
[_stripeLayer setStrokeStart:0.0];
[_stripeLayer setStrokeEnd:1.0];
[_stripeLayer setLineCap:kCALineCapRound];
[_stripeLayer setLineJoin:kCALineCapRound];

if ([_stripeLayer superlayer]) {
    [_stripeLayer removeAllAnimations];
    [_stripeLayer removeFromSuperlayer];

}
[self.layer addSublayer:_stripeLayer];

CABasicAnimation *animateStrokEnd = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
animateStrokEnd.duration = 1;
animateStrokEnd.fromValue = [NSNumber numberWithFloat:0.0];
animateStrokEnd.toValue = [NSNumber numberWithFloat:1.0];
[_stripeLayer addAnimation:animateStrokEnd forKey:nil];

来源：https://stackoverflow.com/questions/29115152/animate-drawing-arc-with-uibezierpath

标签

ios

core-animation