rdurand
rdurand

Reputation: 7410

Circular animation to make UIImageView appear

I have a "circular" image, something like a pie chart. I would like a nice appearing animation, like when a pie chart fills itself from 0 to the value.

I usually use something like this when I want to animate views :

[UIView animateWithDuration: 3.0 
                      delay: 0.0 
                    options: UIViewAnimationCurveEaseInOut 
                 animations: ^ {
                             // The animation
                     } 
                 completion: ^(BOOL finished) {
                             // On completion
                     } ];

Is it possible to do the same thing for a circular animation ? I really have no idea on how to do that.

Thanks for any leads !

Note : iOS 5, storyboards, ARC, and all that stuff :)


Edit : for future discussion, the image looks like this :

enter image description here

Upvotes: 4

Views: 1659

Answers (2)

Fahri Azimov
Fahri Azimov

Reputation: 11770

Okay, here it goes :)

First option (Easy one). You could use UIImageView's animationImages property. Make NSArray with animation images (in your case, circular images those fill from 0 to full circle), set animationDuration, and call [imageView startAnimating] (I'm assuming that your UIImageView is imageView), and you can call [imageView stopAnimating] when process is done.

Second: Check out this link http://www.cocoacontrols.com/platforms/ios/controls/jpradialactivityindicator, I think that sample project does the almost same, as you are trying to do :)

Good Luck ;)

Upvotes: 3

Nayan Chauhan
Nayan Chauhan

Reputation: 542

1) You can use CAShapeLayer

  • You can achieve it by animating the strokeStart and strokeEnd properties. You could create the path for the full circle and use the strokeStart and strokeEnd properties to only stroke a certain part of the circle.

2) Also, you can refer to this tutorial : Animating Pie Slices Using a Custom CALayer

Good Luck!!!

Upvotes: 2

Related Questions