Home Ask Login Register

Developers Planet

Your answer is one click away!

Sai Bharath Yadav February 2016

How to draw a pie chart based on the marks percentage in ios?

I am working on one of the school application. In which, based on the percentage achieved by student respective piechart should be drawn with an animation.

For example, if student got only 50%, the pie chart needs to be filled with 50% with an animation.

Can you please help me on this. I used the below code,

// Set up the shape of the circle
int radius = 60;
CAShapeLayer *circle = [CAShapeLayer layer];
// Make a circular shape
circle.path = [UIBezierPath bezierPathWithRoundedRect:CGRectMake(0, 0, 2.0*radius, 2.0*radius)
// Center the shape in self.view
circle.position = CGPointMake(CGRectGetMidX(self.view.frame)-radius,

// Configure the apperence of the circle
circle.fillColor = [UIColor clearColor].CGColor;
circle.strokeColor = [UIColor redColor].CGColor;
circle.lineWidth = 10;

// Add to parent layer
[self.view.layer addSublayer:circle];

// Configure animation
CABasicAnimation *drawAnimation = [CABasicAnimation animationWithKeyPath:@"strokeEnd"];
drawAnimation.duration            = 10.0; // "animate over 10 seconds or so.."
drawAnimation.repeatCount         = 1.0;  // Animate only once..

// Animate from no part of the stroke being drawn to the entire stroke being drawn
drawAnimation.fromValue = [NSNumber numberWithFloat:0.0f];
drawAnimation.toValue   = [NSNumber numberWithFloat:0.75f];

// Experiment with timing to get the appearence to look the way you want
drawAnimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn];

// Add the animation to the circle
[circle addAnimation:drawAnimation forKey:@"drawCircleAnimation"];

I would like to stop the animation at 50%.


Bharath February 2016

Please use the circle.strokeEnd = 0.5f;

It will automatically stops at 50%, if you give 1.0f it goes to 100%

Post Status

Asked in February 2016
Viewed 3,427 times
Voted 5
Answered 1 times


Leave an answer

Quote of the day: live life