iOS 7 Tint Color - UINavigationItem's backBarButtonItem doesn't tint when initWithImage:

Question

I'm having trouble applying a tint color the navigation item's back bar button item when I create the bar button item with -[UIBarButtonItem initWithImage:style:target:selector:].

Is using an image as a view controller back context no longer okay? I can't seem to find any indication in the HIG or else where this has been deprecated or discouraged.

Here's my code:

UIBarButtonItem *barButtonItem = [[UIBarButtonItem alloc] initWithImage:[UIImage imageNamed:@"camera-navigation_item_back"]
                                                                  style:UIBarButtonItemStyleBordered
                                                                 target:nil
                                                                 action:nil];
[navItem setBackBarButtonItem:barButtonItem];

iOS 7 Result:

iOS 6 Result:

---

EDIT: If I try to use one of the system items (plus sign, trash can, etc) as my back button, Apple substitutes the image for the title "Back." This is actually the same behavior in iOS 6 and 7.

Answer 1

Set the image's rendering mode to UIImageReneringModeAlwaysTemplate (this topic is covered at around 33:00 in the WWDC video mentioned in the previous answer):

UIImage *backButtonImage = [UIImage imageNamed:@"imageName.png"];
backButtonImage = [backButtonImage imageWithRenderingMode:UIImageRenderingModeAlwaysTemplate];
UIBarButtonItem * backButton = [[UIBarButtonItem alloc]
                               initWithImage:backButtonImage
                               style:UIBarButtonItemStylePlain
                               target:nil
                               action:nil];
[[self navigationItem] setBackBarButtonItem:backButton];
[[[self navigationItem] backBarButtonItem] setTintColor:[UIColor redColor]];

The last line is not necessary if you have set the tintColor globally in AppDelegate.h:

[[UIBarButtonItem appearance] setTintColor:[UIColor redColor]];

Answer 2

You should go ahead and watch WWDC video: Customizing Your App’s Appearance for iOS 7 (Session 214, WWDC 2013)

A lot has changed here. For example there's a new API for the UIBarButton Image:

@property(nonatomic,retain) UIImage *backIndicatorImage;
@property(nonatomic,retain) UIImage *backIndicatorTransitionMaskImage;

(The mask image determines where the Bar Title is cut off when it slides beneath the back button image during a view controller pop transition. It needs to be set. If it is not set, the backIndicatorImage you set is ignored.)

But really, just watch the video (the part I'm referring to is somewhere around minutes 14:00 - 16:00 but the whole video is interesting)