如何在iOS中绘制分段圈？

Question

我希望能够轻松找到这个问题的答案，但不幸的是，我的搜索没有产生任何结果。如何在iOS中绘制这样的圆圈？

Answer 1

我最终使用UIBezierPath。这就是我画出给定圆圈的方式：

CGFloat DegreesToRadians(CGFloat degrees)
{
   return degrees * M_PI / 180;
 };

- (void)drawRect:(CGRect)rect
{
CGFloat radius = 70;
CGPoint center = CGPointMake(90 + radius, 170 + radius);
CGFloat start = DegreesToRadians(-90), end;

NSArray *angles = @[@"0", @"60", @"-90"];
NSArray *colors = @[[UIColor yellowColor], [UIColor blueColor], [UIColor redColor]];

int col_counter = 0;

for (NSString *angle in angles)
{
    CGFloat value = [angle floatValue];
    end = DegreesToRadians(value);

    CGPoint next;
    next.x = center.x + radius * cos(start);
    next.y = center.y + radius * sin(start);

    UIBezierPath *path = [UIBezierPath bezierPath];

    [path moveToPoint:center];
    [path addLineToPoint:next];
    [path addArcWithCenter:center radius:radius startAngle:start endAngle:end clockwise:YES];
    [path addLineToPoint:center];

    UIColor *color = colors[col_counter];
    [color set];
    [path fill];

    col_counter++;

    start = end;
}
}

Answer 2

使用Andrey的答案我可以在循环之后添加一小段代码，在中间添加一个白色圆圈，以创建看起来像带有厚多色边框的白色圆圈。

end = DegreesToRadians(360);

start = DegreesToRadians(-90);

int width = 10;  // thickness of the circumference
radius -= width;

CGPoint next;
next.x = center.x + radius * cos(start);
next.y = center.y + radius * sin(start);

UIBezierPath *path = [UIBezierPath bezierPath];

[path moveToPoint:center];
[path addLineToPoint:next];
[path addArcWithCenter:center radius:radius startAngle:start endAngle:end clockwise:YES];
[path addLineToPoint:center];

UIColor *color = [UIColor whiteColor];
[color set];
[path fill];