iOS: How To Set A Custom Background Image For Your UINavigationBar

I love using the Navigation Controller for most of my projects, but unfortunately, the navigation bar just doesn’t look that great! Here is a screenshot of an app I’m working on this weekend – a Yelp sorted by the number of Foursquare checkins instead of user reviews:

I wanted my navigation background to be more like in the Twitter app, so I had a friend who’s good with photoshop quickly copy over the twitter navigation bar background and send it to me as a png. In my ViewController’s viewDidLoad: method, I then did the following to set the new navigation bar background image:

- (void)viewDidLoad
{
    [super viewDidLoad];

    [self.navigationController.navigationBar
            setBackgroundImage:[UIImage imageNamed:@"navBar.png"]
            forBarMetrics:UIBarMetricsDefault];

    // Do any additional setup after loading the view.
}

So now, my new nav bar looks like this:

Next step, need to change the navigation bar button color!