Maintain custom UIView that is added to KeyWindow

Question

I am working on a sync feature for my app.

What I want to achieve is to display a custom UIView that will serve as an indicator to the user, wherever screen the user at (such as navigate to dashboard, settings, profile page, etc), that the synchronization is in progress. In short term, it will stick to a position within the app statically.

After done some researches from the web, I come to a conclusion to use keyWindow and add a subview to it.

Here is my code

override func viewDidAppear(_ animated: Bool) {
    super.viewDidAppear(animated)

    if let window = UIApplication.shared.keyWindow {
        window.windowLevel = .statusBar

        let uiView = UIView()
        uiView.backgroundColor = .green

        window.addSubview(uiView)

        uiView.translatesAutoresizingMaskIntoConstraints = false
        NSLayoutConstraint.activate([
            uiView.heightAnchor.constraint(equalToConstant: 150),
            uiView.leadingAnchor.constraint(equalTo: view.leadingAnchor, constant: 25),
            uiView.topAnchor.constraint(equalTo: view.topAnchor, constant: 150),
            uiView.widthAnchor.constraint(equalTo: view.widthAnchor, multiplier: 0.4)
        ])
    }
}

Above code is working fine, I can attach a custom view to the keyWindow. However, when the user navigate to another screen, the added customView will dissappear, and only show when the user goes back to the previous screen.

Can someone guide on what part I am missing? On which part I did wrong?

Thanks

It depends on how you want user interaction to work. I would first try by adding another window; same as making a custom alert view. Or a more simple approach that MIGHT just work for you is changing the Z order of your custom view by manipulating it's layer.zPosition. — Matic Oblak
hi @MaticOblak, Thanks for your reply. Do you mind to give some insight on how to add another window? I am not really sure what that is. Thanks.. :) — Alvin

Matic Oblak Matic Oblak · Accepted Answer · 2019-08-30T09:08:31

As per comments I am adding a minimum requirement to create a new window which will can now always be on top of your view controller or even other windows:

class OverlayViewController: UIViewController {

    private var myWindow: UIWindow? // Our own window needs to be retained

    override func viewDidLoad() {
        super.viewDidLoad()
        view.backgroundColor = UIColor.black.withAlphaComponent(0.3)
        view.addSubview({
            let label = UILabel(frame: .zero)
            label.text = "This is an overlay."
            label.sizeToFit()
            label.center = CGPoint(x: view.bounds.midX, y: view.bounds.midY)
            return label
        }())

        view.addGestureRecognizer(UITapGestureRecognizer(target: self, action: #selector(onTap)))
    }

    @objc private func onTap() {
        myWindow?.isHidden = true
        myWindow?.removeFromSuperview()
        myWindow = nil
    }    

    static func showInNewWindow() {
        let window = UIWindow(frame: UIScreen.main.bounds)
//        window.windowLevel = .alert
//        window.isUserInteractionEnabled = false
        window.rootViewController = {
            let controller = OverlayViewController() // OR UIStoryboard(name: "<#FileName#>", bundle: nil).instantiateViewController(withIdentifier: "<#Storyboard Identifier#>")
            controller.myWindow = window
            return controller
        }()

        window.makeKeyAndVisible()
    }       

}

So this is just all-in-code simple view controller example which can be used anywhere in the project by simply calling OverlayViewController.showInNewWindow(). The view controller can be from storyboard though.

The interesting part is the showInNewWindow which creates a new window and an instance of this view controller that is set as a root view controller. To show the new window all you need to call is makeKeyAndVisible. And to remove it simply hid it and remove it from superview as done in onTap. In this case the window is referenced by the view controller which should create a retain cycle. It seems that this is mandatory. It also means that we need to do some cleanup once window is dismissed by calling myWindow = nil.

There are some settings possible as well like you can disable user interaction and enable user to still use the window below this one (window.isUserInteractionEnabled = false). And you can set the level of window as to where is it displayed (window.windowLevel = .alert). You can play around a bit with these values. Which to set depends on what level you want your window to be.

Maintain custom UIView that is added to KeyWindow

1 Answers