How to put an image as a title bar navigation

Question

I want to put the .png image in the middle of the navigation bar instead of the title written in the text. Could you let me know how to do this?

Thank.

Answer 1

Set title to navigationItem titleView

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

Answer 2

Swift 4.2
Includes suggested cropping / scaling

 let image: UIImage = UIImage(named: "image.png")! let imageView = UIImageView(frame: CGRect(x: 0, y: 0, width: 40, height: 40)) imageView.contentMode = .scaleAspectFit imageView.image = image self.navigationItem.titleView = imageView 

Answer 3

You can change all views in the UINavigationBar. If you are trying to change navigation in the navigation controller, follow these steps:

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

If you create a navigationBar do the same, but instead of calling self.navigationItem : navigationBar.topItem

Answer 4

Updated with Swift 2.x

 navigationItem.titleView = UIImageView.init(image: UIImage(named:"yourImageName")) 

Answer 5

In case someone needs images and text in the header view of the navigation bar in Swift 4.2, try this function: -

 override func viewDidLoad() { super.viewDidLoad() //Sets the navigation title with text and image self.navigationItem.titleView = navTitleWithImageAndText(titleText: "Dean Stanley", imageName: "online") } func navTitleWithImageAndText(titleText: String, imageName: String) -> UIView { // Creates a new UIView let titleView = UIView() // Creates a new text label let label = UILabel() label.text = titleText label.sizeToFit() label.center = titleView.center label.textAlignment = NSTextAlignment.center // Creates the image view let image = UIImageView() image.image = UIImage(named: imageName) // Maintains the image aspect ratio: let imageAspect = image.image!.size.width / image.image!.size.height // Sets the image frame so that it immediately before the text: let imageX = label.frame.origin.x - label.frame.size.height * imageAspect let imageY = label.frame.origin.y let imageWidth = label.frame.size.height * imageAspect let imageHeight = label.frame.size.height image.frame = CGRect(x: imageX, y: imageY, width: imageWidth, height: imageHeight) image.contentMode = UIView.ContentMode.scaleAspectFit // Adds both the label and image view to the titleView titleView.addSubview(label) titleView.addSubview(image) // Sets the titleView frame to fit within the UINavigation Title titleView.sizeToFit() return titleView } 

Answer 6

In search of an answer to this question, I found a good and simple solution in the Apple discussion forum , overriding -(void)drawRect:(CGRect)rect for the UINavigationBar :

 @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 

Answer 7

Swift 5 Version:

 navigationItem.titleView = UIImageView(image: UIImage(named: "logo.png"))