UINavigation bar background in iPhone

Question

I have applied following code to my application to change the navigation bar image.

- (void)viewWillAppear:(BOOL)animated {
[super viewWillAppear:animated];
[self.navigationController.navigationBar setTintColor:[UIColor blackColor]];
[self setNavigationBarTitle];
}
-(void)setNavigationBarTitle {
UIView *aViewForTitle=[[[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 45)] autorelease];
UIImageView *aImg=[[UIImageView alloc] initWithFrame:CGRectMake(-8, 0, 320, 45)];
aImg.image=[UIImage imageNamed:@"MyTabBG.png"];
[aViewForTitle addSubview:aImg]; [aImg release]; 
UILabel *lbl=[[[UILabel alloc] initWithFrame:CGRectMake(0, 0, 305, 45)] autorelease];
lbl.backgroundColor=[UIColor clearColor]; lbl.font=[UIFont fontWithName:@"Trebuchet MS" size:22];
lbl.shadowColor=[UIColor blackColor]; [lbl setShadowOffset:CGSizeMake(1,1)];
lbl.textAlignment=UITextAlignmentCenter; lbl.textColor=[UIColor whiteColor]; lbl.text=@"Mobile Tennis Coach Overview";
[aViewForTitle addSubview:lbl];
[self.navigationItem.titleView addSubview:aViewForTitle];
}

See following images. You can see the problem that I am facing.

---

Each view controller of my application has above methods to set the navigation bar background.

How ever, when I push a new view controller to my application. Back button will be appear.

I need back button to be appear. But The image should be behind back button.

Now I am little confused here.

Can you help me regarding this?

Thanks in advance for sharing your knowledge with me.

Thanks a lot.

Answer 1

After an annoying night, I found a slight tweak to this, if you use drawLayer. With drawRect, when you play a video, or youtube video, the navbar is replaced with the image. And I read a few posts that this caused their app to be rejected.

@implementation UINavigationBar (UINavigationBarCategory)

- (void)drawLayer:(CALayer *)layer inContext:(CGContextRef)ctx 
{
   if([self isMemberOfClass:[UINavigationBar class]])
   {
     UIImage *image = [UIImage imageNamed:@"navBarBackground.png"];
     CGContextClip(ctx);
     CGContextTranslateCTM(ctx, 0, image.size.height);
     CGContextScaleCTM(ctx, 1.0, -1.0);
     CGContextDrawImage(ctx,
     CGRectMake(0, 0, self.frame.size.width, self.frame.size.height), image.CGImage); 
   }
   else 
   {        
     [super drawLayer:layer inContext:ctx];     
   }
}  
@end

If this article is accurate, all should be fine with this approach: http://developer.apple.com/iphone/library/qa/qa2009/qa1637.html

Answer 2

The short answer is that modifying the structure of the UINavigationBar is not supported by Apple. They really do not want you do be doing what you are trying to do. That is what is causing the issue you are seeing.

Please file a radar requesting this feature so that it can get enough attention to be officially added at some point.

Having said that, to solve the issue you can add a category to UINavigationBar with a -drawRect: method and draw the background image in that method. Something like this will work:

- (void)drawRect:(CGRect)rect
{
  static UIImage *image;
  if (!image) {
    image = [UIImage imageNamed: @"HeaderBackground.png"];
    if (!image) image = [UIImage imageNamed:@"DefaultHeader.png"];
  }
  if (!image) return;
  CGContextRef context = UIGraphicsGetCurrentContext();
  CGContextDrawImage(context, CGRectMake(0, 0, self.frame.size.width, self.frame.size.height), image.CGImage);
}