将圆角应用于使用UIBezierPath创建的弧

时间:2013-12-18 18:47:34

标签: objective-c uibezierpath

我正在使用UIBezierPath创建的循环进度条。进度条如下图所示:

enter image description here

我的问题是:如何使圆弧的边缘变圆而不是矩形?

我用来绘制圆弧的代码如下:

 // Draw the arc with bezier path
        int radius = 100;

        arc = [CAShapeLayer layer];
        arc.path = [UIBezierPath bezierPathWithArcCenter:CGPointMake(100, 50) radius:radius startAngle:M_PI endAngle:M_PI/150 clockwise:YES].CGPath;
        arc.position = CGPointMake(CGRectGetMidX(self.view.frame)-radius,
                                    CGRectGetMidY(self.view.frame)-radius);
        arc.fillColor = [UIColor clearColor].CGColor;
        arc.strokeColor = [UIColor purpleColor].CGColor;
        arc.cornerRadius = 0.5;
        arc.lineWidth = 6;

        [self.view.layer addSublayer:arc];

        // Animation of the progress bar
        drawAnimation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
        drawAnimation.duration            = 5.0; // "animate over 10 seconds or so.."
        drawAnimation.repeatCount         = 1.0;  // Animate only once..
        drawAnimation.removedOnCompletion = YES;   // Remain stroked after the animation..
        drawAnimation.fromValue = [NSNumber numberWithFloat:0.0f];
        drawAnimation.toValue   = [NSNumber numberWithFloat:10.0f];
        drawAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn];
        [arc addAnimation:drawAnimation forKey:@"drawCircleAnimation"];

我尝试使用arc.cornerRadius,但它似乎什么也没有返回。

任何帮助都将不胜感激。

提前谢谢!

花岗岩

3 个答案:

答案 0 :(得分:17)

lineCapStyle设置为kCGLineCapRound(在bezier路径上)以使用圆边绘制线条的末端。

您还可以在形状图层上设置lineCap以执行相同的操作。

答案 1 :(得分:8)

要使角落成为圆形,你可以使用它。

arc.lineCap = @"round";

答案 2 :(得分:0)

快速等效项是:

let circlePath = UIBezierPath(…)
circlePath.lineCapStyle = .round