MPFlipTransition – add flip transitions to your app


I’ve added flip transitions to my MPFoldTransition project on GitHub. It provides a class you can use to add a page-flipping transition to your application in just a single line of code (in most cases).

Update: For a touch gesture-enabled container controller with page-flipping (not just a transition), see MPFlipViewController.

Features

There are 3 style bits that can be combined to create 8 different animations.

Direction


Controls whether the page flips from right to left (Forward) or left to right (Backward).

Orientation


Sets whether the page flip is horizontal or vertical.

Perspective


Determines whether the page flips towards the user (Normal) or away from the user (Reverse).

Present a modal view controller

There are extension methods to UIViewController to present or dismiss modal view controllers using flip transitions:

- (void)presentViewController:(UIViewController *)viewControllerToPresent
                    flipStyle:(MPFlipStyle)style 
                   completion:(void (^)(BOOL finished))completion;

- (void)dismissViewControllerWithFlipStyle:(MPFlipStyle)style 
                                completion:(void (^)(BOOL finished))completion;

From your UIViewController subclass you would call this to present your modal view controller:

[self presentViewController:modalViewController
                  flipStyle:MPFlipStyleDefault 
                 completion:nil];

And then call this to dismiss it:

[self dismissViewControllerWithFlipStyle:MPFlipStyleDirectionBackward 
                              completion:nil];

Tip: dismiss your modal controller using a style with the opposite direction bit (Forward or Backward), so that you get the reverse animation.

Push a view controller onto a navigation stack

There are extension methods to UINavigationController to push or pop a view controller using flip transitions:

- (void)pushViewController:(UIViewController *)viewController
                 flipStyle:(MPFlipStyle)style;

- (UIViewController *)popViewControllerWithFlipStyle:
    (MPFlipStyle)style;

From your UIViewController subclass you would call this to push a new view controller onto the stack:

[self.navigationController pushViewController:detailViewController
                                    flipStyle:MPFlipStyleDefault];

And then call this to pop it back off:

[self.navigationController popViewControllerWithFlipStyle:MPFlipStyleDirectionBackward];

Tip: pop your view controller using a style with the opposite direction bit (Forward or Backward) from the style used to push it onto the stack, so that you get the reverse animation.

Transition between any 2 views or controllers

MPFlipTransition has class methods for generic view and view controller transitions:

+ (void)transitionFromViewController:(UIViewController *)fromController
                    toViewController:(UIViewController *)toController
                            duration:(NSTimeInterval)duration
                               style:(MPFlipStyle)style
                          completion:(void (^)(BOOL finished))completion;

+ (void)transitionFromView:(UIView *)fromView
                   toView:(UIView *)toView
                 duration:(NSTimeInterval)duration
                    style:(MPFlipStyle)style
         transitionAction:(MPTransitionAction)action
               completion:(void (^)(BOOL finished))completion;

If you really need to get under the hood (e.g. to adjust the timing curve, shadow effects, or skew), you can initialize your own instance of MPFlipTransition, set the properties as desired, and then call the perform: method to execute the transition.

Storyboard support

You can even incorporate modal or navigation stack flip segues without writing a single line of code! Simply use 1 of the 3 custom UIStoryboardSegue subclasses that are included. These cover modal presentation and push/pop to a navigation stack. Just create a segue between 2 controllers in your storyboard, select Custom as the segue type, then enter MPFlipModalSegue, MPFlipNavPushSegue, or MPFlipNavPopSegue as the Segue Class.

Demo project

The GitHub project includes a sample project that demonstrates the use of all the different API’s as well as all of the transition styles.

iOS version

iOS 5-only because I wrote it with ARC and included storyboard support.

Author: Mark

Mark is an American computer programmer living in Switzerland.