【问题标题】:Animate drawing arc with UIBezierPath使用 UIBezierPath 动画绘制弧
【发布时间】:2018-08-03 11:08:29
【问题描述】:

我使用以下方法绘制了一条弧:

- (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];
}

现在我想通过角度为这个弧设置动画。

我正在尝试类似的东西:

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];
}];

但是屏幕上没有显示动画。如何以角度为变化变量为弧设置动画?谢谢。

【问题讨论】:

    标签: ios core-animation


    【解决方案1】:

    下面的代码实现了我的目标:

    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];
    

    【讨论】:

    • 在这种情况下 stripeLayer 是什么?是 - CAShapeLayer 吗?
    • 这应该是公认的答案。请注意,无需将图层删除并再次添加到层次结构中,删除动画并创建一个新的就足够了
    【解决方案2】:

    May MHRadialProgressView 将帮助您以特定角度为弧设置动画。

    【讨论】:

    • 我按照您的链接解决了我的问题。尽管您没有提供代码,但我仍然接受您的答案。如果有人看到我的代码,请投票给我的答案,谢谢!
    • 虽然这在理论上可以回答这个问题,it would be preferable 在此处包含答案的基本部分,并提供链接以供参考。
    猜你喜欢
    • 2018-04-02
    • 1970-01-01
    • 1970-01-01
    • 2023-02-26
    • 1970-01-01
    • 1970-01-01
    • 2017-08-28
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多