Customising the transition of views within a UINavigationController

I recently had a use case where I needed to customise the transition animation which was used when I pushed a view onto a UINavigationController stack.

I came across this excellent article, which described a way of doing this using the CALayer of the UINavigationControllers view:

Armed with this technique, I created my own subclass of UINavigationController, and used the following code when I pushed a new view onto the stack:

CATransition* transition = [CATransition animation];
transition.duration = 0.4f;
transition.type = kCATransitionReveal;
transition.subtype = kCATransitionFromTop;
[self.view.layer addAnimation:transition forKey:kCATransition];
UIViewController *viewController = // create your view controller here
[self pushViewController:viewController animated:NO];
[self.view.layer addAnimation:nil forKey:kCATransition];

In the code above, I set up the custom transition I want to use for displaying the new view (in this case, basically the same as the default transition, but in a different direction), and then push the new view onto the stack.  Notice that we don’t animate the push operation – this is handled by the animation we set on the layer.  After we’re done, I clear the custom animation from the view layer.


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s