How to add a image at the center of navigationBar in Objective-C?

Question

I am developing in IOS , I use the following code to set a background to the navigationBar.

[self.navigationController.navigationBar setBackgroundImage:[UIImage imageNamed:@"bar-back"] forBarMetrics:UIBarMetricsDefault];

And I want to add a image on navigationBar and center of navigationBar like the following picture.

How to add a image at the center of navigationBar in Objective-C ?

Thanks in advance.

Answer 1

Set navigation title view like below

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

---

EDIT:
if you have big image then use below code

UIImage *img = [UIImage imageNamed:@"1.png"];
UIImageView *imgView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 30, 30)];
[imgView setImage:img];
// setContent mode aspect fit
[imgView setContentMode:UIViewContentModeScaleAspectFit];
self.navigationItem.titleView = imgView;

Answer 2

As you said to set an icon for the application. You may like to go for this which will show icon for whole application.

UIImageView *imageView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"icon"]];
CGSize imageSize = CGSizeMake(40, 40);
CGFloat marginX = (self.navigationController.navigationBar.frame.size.width / 2) - (imageSize.width / 2);

imageView.frame = CGRectMake(marginX, 0, imageSize.width, imageSize.height);
[self.navigationController.navigationBar addSubview:imageView];

OutPut:

Answer 3

I was facing the same issue, since iOS 11 and Xcode 9 started managing the Navigation Bars with auto layout instead of frames you should be aware of your Navigation Bar layout.

In the WWDC Session 204, Updating your app for iOS 11, was stated that UIToolBar and UINavigationBar was upgraded to use auto layout, and in order to avoid Zero-Sized Custom Views you should know a few things about it.

UINavigation and UIToolBar provide position, do not care about it.

You must provide the size of the Custom view with one of the following:

• Constraints for width and height.
• Implement intrinsicContentSize
• Connect your subviews via constraints.

Answering your question, I set the titleView with a ImageView,providing the size in two different ways:

Giving Height and width explicitly.

-(void)updateNavTitleView{
    UIImageView *imageView = [[UIImageView alloc] initWithImage:[ UIImage imageNamed:@"TitleViewImage"]];
    [imageView.widthAnchor constraintEqualToConstant:160].active = YES;
    [imageView.heightAnchor constraintEqualToConstant:44].active = YES;
    self.navigationItem.titleView = imageView;
}

Or setting the aspect mode as aspectFit

-(void) updateNavTitleView{
    UIImageView *imageView = [[UIImageView alloc] initWithImage:[ UIImage imageNamed:@"TitleViewImage"]];
    [imageView setContentMode:UIViewContentModeScaleAspectFit];
    self.navigationItem.titleView = imageView;
}

In case you want to watch the Session, Session 204

Answer 4

One thing to mention here is to use a width of 3 for the UIImageView. This is important - if it's 2 (or any even number), then the image will be blurry. Setting clipToBounds=NO and contentMode=UIViewContentModeScaleAspectFill means the image will display outside the image view's width (fine), and will be correctly proportioned.

UIImageView *imageView = [[UIImageView alloc]
        initWithFrame:CGRectMake(0,0,3,44)];
    imageView.contentMode = UIViewContentModeScaleAspectFill;
    imageView.clipsToBounds = NO;
    imageView.image = [UIImage imageNamed:@"navigation-logo"];
    controller.navigationItem.titleView = imageView;