CODEWITHSUNDEEP
iphoneanimation
Sathish
Sathish

Reputation:

Arc / Circle animation in iphone

How would I animate a circle on the iPhone so that the arc starts at "0 degrees" and ends at "360 degrees"?

Advance Thanks, Sat

Upvotes: 1

Views: 5116

Answers (3)

Sorin Antohi
Sorin Antohi

Reputation: 6135

you should read the documentation that Felixyz provided and if you want an example of how to animate the circle have a look over the MBProgressHUD at this link link text. The loader has two modes one with a UIViewActivityIndicator and a progress indicator (a filling circle that it is animated from 0 to 360 degress) i think the last mode is what you want.

the fallowing code is from copy/paste from that implementation that animates the circle:

- (void)drawRect:(CGRect)rect {
    CGRect allRect = self.bounds;
    CGRect circleRect = CGRectMake(allRect.origin.x + 2, allRect.origin.y + 2, 
                                   allRect.size.width - 4, allRect.size.height - 4);
    CGContextRef context = UIGraphicsGetCurrentContext();
    // Draw background
    CGContextSetRGBStrokeColor(context, 1.0, 1.0, 1.0, 1.0); // white
    CGContextSetRGBFillColor(context, 1.0, 1.0, 1.0, 0.1); // translucent white
    CGContextSetLineWidth(context, 2.0);
    CGContextFillEllipseInRect(context, circleRect);
    CGContextStrokeEllipseInRect(context, circleRect);
    // Draw progress
    float x = (allRect.size.width / 2);
    float y = (allRect.size.height / 2);
    CGContextSetRGBFillColor(context, 1.0, 1.0, 1.0, 1.0); // white
    CGContextMoveToPoint(context, x, y);
    CGContextAddArc(context, x, y, (allRect.size.width - 4) / 2, -(PI / 2), 
                                   (self.progress * 2 * PI) - PI / 2, 0);
    CGContextClosePath(context);    CGContextFillPath(context);
}

but read the documentation first! hope it helps

Upvotes: 0

PakitoV
PakitoV

Reputation: 2498

Here you can find a great sample code about circle animation:

http://www.iphonedevsdk.com/forum/iphone-sdk-development/24152-draw-animated-circle-iphone-using-core-graphics.html

Upvotes: 1

Felixyz
Felixyz

Reputation: 19143

You need to read the Quartz 2D Programming Guide's section on arcs. (I am assuming you are creating an app with the Cocoa Touch API, not a web app.) You also need to know how to set up a custom animation. You will have to create a custom UIView or CALayer to do the drawing, and create a property (arc degree) that can be animated with a CAAnimation object. Alternatively, you can control the animation using an NSTimer instead. You pretty much have to have a grasp of these classes (and others) to pull this off.

Upvotes: 2

Related Questions