Archive for May 7th, 2010


Tip: UINavigationBar Background


So you’ve got this design from the artists for your new navigation-based app, and they want the navigation bar to look exactly like the artwork, a close gradient just doesn’t cut it. What to do? What to do? And if you look around, there are a number of suggestions on how to accomplish this, which are mostly overly complicated and in some places just plain wrong.

But, assuming that all the bars in the app are supposed to look the same which is most likely a safe assumption, why indeed there is an extremely simple way — just make a category to override UINavigationBar’s -drawRect! Easy once you think of it, indeed. And set the bar’s tint color appropriately for your image there too and buttons will respect that; so in our case here, the simple category

@implementation UINavigationBar (TWXUINavigationBar)
- (void)drawRect:(CGRect)rect
   UIImage *img  = [UIImage imageNamed: @"customnavigationbar.png"];
   [img drawInRect:CGRectMake(0, 0, self.frame.size.width, self.frame.size.height)];
   UIColor *topColor = [UIColor colorFromHexValue:0x910011];
   self.tintColor = topColor;

where the tint color was taken from the top pixel of the .png file, results in


Very nice looking, yes? Now that’s a seriously easy way to satisfy those picky artistic types!