Topics

#72: Customizing Navigation Bars πŸ€

Topics

Navigation Bars are a versatile part of iOS. Let's take a look at some different ways we can customize their appearance and behavior.

Custom Fonts and Colors

let nba = UINavigationBar.appearance()
let bba = UIBarButtonItem.appearance()

let titleTextAttributes = [ NSFontAttributeName : navBarFont ]

nba.barTintColor = green
nba.tintColor = darkGreen
nba.titleTextAttributes = titleTextAttributes

bba.setTitleTextAttributes(titleTextAttributes, forState: .Normal)

Hide/Show Navigation Bar when Scrolling

navigationController?.hidesBarsOnSwipe = true

This will cause our navigation bar to slide on and off screen as the user scrolls, just like in Safari for iOS.

Empty Back Button

We want a back button with no text. We could set the title of our first view controller to an empty string, but then our first view controller would be title-less. We can get the best of both worlds by giving the first view controller a custom back button item with an empty title. We'll need to do this before we push on a new view controller.

navigationItem.backBarButtonItem = UIBarButtonItem(title: "", style: .Plain, target: nil, action: nil)

Use an Image as a Title

let imageView = UIImageView(image: UIImage(named: "app-logo")!)
navigationItem.titleView = imageView