How to change background color of UINavigationItem?

Question

I have a UINavigationItem, but I can't found anything beside tittle, prompt, and back button in attribute inspector

enter image description here

I wonder how can I change my UINavigationItem background color using code? or programmatically?

U can change the image background or u can add it programmatically and make the the icon has a transparent background. — Frans Raharja Kurniawan, May 11 '15 at 03:06
@bumble_bee_ tuna I want to show that there is nothing except that 3 option in attribute inspector :) — Ega Setya Putra, May 11 '15 at 03:22
@EgaSetyaPutra I suppose but 75% of it is unnecessary and it makes your question difficult to read. — bumble_bee_tuna, May 11 '15 at 03:28
@EgaSetyaPutra I have posted answer please try it and inform me. — Ashok Londhe, May 11 '15 at 03:33
@EgaSetyaPutra i have up voted for your question can you do same for my answer. — Ashok Londhe, May 11 '15 at 07:15
You don't see any settings because you are looking at a top bar added via the Simulated Metrics. Super confusing. This is just a place holder for the top bar. — SmileBot, Jun 30 '20 at 15:39

Ashok Londhe · Accepted Answer · 2017-12-18T10:14:15.520

24

You can change it through code...

For Objective-C:

    self.navigationController.navigationBar.barTintColor = [UIColor redColor];

Write Above line in viewDidLoad method.

For Swift:

    self.navigationController?.navigationBar.barStyle = UIBarStyle.BlackTranslucent

    self.navigationController?.navigationBar.barTintColor  = UIColor.redColor();

OR

    self.navigationController!.navigationBar .setBackgroundImage(UIImage .new(), forBarMetrics: UIBarMetrics.Default)
    self.navigationController!.navigationBar.shadowImage = UIImage .new();
    self.navigationController!.navigationBar.translucent = true;
    self.navigationController!.navigationBar.backgroundColor = UIColor.redColor();

You can change color on your own choice.

To change the bar Text...

navigationController.navigationBar.titleTextAttributes = [UITextAttributeTextColor: UIColor.blueColor()]

See the Link.... Here

enter image description here

See the above image... you like output like this screen right...!!!

edited Dec 18 '17 at 10:14

answered May 11 '15 at 03:32

Ashok Londhe

1,491
11
29

you want to change background color of Navigation bar right? – Ashok Londhe May 11 '15 at 03:40
nope, I want to change background color of uinavigationitem – Ega Setya Putra May 11 '15 at 03:42
mean you want to change the back button color.. background color – Ashok Londhe May 11 '15 at 03:44
no, it almost the same with uinavigationbar but it doesn't have anything on attribute inspector except that 3 things – Ega Setya Putra May 11 '15 at 03:47
@EgaSetyaPutra i have edited my answer please try it again because it works for me.i have posted updated answer please try it. – Ashok Londhe May 11 '15 at 03:47
what I want to change is not uinavigationbar :D – Ega Setya Putra May 11 '15 at 04:11
@EgaSetyaPutra Actually this is the code to change navigation item background. you first try it. – Ashok Londhe May 11 '15 at 04:12
it does work for me, I'm using barTintColor instead of backgroundcolor :D thank you – Ega Setya Putra May 11 '15 at 04:43
UINavigationBar is a special view, you shouldn't access the backgroundColor property. – Nicolò Ciraci May 11 '15 at 12:15
I've no doubt that this works in some case, but there a different between "works" and "you should use this". – Nicolò Ciraci May 11 '15 at 12:18
What you are saying is ridiculous, I downvoted your answer because is not the most accurate. – Nicolò Ciraci May 11 '15 at 12:22

Nicolò Ciraci · Answer 2 · 2015-05-11T13:21:50.567

2

You shouldn't use the background property of UINavigationBar, but instead you should use barTintColor like this:

self.navigationController.navigationBar.barTintColor = UIColor.redColor()

As written in the official documentation to change the bar background you have to access to the barTintColor property:

The tint color to apply to the navigation bar background.

If you want to edit the style of the navigation bar such as button color you should access to the barTint property. If you want to edit the style of an navigationItem such as back button you should edit the button property, not the UINavigationItem's.

edited May 11 '15 at 13:21

answered May 11 '15 at 12:13

Nicolò Ciraci

678
5
23

You should learn to read the official documentation: https://developer.apple.com/library/prerelease/ios/documentation/UIKit/Reference/UINavigationBar_Class/index.html#//apple_ref/occ/instp/UINavigationBar/barTintColor "The tint color to apply to the navigation bar background." – Nicolò Ciraci May 11 '15 at 13:20

score 1 · Answer 3 · edited Mar 16 '16 at 18:20

One possible solution is to embed the View Controller it is containing the Navigation Item in a Navigation Controller and access to properties color of Navigation Bar:

// Color title 'navigationItem'
UINavigationBar.appearance().titleTextAttributes = [NSForegroundColorAttributeName: UIColor.whiteColor()]

// Background 'navigationBar'
UINavigationBar.appearance().barTintColor = UIColor.blackColor()

// Color title 'navigationBar'
let color = UIColor.orangeColor()
self.navigationController?.navigationBar.topItem?.backBarButtonItem?.setTitleTextAttributes(
    [NSForegroundColorAttributeName: color], forState: .Normal)

score 1 · Answer 4 · answered Jul 01 '19 at 13:05

1

For Swift 4

  self.navigationController?.navigationBar.isTranslucent = false;
  self.navigationController?.navigationBar.backgroundColor = .white

answered Jul 01 '19 at 13:05

Ortensia C.

4,666
11
43
70

How to change background color of UINavigationItem?

4 Answers4

Linked