Apple Maps style menu popup

Question

I'd like to create a view similar to the maps settings menu and the apple pay menu. I tried to make a segue that came from the bottom but couldn't find how to make it smaller than the full screen.

Example:

Does this answer your question? [How can I mimic the bottom sheet from the Maps app?](https://stackoverflow.com/questions/37967555/how-can-i-mimic-the-bottom-sheet-from-the-maps-app) — John Montgomery, Feb 20 '20 at 23:17

score 1 · Answer 1 · answered Nov 26 '16 at 23:58

I ended up creating an xib file (just called "view") and setting the background to transparent. I then added the file to my ViewController and animated it from the bottom when I needed it (all from ViewController.swift)

This was linked to the button to show the menu in the main view controller's file

@IBAction func showSettings() {
    let settingsViewVC = SettingsMenuController()

    self.addChildViewController(settingsViewVC)
    self.view.addSubview(settingsViewVC.view)
    settingsViewVC.didMove(toParentViewController: self)

    let height = view.frame.height
    let width  = view.frame.width
    settingsViewVC.view.frame = CGRect(x: 0, y: self.view.frame.maxY, width: width, height: height)

}

This was linked to a button that covers the top area of the screen to close the view when you tap off of it

@IBAction func exit() {
    UIView.animate(withDuration: 0.6, animations: { [weak self] in
        let frame = self?.view.frame
        self?.view.frame = CGRect(x: 0, y: frame!.maxY, width: frame!.width, height: frame!.height)
    })
}

I am sure there are better ways to do this with storyboards, but this works

Pretty close to my answer, just instead of view controller you used view. Glad you made something you wanted. — Miknash, Nov 27 '16 at 11:49

score 0 · Answer 2 · answered Nov 26 '16 at 18:05

Easiest way to produce something like this is following:

Create UIViewController with desired components.
Setup constraints as you wish
Set backgroundColor as transparent ( or opacity if you wish darkened background on parent ) for topmost view in view controller
Present view controller

This way you will be able to show your controls with visible parent view controller - depends on your opacitiy it could be 1-1 visiblity or little bit shadow over it. Also you will have full control over componenets so cornerRadius shown in the picture won't be problem.

I would add tap gesture as well on the topmost view so you can dismiss it that way.

Apple Maps style menu popup

2 Answers2