Goo Software has written a unique progress indicator, showing progress in a circular fashion (think Pacman).
The screenshots below show how the progress indicator looks, including the final state with a custom checkmark.
There is a particularly interesting chunk of code that deserves a look, it has to do with how the checkmark is drawn, it uses a UIBezierPath object to draw the line segments and then rotates to get the desired placement:
if (self.progress == 1.0) { /* First draw a tick that looks like this: A---F | | | E-------D | | B-----------C (Remember: (0,0) is top left) */ UIBezierPath *tickPath = [UIBezierPath bezierPath]; CGFloat tickWidth = radius/3; [tickPath moveToPoint:CGPointMake(0, 0)]; // A [tickPath addLineToPoint:CGPointMake(0, tickWidth * 2)]; // B [tickPath addLineToPoint:CGPointMake(tickWidth * 3, tickWidth * 2)]; // C [tickPath addLineToPoint:CGPointMake(tickWidth * 3, tickWidth)]; // D [tickPath addLineToPoint:CGPointMake(tickWidth, tickWidth)]; // E [tickPath addLineToPoint:CGPointMake(tickWidth, 0)]; // F [tickPath closePath]; // Now rotate it through -45 degrees... [tickPath applyTransform:CGAffineTransformMakeRotation(-M_PI_4)]; // ...and move it into the right place. [tickPath applyTransform:CGAffineTransformMakeTranslation(radius * 0.43, radius)]; ... |
Download Circular Progress View
You can find GSProgressView on github.
