A custom UIViewController Transition with animations

Here is a good example of neat looking custom, animated transition in iOS 7 that allows us to animate specific objects from one view to transition into the next view. It took me a little bit to find the best way to do this, but it isn’t too tough!

@implementation HomeController // In a storyboard-based application, you will often want to do a little preparation before navigation - (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender { if([segue.identifier isEqualToString:@"search"]) { //set the delegate for the navigation controller so that we will perform our custom animation UIViewController *fromVC = [segue sourceViewController]; UINavigationController *navVC = [fromVC navigationController]; navVC.delegate = self; } } #pragma mark animation methods // Report who is in charge of the animation - (id<UIViewControllerAnimatedTransitioning>)navigationController:(UINavigationController *)navigationController animationControllerForOperation:(UINavigationControllerOperation)operation fromViewController:(UIViewController *)fromVC toViewController:(UIViewController *)toVC { return self; } - (NSTimeInterval)transitionDuration:(id<UIViewControllerContextTransitioning>)transitionContext { return .5; } - (void)animateTransition:(id<UIViewControllerContextTransitioning>)transitionContext { //get the container view that will hold the transition UIView *container = transitionContext.containerView; //get the view we are going to and take a snapshot of it and add it to the view as invisible UIViewController *toVC = [transitionContext viewControllerForKey:UITransitionContextToViewControllerKey]; UIView *toView = toVC.view; UIView *snapshot = [toView snapshotViewAfterScreenUpdates:YES]; snapshot.alpha = 0.0f; container.backgroundColor = [UIColor whiteColor]; [container addSubview:snapshot]; //add the text box we are going to animate UIView * moveView = [self.searchView snapshotViewAfterScreenUpdates:NO]; [container addSubview:moveView]; moveView.frame = self.searchView.frame; //fade out the current view [UIView animateWithDuration:.2 animations:^{ self.view.alpha = 0.0f; } completion:^(BOOL finished) { }]; //move the search bar up to the top, fading it out and fade the new view in [UIView animateWithDuration:.5 animations:^{ moveView.frame = CGRectMake(moveView.frame.origin.x,0, moveView.frame.size.width, moveView.frame.size.height); moveView.alpha = 0.0f; }]; //fade the next VCs view in and reset after completion. //add the transition view to our resulting container and complete the transition //also clear the nav delegate so we won't use this to transition any more. [UIView animateWithDuration:.25 delay:0.25f options:0 animations:^{ snapshot.alpha = 1.0f; } completion:^(BOOL finished) { [snapshot removeFromSuperview]; toVC.navigationController.delegate = nil; [transitionContext completeTransition:YES]; [container addSubview:toView]; self.view.alpha = 1.0f; }]; }



This site uses Akismet to reduce spam. Learn how your comment data is processed.