skip to Main Content
UIPresentationController Tutorial Using Swift

Custom presentations using UIPresentationController in Swift

Post Series: Custom UIViewController Transitions

With iOS 8 a lot of awesome stuff came to our hands, like this awesomeness that I’m going to show you today, the UIPresentationController. Sadly it’s only available from iOS 8 on, but in couple of months every iPhone user will switch to the latest operating system, so every developer can bump up their apps’ minimum OS version.

 

What is UIPresentationController?

As Apple states: “A UIPresentationController object provides advanced view and transition management for presented view controllers.” 

So it is an awesome object that let us developers go beyond the normal UIViewControllerAnimatedTransitioning, and create even more creative presentations. I recently used it to display a “slide in” detail view inside another viewController to display various data (top secret until now). I tried to do it with the animated transitioning way, but when I rotated the iPad I had some problems, since I wanted to have the background viewController (which was still visible) live and react to my interactions.


UIPresentationController tutorial by Zappdesigntemplates

How does it work?

To make UIPresentationController presentation work, you need quite a bit of work, but don’t worry it’s not that hard as it seems for the first look.

First you’ll need some objects, I like to use separate objects for each job, for managing, presenting, dismissing etc.

  1. You’ll need first a manager object, that will be the transitioningDelegate object of the presented viewController, will load our UIPresentationController object and manage which object should handle the presentation and dismissal of the viewControllers.
  2. Than you need a subclass of UIPresentationController object and customise a lot of its methods to create your custom presentation. You can customise things like, size, what should happen when the layout changes etc.
  3. Presentation animator object, that conform the UIViewControllerAnimatedTransitioning protocol and handles the presentation of the viewController
  4. Dismissal Animator object, that conform the UIViewControllerAnimatedTransitioning protocol and handles the dismissal of the viewController

Now we have this, let’s look at them one by one.

1. The presentation manager

It only has 3 methods, each one is to create a new instance of the other 3 objects. So this class is our base, hence the name manager.

As you can see, in the first method, we initialise the UIPresentationController subclass with the presented and source viewControllers. Than provide our presentation and dismissal animator objects.

2. UIPresentationController subclass

Now this is gonna be tough. But can be understood pretty quickly. Let’s look at its methods one-by-one.

Initialiser method. Nothing to say here, a method to initialise the object and set up a dimming view in our case (can be taken out of course).

 

Setting up a simple dimming view with a blurred background, and adding a tap recogniser to dismiss the view when the dimming view is tapped.

 

Notifies the presentation controller that the presentation animations are about to start. We can adjust our views and get ready for the presentation.

 

Notifies the presentation controller that the dismissal animations are about to start. We just set our dimming view’s alpha value to be 0.0 to make it disappear.

 

Notifies the presentation controller that layout is about to begin on the views of the container view. We just adjust the frames of our views, so we have the right frames, no matter what device size we are using.

 

This method specifies what size should the child (the viewController that we are presenting) have.

 

The frame rectangle to assign to the presented view at the end of the animations.

In our case we wanted the view to be in the center of the screen and be 20 points from the left side of the screen (.origin.x = 20) and 40 points from the top (.origin.y = 40)


Presenting and dismissing the detail view

Now after we setup our UIPresentationController methods, we are just ready to create our custom animations, how we want to display our detail viewController. No we are just using a simple transform method to present our viewController.

What we are doing is pretty straight forward. We start with a transform 0.1 value and increase it to Identity (which means to the original value 1.0) in the animation block and add a little shadow to the view, since it acts like a popup.

Dismiss the view

Since we displayed it, we need a way to dismiss it.

Here we do the opposite, decrease the alpha value to 0.0 and make the viewController small by making a transform call to 0.1.


This is it guys. Now this is just one way of using the UIPresentationController object’s capabilities, but you can also use it for:

  • create a slide-in navigation
  • custom popovers
  • custom alertViews
  • custom input views
  • and a lot more

  • Comment Guy

    Question: Is the transitioningDelegate object an object of the presenting view controller or the presented view controller? You say its an object of the presenting view controller but it appears to be a property of the presented view controller

    • Sorry, my mistake. It is always the property of the presented viewController, doesn’t matter if it’s a UIPresentationController or UIViewController animation. Thanks for noticing. 🙂

      • Comment Guy

        Thanks for the quick response. Great tutorial. Learning a ton.

        • No worries. Glad you like it. 🙂

  • Pingback: How to Push a clear or alpha UIViewCotroller - DexPage()

  • Hero on socks

    Great tutorial, tx! One question: If u have more then one UIPresentationController to present in your app, would u then handle these from the 4 objects u describe here? Or would u make the 4 described objects for every UIPresentationController?

    • Glad you like it. Well you could combine the Dismiss animator and the presentation animator objects into a single one, and manage the present and dismiss with a boolean (isPresenting) and act accordingly. So you would save 1 file.
      But yes I would create separate classes for every case, unless I can find a pattern to reuse them in some way, without repeating the same code (cause that would be stupid). 🙂 Dependind on your implementation and needs.

      • Hero on socks

        Ok tx for the clear response! Makes sense. At the moment I am trying to present one ViewController (A) modally and when I dismiss this ViewController I want to immediately present a second ViewController modally (the second viewcontroller will be ViewController B or C, depending on user input). For this, I then will need to create 3 x 4 = 12 separate classes. Hence my question :).

        • Well you could just wrap all your viewControllers into a navigationController and push the new view on top of the current one after you dismissed it (actually you don’t dismiss it, just add a new viewController to the navigation stack).
          But instead of using the default push&pop animation of the UINavigationController, just create your animator objects to do the job. This way you won’t have any issues with dismissing than presenting viewControllers (could be a weird UX). For more help, just contact us directly. 😉

          • Hero on socks

            Tx for the quick response and the explanation! I will try to accomplish that. If I dont succeed, I will contact u directly. Great 🙂

  • GeRyCh

    Thank you for your superb tutorial! It saved me a lot of time.
    I set background color of presented view controller to clearColor, so dimmableView will be visible to user. But tap gesture event to dissmiss it doesn’t fire 🙁 Is it because presented viewController takes all touch events? Thnx