Size of Image on UINavigationBar

Question

I want to put Custom image on my UINavigationBar,

When i tried this two code snippets,

[self.navigationItem setTitleView:[[UIImageView alloc] initWithImage:[UIImage imageNamed:@"logo.png"]]];

And

    UIButton *logoView = [[UIButton alloc] initWithFrame:CGRectMake(0,0,70,30)];
    [logoView setBackgroundImage:[UIImage imageNamed:@"logo.png"] forState:UIControlStateNormal];
    [logoView setUserInteractionEnabled:NO];
    self.navigationItem.titleView = logoView;

image which i can see on my Device is getting blur or it is getting streched.

I made image with Resolution of 180*40(Width*Height)

I want to know the exact size of Image. what, it would be ?

Thanks in advance.

If image size is **140x35** then set `imageView`'s frame size same. Otherwise It will obviously get stretched. — TheTiger, Jul 18 '13 at 09:48
You want to add a logo on navigationBar at center position ? — TheTiger, Jul 18 '13 at 09:52
Please see my question http://stackoverflow.com/questions/13988642/my-uinavigationitems-titleview-getting-expanded-in-ios-6 — iEinstein, Jul 18 '13 at 10:00
I would like to use an `UIView` instead of `navigationBar` and will hide the navigation for this screen. — TheTiger, Jul 18 '13 at 10:02

iEinstein · Accepted Answer · 2013-07-18T10:28:29.073

22

use this

UIImageView *navigationImage=[[UIImageView alloc]initWithFrame:CGRectMake(0, 0, 98, 34)];
navigationImage.image=[UIImage imageNamed:@"topNav-logo.png"];

UIImageView *workaroundImageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 98, 34)];
    [workaroundImageView addSubview:navigationImage];
    self.navigationItem.titleView=workaroundImageView;

hope this helps.

edited Jul 18 '13 at 10:28

answered Jul 18 '13 at 10:02

iEinstein

2,100
1
21
32

what is `navigationImage` ?? – Krunal Jul 18 '13 at 10:04
what should be the size of image ? – Krunal Jul 18 '13 at 10:40
1

same as imageview or vice versa – iEinstein Jul 18 '13 at 10:51
Very nice solution. Thank you! – Brave May 19 '16 at 03:40

Paras Joshi · Answer 2 · 2013-07-18T10:00:36.937

3

Create Image with size (320 x 44) and set as a Title like bellow..

self.navigationItem.titleView = yourImageView;

See whole example like bellow...

- (void)viewDidLoad{
        UIImageView* imgView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"logo.png"]];
        self.navigationItem.titleView = imgView;
        [imgView release];
}

edited Jul 18 '13 at 10:00

answered Jul 18 '13 at 09:55

Paras Joshi

20,427
11
57
70

I want to put title image and not Background image on NavigationBar – Krunal Jul 18 '13 at 09:57
@Krunal you try out this answer?? – Paras Joshi Jul 18 '13 at 10:28

Lirik · Answer 3 · 2013-07-18T11:10:05.030

1

You need to first initialize the titleView. and then set it the imageView as a subView:

UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"logo.png"]];

self.navigationItem.titleView = [[UIView alloc] initWithFrame:imageView.bounds];
[self.navigationItem.titleView addSubview:imageView];

edited Jul 18 '13 at 11:10

answered Jul 18 '13 at 09:50

Lirik

3,167
1
30
31

it's working but still image is getting stretched, what should be the resolution of image ? – Krunal Jul 18 '13 at 09:53
You can make the image which ever resolution you like, you should check a couple of things though: 1. the image content mode should be aspectFit, so it wont get of ouf bounds when added to superView. 2. check image autoresizing as well (remove streching). 3. self.navigationItem.titleView.autoresizesSubviews is default == YES, try setting it to NO. – Lirik Jul 18 '13 at 10:21
How to make image content mode aspectFit ? – Krunal Jul 18 '13 at 10:52
imageView.contentMode = UIViewContentModeScaleAspectFit; – Lirik Jul 18 '13 at 10:55
I tried this but still facing the problem `UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"logo.png"]]; self.navigationItem.titleView = [[UIView alloc] initWithFrame:imageView.bounds]; imageView.contentMode = UIViewContentModeScaleAspectFit; self.navigationItem.titleView.autoresizesSubviews=NO; [self.navigationItem.titleView addSubview:imageView];` – Krunal Jul 18 '13 at 11:03
What is the size of the imageView? it should be the image.size – Lirik Jul 18 '13 at 11:12

Size of Image on UINavigationBar

3 Answers3