Logo in Nav Bar Obj-C

Question

I am trying to display my logo in my Navigation Bar but I can't get it to fit all the different sizes of phones. I can get it to fit one and it looks terrible on another. This is the closest Ive gotten to it looking good at all. Does anyone see how I could make this look better?

UIImage *logo = [UIImage imageNamed:@"WTB_LOGO"];
UIView *headerView = [[UIView alloc] init];
headerView.frame = CGRectMake(0, 0, 225, 115);

UIImageView *imgView = [[UIImageView alloc] initWithImage:logo];
imgView.frame = CGRectMake(0, 0, 205, 115);
imgView.contentMode = UIViewContentModeScaleAspectFit;

[headerView addSubview:imgView];

self.navigationItem.titleView = headerView;

Do you want your image to appear on every ViewController as a part of navigation bar, or just on one ViewController? Do you want it to be resized or just stay in centre as it is? — NKorotkov, Jul 10 '15 at 15:15
Just the one ViewController. Just one size and stay centered. If I make it fit for iPhone 6 it is too far to the right on iPhone 5. — Keaton Carl Swoboda, Jul 10 '15 at 15:22

NKorotkov · Answer 1 · 2015-07-10T15:52:31.033

1

If I understood the problem your image is not centred properly within headerView. If image is all you want just don't use header at all, titleView is centred automatically.

self.navigationItem.titleView = imgView;

If you have a back button it will push the image View. Here's how it looks: enter image description here

So you have to make your image a little smaller.

edited Jul 10 '15 at 15:52

answered Jul 10 '15 at 15:29

NKorotkov

3,591
1
24
38

Ok so that made all the different sizes look the same which is great. But the image is still pushed to the right a bit. I have a bar button on the top left corner, could that be pushing it to the right? – Keaton Carl Swoboda Jul 10 '15 at 15:45

0yeoj · Answer 2 · 2015-07-10T15:54:08.193

0

Have you tried setting it like:

...
UIView *headerView = [[UIView alloc] init];
headerView.frame = CGRectMake(0, 0, 225, 115);

...

// same frame with the headerview
imgView.frame = headerView.frame;
// Note: should be `imgView.frame = headerView.frame;`
//       `imgView.frame = CGRectMake(0, 0, 225, 115);` is different
//
// this also work if you are supporting multi-orientation
//
// or simply assign the imageView directly 
self.navigationItem.titleView = imgView;
// but the width is kinda broad `225` it will probably be push if you insert UIBarButtonItem to left/right

Since you are using UIViewContentModeScaleAspectFit it will automatically scale itself to fit the frame.

if ever you needed to rescale the image here is a code for it.

+ (UIImage *)imageWithImage:(UIImage *)image scaleToSize:(CGSize)size
{
    UIGraphicsBeginImageContextWithOptions(size, NO, 0.0);

    [image drawInRect:CGRectMake(0, 0, size.width, size.height)];

    UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();

    UIGraphicsEndImageContext();

    return newImage;
}

Hope this helped you. Cheers! :)

edited Jul 10 '15 at 15:54

answered Jul 10 '15 at 15:42

0yeoj

4,500
3
23
41

Ok so that made all the different sizes look the same which is great. But the image is still pushed to the right a bit. I have a bar button on the top left corner, could that be pushing it to the right? – Keaton Carl Swoboda Jul 10 '15 at 15:53
@KeatonCarlSwoboda, Haha.. Exactly what i added to my answer. please check my added comment. – 0yeoj Jul 10 '15 at 15:55
Ok the rescaling code kinda confuses me. When I call it what will I put as the CGSize? – Keaton Carl Swoboda Jul 10 '15 at 16:56
@KeatonCarlSwoboda: the size of the view where you want to place it. `imgView.frame.size` for example – 0yeoj Jul 10 '15 at 16:59

score 0 · Answer 3 · answered Jul 10 '15 at 15:50

0

Not sure why just not simply try this:

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

Or I'm missing anything?

answered Jul 10 '15 at 15:50

SanitLee

1,253
1
12
29

The logo is too big. When I do it like that it is too big. – Keaton Carl Swoboda Jul 10 '15 at 15:54
This is wrong, you will miss the `contentMode = UIViewContentModeScaleAspectFit;` the image will display at its original scale/size. – 0yeoj Jul 10 '15 at 16:00
Understood. So what're you doing by using subview should be a way but you may try to set width and height in CGRectMake tied with detected screen size. As I'm on the go now, i can't post the code now. I'll do once I get back. – SanitLee Jul 11 '15 at 01:46

Logo in Nav Bar Obj-C

3 Answers3