How to add image in UINavigationBar in IPhone app

Question

In my app, i want to add image(logo) in Navigation bar. I am working on XCode 4.2 and iOS 5.

I know UINavigationBar, UIToolBar has been changed in iOS 5. So iOS 4.2 UINavigationBar code won't work in iOS 5.

I want to support display image in UINavigationBar in both 4.2 and 5 version.

I want to be display image in UINavigationBar like as in below screenshot.

Navigation bar image

Please help in this regards and if there is any sample code means its very helpful to me.

Thanks!!!

score 78 · Accepted Answer · answered Jan 11 '12 at 04:33

78

One way to do this is to use UINavigationItem.titleView and UINavigationItem.rightBarButtonItem. Like this :

viewController.navigationItem.titleView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"yourimage.png"]];
UIBarButtonItem * item = [[UIBarButtonItem alloc] initWithCustomView:[[UIImageView alloc] initWithImage:[UIImage imageNamed:@"yourimage2.jpg"]]];    
viewController.navigationItem.rightBarButtonItem = item;

Here I am using UIImageView as custom view, but it can be UIButton with custom image.

answered Jan 11 '12 at 04:33

barley

4,403
25
28

Will this work for both iOS4 and 5 ? and is it the `clingle` Logo you are trying to add and not the background image for UINavigationbar ? – Illep Feb 14 '12 at 23:38
It does on Simulator at least. And I don't see any reason it should not. I didn't understand your second question. – barley Feb 16 '12 at 18:21
thanks. but I noticed the item object is not released in your example. – Martin Reichl Jul 05 '12 at 11:48
the image view is also leaked here. – Martin Reichl Jul 05 '12 at 11:58
3

I am using ARC... :) @MartinReichl – barley Jul 05 '12 at 15:14
The author stated that the solution should work also in iOS 4, so I did not thought about ARC :) – Martin Reichl Jul 05 '12 at 18:48
You can use ARC for iOS 4 and above, although weak reference is not supported in ios4. – barley Jul 05 '12 at 19:54
3

Just a not, you shouldnt say @"youtimage.png". @"yourimage" will suffice, iOS will figure out the correct image to load. – Maciej Swic Feb 26 '13 at 16:42
is there a way to automatically scale it to fit the navbar? – rigdonmr Jun 11 '16 at 00:53

score 33 · Answer 2 · edited Feb 20 '17 at 07:36

33

Another way without using a viewController

// Create your image
UIImage *image = [UIImage imageNamed: @"logo.png"];
UIImageView *imageview = [[UIImageView alloc] initWithImage: image];

// set the image view to the title view
self.navigationItem.titleView = imageview;

edited Feb 20 '17 at 07:36

nayem

7,285
1
33
51

answered Jun 28 '12 at 20:23

mikemike396

2,435
1
26
41

score 5 · Answer 3 · answered Sep 01 '16 at 07:46

Swift version: You can create a protocol extension for using the function in your view controllers

protocol Customizable {
    var navigationItem: UINavigationItem { get }
}

extension Customizable {
    func setNavBarLogo() {

        let logo = UIImage(named: "logo")
        let logoImageView = UIImageView(image: logo)

        self.navigationItem.titleView = logoImageView
    }
}

How to add image in UINavigationBar in IPhone app

3 Answers3

Linked