Draw hollow circle divided into equal parts - iphone

Question

I want draw a hollow circle that look like the below image
I got the below code snippet to draw hollow circle
- (id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
// Initialization code
self.backgroundColor = [UIColor whiteColor];
// Determine our start and stop angles for the arc (in radians)
startAngle = M_PI * 1.5;
endAngle = startAngle + (M_PI * 2);
}
return self;
}
- (void)drawRect:(CGRect)rect
{
// Display our percentage as a string
NSString* textContent = [NSString stringWithFormat:#"%d", self.percent];
UIBezierPath* bezierPath = [UIBezierPath bezierPath];
// Create our arc, with the correct angles
[bezierPath addArcWithCenter:CGPointMake(rect.size.width / 2, rect.size.height / 2)
radius:130
startAngle:startAngle
endAngle:(endAngle - startAngle) * (_percent / 100.0) + startAngle
clockwise:YES];
// Set the display for the path, and stroke it
bezierPath.lineWidth = 50;
[[UIColor redColor] setStroke];
[bezierPath stroke];
// Text Drawing
CGRect textRect = CGRectMake((rect.size.width / 2.0) - 71/2.0, (rect.size.height / 2.0) - 45/2.0, 71, 45);
[[UIColor blackColor] setFill];
[textContent drawInRect: textRect withFont: [UIFont fontWithName: #"Helvetica-Bold" size: 42.5] lineBreakMode: NSLineBreakByWordWrapping alignment: NSTextAlignmentCenter];
}
I need the separator lines also in the hollow circle,as in the above image.Any suggestion will be helpful ....

Answer 1

Take a look at HKCircularProgressView.
I'm using it for my own project, extending the functionality for your need should be easy.

Answer 2

Not answering exactly what was asked, but a Simple solution for dividing any circle in three equal parts that solved my purpose-
- (void)drawRect:(CGRect)rect {
CGPoint center = CGPointMake(CGRectGetWidth(self.bounds) / 2.f, CGRectGetHeight(self.bounds) / 2.f);
CGFloat radius = 8.f;
UIBezierPath *portionPath1 = [UIBezierPath bezierPath];
[portionPath1 moveToPoint:center];
[portionPath1 addArcWithCenter:center radius:radius startAngle:radians(0) endAngle:radians(120) clockwise:YES];
[portionPath1 closePath];
[[UIColor greenColor] setFill];
[portionPath1 fill];
UIBezierPath *portionPath2 = [UIBezierPath bezierPath];
[portionPath2 moveToPoint:center];
[portionPath2 addArcWithCenter:center radius:radius startAngle:radians(120) endAngle:radians(240) clockwise:YES];
[portionPath2 closePath];
[[UIColor yellowColor] setFill];
[portionPath2 fill];
UIBezierPath *portionPath3 = [UIBezierPath bezierPath];
[portionPath3 moveToPoint:center];
[portionPath3 addArcWithCenter:center radius:radius startAngle:radians(240) endAngle:radians(360) clockwise:YES];
[portionPath3 closePath];
[[UIColor blueColor] setFill];
[portionPath3 fill]; }
At top put these two lines.
#define PI 3.14159265358979323846
static inline float radians(double degrees) { return degrees * PI / 180; }
Hope this will help anybody else too. :)