Question

I have been trying to figure out how to display a background image behind a UINavigationBar on my iPhone app and have come across the same solution many times which is as follows:

@implementation UINavigationBar (UINavigationBarCategory) {
    - (void)drawRect:(CGRect)rect {
         UIImage *img = [UIImage imageNamed: @"logo_bar.png"];
         CGContextRef context = UIGraphicsGetCurrentContext();
         CGContextDrawImage(context, CGRectMake(0, 0, 317, 27), img.CGImage);
}
@end

Which works to a degree

My image is upside down and backwards!! why on earth would that be? I have checked the image itself which is fine. Where would this transform be getting applied??

I also have further questions, like:

1. How can I choose to show the BG image or perhaps toggle its alpha on selected screens? There is one particular screen where there is a back button and it covers the image, which I dont want, I would rather just not display the image on that screen.

2. The image is not the entire height of the UINavigationBar its just a small slice of it (27 as you can see). How can I keep the tint color for the rest of the bar using this technique?

Thanks, I have not used Categories before which may be key to me understanding this, but perhaps not…

Answer 1

// Drawing code
CGContextRef c = UIGraphicsGetCurrentContext();

UIImage *back=[UIImage imageNamed:@"bar.png"];

CGContextScaleCTM(c,1,-1);
CGContextTranslateCTM(c,0,-44);

CGContextDrawImage(c,CGRectMake(0, 0, 320, 44),[back CGImage]);

This is how I draw my custom navigation bar. Hope that helps.