Saturday, March 14, 2015

Customize UINavigationBar “Back Button”


This article will try to dig a little bit about UINavigationController and UINavigationBar. The story starts with me trying customzie “Back Button” on UINavigationBar, which helps user to navigate back to precede ViewController.

Let’s start from scratch:

After creating a fresh new Xcode project with two ViewControllers(VC) on StoryBoard. User could easily navigate from one VC to another by clicking on the UIBarButtonItem on the UINavigationBar. The StoryBoard would look like the following:


When trying to run this simply application on iOS Simulator. User will realize the Title of Back Button on the second VC is not “First View Controller”, as it should be for most of the cases. Instead, it looks like:


“Back”, yes, the Title was changed by System automatically to “Back” because the Title of parent VC is too long.
If the Title of first VC is changed to “First”, then runnning application again, user would see:


So, when the Title of first VC is too long, the second VC will change the text of back button to “Back” automatically.
After a quick check with Reference of navigationItem of UIViewController. I could change the “back button” by using:
self.navigationItem.backBarButtonItem.title = @"Custom";
But doesn’t work at all. So another dig on this, found this:


So, basically it is saying the “Back Button” I wish to change is associated with Previous View Controller. Thus, the title of it should be changed in the “Parent View Controller”, not in Current View Controller. This blows my mind. Also, the reference of backBarButtonItem could be found by  “Command + Clicking” on backBarButtonItem:


Then, the above code was moved to the “FirstVC.m” file.
But still nothing changed. Keep digging…
Based on several answers on, I realized the property navigationItem in UIViewController is readonly. So, I use this piece of code instead:
self.navigationItem.backBarButtonItem = [[UIBarButtonItem alloc] initWithTitle:@"Custom" style:UIBarButtonItemStylePlain target:nil action:nil];
This code totally rocks.


Change backBarButtonItem in Parent ViewController. Not current ViewController.
Thanks for reading.

No comments :

Post a Comment