How would I draw a line at the bottom of a UINavigationBar?

Question

The design I've been given for an iPhone app I'm working on calls for a 1px red line at the bottom of the navigation bar. I know how to draw a line with Quartz and -drawRect, but how do I get access to the UINavigationBar's view? Or would it work to draw the line in the app's main view, on top of everything else?

Duncan Wilcox's answer below works to get the line drawn, but then buttons on the bar become impossible to press.

If I do [self.navigationItem.titleView.superview sendSubviewToBack:titleView] then buttons that are created in nib files work, but not ones that are dynamically added.

Answer 1

I guess the answer depends on where you want the red line, as part of the navigation bar or just under it. That would be only 1 pixel difference, but designers are demanding these days :)

If you want it below the navigation bar you definitely have to put it in all of the app's views where the line is needed.

There's a surprisingly simple way to alter the look of the navigation bar, I used it for skinning the entire navbar look but it will probably work for even only some parts of the navbar if you make the image partially transparent.

Basically we want to skin the UINavigationItem of a UIViewController that's in your navigation hierarchy.

• create a 320x44 image containing your custom navbar look
• add a UIImageView to the XIB where the UINavigationItem is
• link the titleView property of the UINavigationItem to the UIImageView

This almost works, except that the title view will be resized in wierd ways. To fix that I have a UIImageView subclass that keeps the image properly set:

@implementation TitleViewHack
- (void)setFrame:(CGRect)frame
{
    frame.size.width = 320;
    if(frame.origin.x > 0 && frame.origin.x < 20)
     frame.origin.x = 0;
    [super setFrame:frame];
}
@end

So instead of using a UIImageView above you'll use this TitleViewHack class.

Answer 2

This is what I've settled upon:

// UINavigationBar subclass
- (void)drawRect:(CGRect)rect {
    UIImage *image = [UIImage imageNamed: @"background_navbar.png"];
    [image drawInRect:CGRectMake(0, 0, self.frame.size.width, self.frame.size.height)];
}