Search code examples
iphoneviewcore-animationtransition

how to implement an iPhone view transition animation with both flipping and scaling?


how can I implement the animation we see in the iPhone Music app's coverflow screen? when you click on a small view, it flips and scales up to another view? how can I do this? I can use core animation to flip and scale a view, but how can I do the transition to another view? thanks


Solution

  • You need an UIView as Container for the two UIViews (frontside/backside) and then remove/add these from/to the container as subviews while doing the animations in between:

    UIView *flipContainer;
    UIView *frontSide;
    UIView *backSide;
      //...
    -(void)turnUp
    {
      [backSide removeFromSuperview];
      [UIView beginAnimations:nil context:NULL];
      [UIView setAnimationDuration:1.0];
      [UIView setAnimationTransition:UIViewAnimationTransitionFlipFromLeft forView:flipContainer cache:YES];
      [UIView setAnimationDuration:1.0];
      CGAffineTransform transform = CGAffineTransformMakeScale(1.2, 1.2);
      flipContainer.transform = transform;
      [UIView commitAnimations];
      [flipContainer addSubview:frontSide];
    }
    -(void)turnDown
    {
      [frontSide removeFromSuperview];
      [UIView beginAnimations:nil context:NULL];
      [UIView setAnimationDuration:1.0];
      [UIView setAnimationTransition:UIViewAnimationTransitionFlipFromRight forView:flipContainer cache:YES];
      [UIView setAnimationDuration:1.0];
      CGAffineTransform transform = CGAffineTransformMakeScale(1, 1);
      flipContainer.transform = transform;
      [UIView commitAnimations];
      [flipContainer addSubview:backSide];
    }