Scaling a UIView during transitionFromView?

Question

I'm using a container UIView to replicate the kind of behavior the iTunes store does when you tap on album artwork and it flips and scales.

Current code looks like:

//mainView is 300x300x, smallView is 30x30      

[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:2.0];
[UIView transitionFromView:mainView toView:smallView duration:3.0 options:UIViewAnimationOptionTransitionFlipFromLeft completion:nil];

containerView.frame = CGRectMake(275, 415, 30, 30);

[UIView commitAnimations];  

I can't seem to get the content of the containerView to scale during the animation, the frame just closes in on the content. I tried applying some transforms to both the view and the layers and a bunch of other things but I can't seem to get it to behave properly.

Answer 1

Try it this way:

[UIView transitionWithView:mainView
           duration:0.2
           options:UIViewAnimationOptionTransitionFlipFromLeft
           animations:^{ 
              containerView.frame = CGRectMake(275, 415, 30, 30)
            }
           completion:NULL];

Answer 2

Rather than setting the frame, try using a transform instead:

- (void)setStartTransform:(CGAffineTransform)transform;
- (void)setEndTransform:(CGAffineTransform)transform;

Something like

[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:2.0];
[UIView transitionFromView:mainView toView:smallView duration:3.0 options:UIViewAnimationOptionTransitionFlipFromLeft completion:nil];

//containerView.frame = CGRectMake(275, 415, 30, 30);

[containerView setStartTransform: CGAffineTransformIdentity];
[containerView setEndTransform: CGAffineTransformMakeScale(0.1, 0.1)];

[UIView commitAnimations];  

(You might need to apply a translate to the transform too.)