Swift: Overlay rectangle with text over view - ios

Question

If our app has a network connectivity error we would like to overlay a colored and transparent rectangle over the top of the screen with some "Network not available" like text. The rectangle should cover the full width of the screen and the height should be enough to just show the text. We would use a timer to only show the rectangle for a brief period of time. How can you do this?
The actual view may be a UITableViewController, a UIViewController, or something else...

Answer 1

You can do this:
let deadlineTime = DispatchTime.now() + .seconds(2)
let window = UIApplication.shared.keyWindow!
let rectangleView = UIView(frame: CGRect(x: 0, y: 0, width: self.view.frame.size.width, height: 20))
rectangleView.backgroundColor = UIColor.red
let label = UILabel(frame: CGRect(x: 0, y: 0, width: self.view.frame.size.width, height: 20))
label.text = "Network not available"
rectangleView.addSubview(label)
window.addSubview(rectangleView)
DispatchQueue.main.asyncAfter(deadline: deadlineTime) {
rectangleView.removeFromSuperview()
}

Answer 2

The way I have done overlays is to drag a new UIViewController into a storyboard, and drag a UIView into that. While laying out the UI it can be helpful to make the background color of the UIViewController black. When you're done laying out your elements inside the UIView, change the background color of the UIViewController to transparent.
Here's an example of a profile overlay:
In this case I've actually made the UIViewController background a gray color with an alpha of about 50%. Then when I present this view controller using a fade transition it looks like it appears over top the current context:
func showOverlay() {
//
guard let vc = UIStoryboard(name: "MyStoryboard", bundle: nil).instantiateViewController(withIdentifier: "myOverlay") as? UIViewController else {
print("failed to get myOverlay from MyStoryboard")
return
}
vc.modalPresentationStyle = .overCurrentContext
vc.modalTransitionStyle = .crossDissolve
self.present(vc, animated: true, completion: {
// after 3 seconds, dismiss the overlay
dispatchAfterSeconds(3) {
vc.dismiss(animated: true)
}
})
}
This uses a handy function, dispatchAfterSeconds:
// execute function after delay using GCD
func dispatchAfterSeconds(_ seconds: Double, completion: #escaping (() -> Void)) {
let triggerTime = Int64(Double(NSEC_PER_SEC) * seconds)
DispatchQueue.main.asyncAfter(deadline: DispatchTime.now() + Double(triggerTime) / Double(NSEC_PER_SEC), execute: { () -> Void in
completion()
})
}
Note that when I talk about changing the background color of the UIViewController, what I actually mean by that is the background color of the view created by default inside of a UIViewController that has been created in a storyboard.