How to handle multiple layer of modal in SwiftUI?

[mackoj (Jeffrey Macko)]

Hi everyone,

How can we have multiple layer of modal in SwiftUI like what we can do in UIKit.

I did tried multiple approach like these without success.

SwiftUI don't process more that one .sheet modifier on a view.

Has anyone have any idea how to do this ?

Thanks,

Code

import UIKit
import PlaygroundSupport

extension UIColor {
    class func randomColor(randomAlpha: Bool = false) -> UIColor {
        let redValue = CGFloat(arc4random_uniform(255)) / 255.0;
        let greenValue = CGFloat(arc4random_uniform(255)) / 255.0;
        let blueValue = CGFloat(arc4random_uniform(255)) / 255.0;
        let alphaValue = randomAlpha ? CGFloat(arc4random_uniform(255)) / 255.0 : 1;

        return UIColor(red: redValue, green: greenValue, blue: blueValue, alpha: alphaValue)
    }
}

class ModalViewController: UIViewController {
  
  override func viewDidLoad() {
    super.viewDidLoad()
    self.view.backgroundColor = UIColor.randomColor()
    
    let button = UIButton()
    button.backgroundColor = .clear
    button.setTitle("Open", for: .normal)
    button.setTitleColor(self.view.tintColor, for: .normal)
    button.addTarget(self, action: #selector(presentModal(_:)), for: .touchUpInside)
    button.sizeToFit()
    button.center = self.view.center
    self.view.addSubview(button)
  }
  
  @IBAction func presentModal(_ sender: UIButton) {
    let presentee = ModalViewController(nibName: nil, bundle: nil)
    self.modalPresentationStyle = .overCurrentContext
    self.modalTransitionStyle = .flipHorizontal
    self.modalPresentationCapturesStatusBarAppearance = true
    self.present(presentee, animated: true, completion: nil)
  }
}

class ViewController: UIViewController {

  override func viewDidLoad() {
    super.viewDidLoad()
    let button = UIButton()
    button.backgroundColor = .clear
    button.setTitle("Open", for: .normal)
    button.setTitleColor(self.view.tintColor, for: .normal)
    button.addTarget(self, action: #selector(presentModal(_:)), for: .touchUpInside)
    button.sizeToFit()
    button.center = self.view.center
    self.view.addSubview(button)
 }

  @IBAction func presentModal(_ sender: UIButton) {
    let presentee = ModalViewController(nibName: nil, bundle: nil)
    self.modalPresentationStyle = .overCurrentContext
    self.modalTransitionStyle = .flipHorizontal
    self.modalPresentationCapturesStatusBarAppearance = true
    self.present(presentee, animated: true, completion: nil)
  }
}

// Present the view controller in the Live View window
PlaygroundPage.current.liveView = ViewController()

[sveinhal (Svein Halvor Halvorsen)]

This should work:

struct ModalView: View {
    @State private var showModal = false
    @State private var backgroundColor = UIColor.randomColor()

    var body: some View {
        Button("Open", action: { showModal = true })
            .frame(maxWidth: .infinity, maxHeight: .infinity, alignment: .center)
            .background(Color(backgroundColor))
            .ignoresSafeArea()
            .sheet(isPresented: $showModal) { ModalView() }
    }
}

[mackoj (Jeffrey Macko)]

Thanks @sveinhal it's working