Changing the UINavigationBar background image

Question

I've been trying to change the background image of the UINavigationBar of my application. I tried several ways. First I added to my AppDelegate class the following code:

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

But it wasn't working. My next try was to write a CustomizedNavigationBar Class which is overriding the drawRect method. It looked like that:

CustomizedNavigationBar.h

#import <UIKit/UIKit.h>

@interface CustomizedNavigationBar : UINavigationBar

@end

CustomizedNavigationBar.m

#import "CustomizedNavigationBar.h"

@implementation CustomizedNavigationBar

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

    NSLog(@"I got called!!!!!");
}

@end

In my .xib file where the NavigationBar is defined I changed the class to the new CustomizedNavigationBar. But still it is not working..

As another test I downloaded an example project where the background image should be changed. But even with that sample code it was not working.

What am I doing wrong? I am using IOS 5. Any suggestions or other ways I could define a background image?

Thanks for your answers!

Answer 1

Starting in iOS 5 you should use the -setBackgroundImage:forBarMetrics: method:

[myNavbar setBackgroundImage:[UIImage imageNamed: @"UINavigationBarBackground.png"] 
               forBarMetrics:UIBarMetricsDefault];

And in Swift 4:

navigationBar.setBackgroundImage(UIImage(named: "UINavigationBarBackground.png"),
               for: .default)

Answer 2

Considering all iOS versions, this seems to be accomplishing both Custom background image and Custom size of UINavigationBar:

@interface CustomNavigationBar : UINavigationBar
@end

@implementation CustomNavigationBar
-(void) drawRect:(CGRect)rect 
{
    UIImage *image = [UIImage imageNamed: @"navigationBar"];
    [image drawInRect:CGRectMake(0, 0, self.frame.size.width, self.frame.size.height)];

    //for iOS5
    [self setBackgroundImage:[UIImage imageNamed: @"navigationBar"] forBarMetrics:UIBarMetricsDefault];
}

//for custom size of the UINavigationBar
- (CGSize)sizeThatFits:(CGSize)size {
    CGSize newSize = CGSizeMake(320,31);
    return newSize;
}

@end

I use such codes in a common place like a Utilities file.

Hope this helps.

Answer 3

Just try with this code.. In your implmentation (.m) file.

#import "RootViewController.h"

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

@implementation RootViewController

- (void)viewDidLoad {
    [super viewDidLoad];

    // Uncomment the following line to display an Edit button in the navigation bar for this view controller.
    // self.navigationItem.rightBarButtonItem = self.editButtonItem;

    self.title=@"You are Done.";
}

This has worked in excellent way for me.

Above Code Worked for only IOS 4. if you use the IOS 5 then use.....

 [myNavbar setBackgroundImage:[UIImage imageNamed:
 @"UINavigationBarBackground.png"] 
                    forBarMetrics:UIBarMetricsDefault];

Answer 4

You can add UIImageview to navigation bar as follows UINavigationBar navBar = [[UINavigationBar alloc]init]; [navBar addSubview: imageview]; [navBar release];

You can check the post : iPhone - NavigationBar Custom Background

Answer 5

You can also try this for Navigationbar Background.

UINavigationBar *navigationBar = self.navigationController.navigationBar;
UIImage *image = [UIImage imageNamed: @"NavBar-Wood.png"];
[navigationBar setBackgroundImage:image forBarMetrics: UIBarMetricsDefault];
self.navigationController.navigationBar.tintColor = [UIColor brownColor];

Thanks.

Answer 6

Another way to set an image in navigation bar is,

UIImage* logo = [ UIImage imageNamed:@"Logo.png" ];
UIImageView* logoView = [[[UIImageView alloc] initWithImage:logo] autorelease];
self.navigationItem.titleView = logoView;

This will not change whole navigation bar background. But adds a background image centered on the navigation bar, which is sometime more intended (what I was looking for).

Answer 7

Well for iOS 4 there is a simple solution, like:

nvc.navigationBar.layer.contents = (id)img.CGImage;