iOS comes with a bunch of animations that can help turn a plain app into an app that feels high quality and polished with just a few lines.
During this tutorial I will attempt to show how to transition from one view to another using a page-turn style animation (similar to where you look at your settings in the ‘maps’ application).
First step is to set up your animation options:
//Make up a name for your animation, in this case 'View Flip' [UIView beginAnimations:@"View Flip" context:nil]; //Duration is how long your animation will last for. 1 second is plenty enough, //any more we risk creating a feeling of a laggy app [UIView setAnimationDuration:1.0]; //UIViewAnimationCurveEaseOut menas that it will start slow, speed up, then slow down at the end. //Other options are EaseIn, EaseOut, or Linear. [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut]; //Set the transition type. Other options include curl down, or flip left/right amongst others. [UIView setAnimationTransition:UIViewAnimationTransitionCurlUp forView:self.tabBarController.view cache:YES]; |
This animation is based around transitioning between views on a tab bar controller. I don’t advocate animating between views on a tab bar controller, I will explain in another blog post why it was I had to do this. In your case, you would probably replace ‘self.tabCarController.view’ with your view.
The next step is to get a handle on your from and to controllers, i.e. the controller you are on and the controller you are transitioning to.
UIViewController *oldVC = [self.tabBarController.viewControllers objectAtIndex:0]; UIViewController *newVC = [self.tabBarController.viewControllers objectAtIndex:1]; |
For the sake of simplicity, here we are demonstrating animating from tab item 1 to tab item 2.
Now we need to manually call the view transitions (in order):
[newVC viewWillAppear:YES]; [oldVC viewWillDisappear:YES]; [oldVC viewDidDisappear:YES]; [newVC viewDidAppear:YES]; |
Lastly, commit our animations and let the parent navigation controller know that we have changed tabs.
[UIView commitAnimations]; self.tabBarController.selectedIndex = index; |
So there we have it!