Kodeco Forums

Custom UIViewController Transitions: Getting Started

This tutorial will teach you to create custom UIViewController transitions for presenting and dismissing, and how to make them interactive!


This is a companion discussion topic for the original entry at https://www.raywenderlich.com/322-custom-uiviewcontroller-transitions-getting-started

Hi rcritz: I delete the code :“AnimationHelper.perspectiveTransform(for: containerView)” and works fine.
What is this line mean ,I wonder its function.:rofl:

Hi! As I said in the note in the tutorial, you can absolutely comment out that line. The transition will work but will now appear flat instead of having perspective that causes the top and bottom edges of the rotation view to point towards the center of the screen instead of being parallel.

Thanks for your reply!!! An other Question:
In the dismissal process, the fromVC is RevealViewController,and toVC is CardViewController.When we finish transition, the CardViewController should on top of the RevealViewController,so why should we use “containerView.insertSubview(toVC.view, at: 0)” this code let the RevealViewController’s view is on top of the CardViewController’s view . Is there any problem?

I use “addSubView” here, and the transition works fine too.

Remember that this is a dismissing transition —the equivalent of a pop. The “to” view must be under the “from” view as the from view goes away. If it isn’t and you cancel the transition, you can leave the app in a state where the RevealViewController cannot be dismissed. You won’t see that with this particular animation but, for example, change the animation to be a resize or a fade out and you will definitely see the problem if you just use addSubView().

Thanks rcritz,u are so kind and excellent!

Hi. This is really nice tutorial even i’ve seen!
But there’s one proplem in this session.
When i release touch gesture to back to the RevealViewController( when the code cancel() execute),
there’s no any animation for back to the RevealViewController. So it looks weird.

How could i solve this problem??

@rcritz Do you have any feedback regarding this? Thank you - much appreciated! :]

Hi @d.flamingo! When an interactive transition is canceled, iOS reverses the animation that it has done to that point. There is animation there. Are you testing on the simulator or on a real device. Sometimes the simulator doesn’t show the animation very well. You can use the Debug\Slow Animations menu option in the simulator to make them more obvious.

Hope that helps.
-r

how does one put a background image or even just a color to the background? So its not just black on transitioning.

Update: I figured it out.
solution:

if let w = window {
    w.addSubview(bg)
    NSLayoutConstraint.activate(bg.getConstraintsTo(view: w))
}

another update: getConstraintsTo is a method I use to get constraints thne activate them quickly
code:

func getConstraintsTo(view: UIView, withInsets:UIEdgeInsets = .zero) -> [NSLayoutConstraint] {
    return [
        self.leftAnchor.constraint(equalTo: view.leftAnchor, constant: withInsets.left),
        self.rightAnchor.constraint(equalTo: view.rightAnchor, constant: -1*(withInsets.right)),
        self.topAnchor.constraint(equalTo: view.topAnchor, constant: withInsets.top),
        self.bottomAnchor.constraint(equalTo: view.bottomAnchor, constant: -1*(withInsets.bottom
            ))
    ]
}

If I understand your question correctly, you could also just set the backgroundColor property on the containerView in the transition method.

Hello,

The presenting and dismissing work well. There is a little issue related to the interaction animation, if stop() / finish() be called, the remain animation jumps with very strange state.

  • If stoped at progress for example about 30%, the snapshot will be shortly maximum size, then back to normal size
  • if continue to finish at more than 50% progress, you will find the animation does very strangely.

Would you please help to check it and suggest the solution?

This tutorial is more than six months old so questions are no longer supported at the moment for it. Thank you!