Always Needed Guide to Customize UINavigationBar
UINavigationBar remains a not-easy-to-remember topic.
When I need to change the looks of the nav bar – such as changing the Back arrow, or title, or making it transparent – I always need to google for the code.
Understanding Navigation Bar
The reason that nav bar is not easy, is because it is a pretty complicated component.
There are 3 classes associated with nav bar:
UIBarButtonItem are the buttons on the
But it is actually the
UINavigationItem that you will use to manage the buttons and views.
Specifically, eg you are on a view controller, then
self.navigationItem will provide you the left button, right button, title, etc.
One of the most confusing thing is between
Assuming you are now on your view controller, then
leftBarButtonItem refers to the button on the left of the nav bar.
backBarButtonItem is NOT shown (yet).
backBarButtonItem will be shown when you push another view controller (on top of it), as the left button of this topmost view controller (the “Back”).
Change the Back Arrow Image
You can change the default back arrow image by setting the appearance proxy.
[[UINavigationBar appearance] setBackIndicatorImage:[UIImage imageNamed:@"back-button-image"]]; [[UINavigationBar appearance] setBackIndicatorTransitionMaskImage:[UIImage imageNamed:@"back-button-image"]];
Change the Back Title
The default “Back Title” is the title of the view controller.
Sometimes, you want it to display literally “Back” (a shorter word if your title is too long), or you might want to not display a string at all (just the Back Arrow).
self.navigationItem.backBarButtonItem = [[UIBarButtonItem alloc] initWithTitle:@"Back" style:UIBarButtonItemStylePlain target:nil action:nil];
Remember: The above has to be set whereby
self is the parent view controller which the button will go back to.
Make the Background Transparent
For this, I have created UINavigationBar+Addition.
There are quite a number of things to set, some are not obvious.
[navBar setTranslucent:YES]; [navBar setBackgroundImage:[[UIImage alloc] init] forBarMetrics:UIBarMetricsDefault]; navBar.backgroundColor = [UIColor clearColor]; navBar.shadowImage = [UIImage new];