Tutorial – Transparent UI Navigation Bar
Making the UINavigation bar transparent & see through is easy with a few lines of code. I have setup a XCode project with a simple navigation controller as the root view controller of the default view. It looks like:
To set the navigation bar to transparent simply add the following to viewDidLoad()
override func viewDidLoad() { super.viewDidLoad() // Do any additional setup after loading the view, typically from a nib. // Transparent navigation bar self.navigationController?.navigationBar.setBackgroundImage(UIImage(), for: UIBarMetrics.default) self.navigationController?.navigationBar.shadowImage = UIImage() self.navigationController?.navigationBar.isTranslucent = true }
Now run the app and volla your navigation bar will be transparent!
If you have scroll views, table views and collection views you will be able to see them through the navigation bar as you scroll through the screen.
To set the navigation bar back to default, with no transparency use the following code:
self.navigationController?.navigationBar.setBackgroundImage(nil, for: UIBarMetrics.default) self.navigationController?.navigationBar.shadowImage = nil self.navigationController?.navigationBar.tintColor = nil self.navigationController?.navigationBar.isTranslucent = false