23

I would like to push a view controller using Swift and animate it so it appears from the bottom and moves up. I have the following code to push my view controller:

let helloTableViewController = self.storyboard!.instantiateViewControllerWithIdentifier("helloTableViewController") as! HelloTableViewController
self.navigationController!.pushViewController(helloTableViewController, animated: true)

I have found the following from another question but cannot seem to get it to work in Swift:

CATransition *animation = [CATransition animation]; 
[animation setDuration:2]; 
[animation setType:kCATransitionPush]; 
[animation setSubtype:kCATransitionFromTop]; 
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]]; 
SecondView *sObj=[[SecondView alloc] initWithNibName:@"SecondView" bundle:nil];
[self.navigationController pushViewController:sObj animated:YES];
[[sObj.view layer] addAnimation:animation forKey:@"SwitchToView1"];
2
  • You need to show the translated swift code. Also, what do you mean by "cannot get it to work"? Aside from this, the Objective-C code is quite badly written (it is confusing of them to create a view controller called SecondView), and these days the above transition could more easily (should) be written using the UIView transitionWithView/transitionFromView method.
    – Stuart
    Aug 12, 2015 at 17:16
  • Is there any reason why you can't just present the view controller modally? The modal transition comes up from the bottom.
    – bjtitus
    Aug 12, 2015 at 17:26

6 Answers 6

48

Swift3:

for push :

    // push view controller but animate modally
    let storyBoard: UIStoryboard = UIStoryboard(name: "myStoryBoard", bundle: nil)
    let vc = storyBoard.instantiateViewController(withIdentifier: "myViewControllerIdentifier") as! MyViewController

    let navigationController = self.navigationController


    vc.navigationItem.rightBarButtonItem = UIBarButtonItem(title: "Close", style: .plain, target: vc, action: #selector(vc.closeView))
    vc.navigationItem.leftBarButtonItem = UIBarButtonItem(title: "", style: .plain, target: vc, action: nil)

    let transition = CATransition()
    transition.duration = 0.5
    transition.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaseOut)
    transition.type = kCATransitionMoveIn
    transition.subtype = kCATransitionFromTop
    navigationController?.view.layer.add(transition, forKey: nil)
    navigationController?.pushViewController(vc, animated: false)

and in vc for pop:

func closeView() {
    let transition = CATransition()
    transition.duration = 0.5
    transition.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaseOut)
    transition.type = kCATransitionReveal
    transition.subtype = kCATransitionFromBottom
    navigationController?.view.layer.add(transition, forKey: nil)
    _ = navigationController?.popViewController(animated: false)
}
2
  • 3
    This fades the alpha of the view being transitioned from, meaning I can see underneath it during the transition. Is there a way to prevent this behavior?
    – aufty
    Jan 22, 2019 at 18:51
  • @aufty To prevent that, use UIViewControllerAnimatedTransitioning: stackoverflow.com/a/48081504/3151675 Jun 24, 2019 at 18:55
33

Here is the code for pushing

let transition:CATransition = CATransition()
transition.duration = 0.5
transition.timingFunction = CAMediaTimingFunction(name:CAMediaTimingFunctionName.easeInEaseOut)
transition.type = CATransitionType.push
transition.subtype = CATransitionSubtype.fromBottom
self.hostNavController?.view.layer.add(transition, forKey: kCATransition)
self.hostNavController?.popViewController(animated: true)

and type of transition you can use are

kCATransitionFromLeft
kCATransitionFromBottom
kCATransitionFromRight
kCATransitionFromTop
2
  • 1
    How can we do similar animation using segues?
    – Satyam
    Jul 24, 2017 at 10:29
  • I think using segue it is not possible. I think method swizzling can help you on that
    – Nex Mishra
    Aug 6, 2017 at 10:42
9

Updated with Swift 5 and Xcode 11.4

Controller push in present animation style

    let storyBoard: UIStoryboard = UIStoryboard(name: "Main", bundle: nil)
    let viewController = storyBoard.instantiateViewController(withIdentifier: "ViewController") as! ViewController

    let transition = CATransition()
    transition.duration = 0.5
    transition.timingFunction = CAMediaTimingFunction(name: CAMediaTimingFunctionName.easeInEaseOut)
    transition.type = CATransitionType.moveIn
    transition.subtype = CATransitionSubtype.fromTop
    self.navigationController?.view.layer.add(transition, forKey: nil)
    self.navigationController?.pushViewController(viewController, animated: false)

PopToView Controller in Dismiss Style

            let transition:CATransition = CATransition()
        transition.duration = 0.5
        transition.timingFunction = CAMediaTimingFunction(name:CAMediaTimingFunctionName.easeInEaseOut)
        transition.type = CATransitionType.reveal
        transition.subtype = CATransitionSubtype.fromBottom
        self.navigationController?.view.layer.add(transition, forKey: kCATransition)
        self.navigationController?.popViewController(animated: false)
0
5

I had a similar situation where I needed to show a navigation item with some UIBarButtonItems on a view controller, but when presenting modally, it wasn't showing up. It was showing only when pushing from a navigationController, but I really needed the animation from bottom -> up. I tried the CATransition examples from above, but it brought up another bug where there was like a black shadow / translucent background during the animation. I came up with a pretty simple solution in the end:

let someVC = storyboard?.instantiateViewController(withIdentifier: "SomeVC") as! SomeVC
let navController = UINavigationController(rootViewController: someVC)
navigationController?.present(navController, animated: true, completion: nil)

And to close the view controller and get rid of the navigation controller altogether, you just call:

self.dismiss(animated: true, completion: nil)

This will dismiss the view controller, and will release our navigationController from memory.

It is a simple solution in the end, but I spent some time until coming up with it. Maybe I'll save someone else's time :)

2
  • Thank you, this did save my time! The animation I found above (and in other answers) moves the current view controller as it places another one; this one pushes a controller on top of the existing, which is what I was looking for.
    – Pedro
    Jul 30, 2019 at 20:01
  • I am glad this one helped someone already)) Good luck and happy coding!
    – Starsky
    Jul 31, 2019 at 7:48
5

Swift 5.0 And Later

  let transition:CATransition = CATransition()
  transition.duration = 0.5
  transition.timingFunction = CAMediaTimingFunction(name: CAMediaTimingFunctionName.easeInEaseOut)
  transition.type = CATransitionType.push
  transition.subtype = CATransitionSubtype.fromTop
  self.navigationController!.view.layer.add(transition, forKey: kCATransition)
3

Swift 4.2+ solution based on Nex Mishra's answer:

let transition = CATransition()
transition.duration = 0.5
transition.timingFunction = CAMediaTimingFunction(name: .easeInEaseOut)
transition.type = .push
transition.subtype = .fromBottom
navigationController?.view.layer.add(transition, forKey: kCATransition) 
navigationController?.pushViewController([destination VC], animated: false)

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.