iPhone How to get photo taken effect like in camera application?

Question

I am talking about that effect when user presses button to take photo, it shrinks and moves to toolbar? How is this achieved in general?

Answer 1

so the shrink animation is achived by

 [UIView beginAnimations:@"animationShrink" context:NULL];
    [UIView setAnimationDuration:kSlideInAnimationDuration];

    flipFlopContainer.transform = CGAffineTransformMakeScale(0.01, 0.01);
    [UIView setAnimationDelegate:self];
    [UIView    setAnimationDidStopSelector:@selector(shrinkAnimationFinished:)];
    [UIView commitAnimations];

after this animation in shrinkAnimationFinished method you need to define a path to follow and change the position of your view accroding to that path.

See the following thread for that animation

Resize and move a UIView with Core Animation (CAKeyFrameAnimation)

Answer 2

You can create this by both scaling (applying a transform) and moving (animating the position) of the image.

I wrote about a similar animation (the Open in Background animation from Safari on iPhone) in this blog post. Not all of the code is necessary but some part of it will be useful for the animation you are trying to do.

---

You should

• Calculate the scale factor to make the image the appropriate size
• Calculate the path you want to animate the image along.
• Animate a scale with the calculated scale factor
• Animate a position animation along the path (using a CAKeyframeAnimation)

Since you are doing two animations at once you could benefit from using a CAAnimationGroup.

Since you are animating down to a toolbar which probably is another part of the view hierarchy than where the image is you may need to use method like

- (CGRect)convertRect:(CGRect)rect toView:(UIView *)view

and

- (CGPoint)convertPoint:(CGPoint)point toView:(UIView *)view 

To translate coordinates between the different views.