Search code examples
iosswiftuiactionsheet

How to display an UIView above NavigationController and UITabbar?


I am trying to create a custom Actionsheet controller (as I want it to be similar to action sheet even on the iPad). I am using XIB's in my project to load views.

I have a View Controller A on which I want to show a custom Table view from bottom (Just to mimic the actionSheet behavior). But when I do so by adding it to custom View in my View Controller A, the view stays below the NavigationController and UITababar of the that View controller.

    let vc = CustomActionTableViewController(nibName: "CustomActionTableViewController", bundle: nil)
    self.addChildViewController(vc)
    self.actionView.addSubview(vc.view)
    vc.didMove(toParentViewController: self)
    let horzConstraints = NSLayoutConstraint.constraints(withVisualFormat: "H:|[childView]|", options: [], metrics: nil, views: ["childView": vc.view])

    let vertConstraints = NSLayoutConstraint.constraints(withVisualFormat: "V:|[childView]|", options: [], metrics: nil, views: ["childView": vc.view])

    view.addConstraints(horzConstraints)
    view.addConstraints(vertConstraints)
    vc.view.translatesAutoresizingMaskIntoConstraints = false

This is my implementation

I want to add this to a view so that I can achieve transparent background even over Navigation controller and UITabbar.

Something like this

How can I achieve this. And further more how is it possible to create Card like bottom views used for AirPods connectivity ? Can this kind of view be mimicked using Apple's UIKit or any Library ?enter image description here


Solution

  • You should present this ViewController with modalPresentationStyle as .overFullScreen

    let vc = CustomActionTableViewController(nibName: "CustomActionTableViewController", bundle: nil)
    vc.modalPresentationStyle = .overFullScreen
    self.present(vc, animated: true, completion: nil)
    

    You can set the background color of CustomActionTableViewController's view as black and change alpha value to set the transparency.