Push Up View Controller from Bottom using Swift

Question

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"];

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 '15 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 '15 at 17:26

score 48 · Answer 1 · answered May 10 '17 at 19:44

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)
}

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 '19 at 18:51
@aufty To prevent that, use `UIViewControllerAnimatedTransitioning`: https://stackoverflow.com/a/48081504/3151675 — Tamás Sengel, Jun 24 '19 at 18:55

score 33 · Accepted Answer · edited Apr 08 '20 at 20:51

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

edited Apr 08 '20 at 20:51

philipp

4,133
1
36
35

answered May 13 '16 at 23:10

Nex Mishra

774
7
13

1

How can we do similar animation using segues? – Satyam Jul 24 '17 at 10:29
I think using segue it is not possible. I think method swizzling can help you on that – Nex Mishra Aug 06 '17 at 10:42

Jogendra.Com · Answer 3 · 2020-04-30T05:06:13.733

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)

score 5 · Answer 4 · answered Jul 30 '19 at 13:46

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 :)

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 '19 at 20:01
I am glad this one helped someone already)) Good luck and happy coding! — Starsky, Jul 31 '19 at 07:48

score 5 · Answer 5 · edited Jun 20 '20 at 09:12

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)

edited Jun 20 '20 at 09:12

Community

1
1

answered Oct 30 '19 at 11:17

Hitesh Surani

12,733
6
54
65

score 3 · Answer 6 · answered Jun 15 '19 at 21:42

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)

Push Up View Controller from Bottom using Swift

6 Answers6

Updated with Swift 5 and Xcode 11.4

PopToView Controller in Dismiss Style

Swift 5.0 And Later

Linked