• Home
  • About
  • Our Apps
  • Learn
  • Contact
Login

Register

Login
Seemu Apps Seemu Apps
  • Home
  • About
  • Our Apps
  • Learn
  • Contact

Tutorial – Transparent UI Navigation Bar

Home ios Tutorial – Transparent UI Navigation Bar

Tutorial – Transparent UI Navigation Bar

Feb 21, 2016 | Posted by Andrew | ios, swift, tutorial, xcode |

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:

navigationcontroller

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!

transnavbar

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

DownloadSourceCode

Tags: navigationnavigation barsee throughtranslucenttransparentuinavigationuinavigationbar
0
Share

About Andrew

Andrew is a 24 year old from Sydney. He loves developing iOS apps and has done so for two years.

You also might be interested in

Tutorial – Set Navigation Bar Color

Mar 3, 2016

You can simply set the Navigation Bar Color in XCode[...]

Tutorial – Navigation between View Controllers

Jul 30, 2015

In this tutorial we will look at navigation in Swift,[...]

Tutorial – Custom Navigation Bar Back Arrow

Mar 23, 2016

You can simply set the Navigation Bar back image style with[...]

Welcome

Hi I am Andrew and welcome to Seemu Apps! Have a look around, we provide tutorials for primarily iOS apps.
Bluehost website hosting discount

Seemu’s Studio Setup

Blue Yeti Microphone
Rode Stand
Spider Shock Mount
Mac Keyboard Cover
Screenflow - recording software

Contact Us

We're currently offline. Send us an email and we'll get back to you, asap.

Send Message

Footer

:)

© 2026 · Your Website. Theme by HB-Themes.

  • Home
  • About
  • Our Apps
  • Learn
  • Contact
Prev Next