UINavigationBar background color not the exact UIColor I set it to

Question

Please look at the screenshot below.

I set all the tint colors from the same UIColor object for the UINavigationBar, search bar and toolbar at the bottom. But for so

Answer 1

UINavigationBar has a bit of a strange behavior when it comes to the color you set on it. As other members have pointed out, you do have to set the translucent boolean to false, but this isn't all to get your bar to match the color you are trying to set. It will be close, but if you look carefully it will not be the exact color you are trying to use. In order to set the true color on UINavigationBar you need to understand what it is doing.

Let's say that I wanted to set my UINavigationBar to this cool color green.

That would be an RGB value of: R=90 | G=200 | B=95.

What UINavigationBar will do is apply it's built-in styling by giving this green a "glossy" look. The result for us is that it is taking our green RGB values and upping each by a factor of 20.

If you look close the green square above does not exactly match the one UINavigationBar is displaying with the same RGB values. This looks just slightly brighter.

To fix this, simply reduce the RBG values by 20 for the color you intend to use for the UINavigationBar's in your application.

So R=90 | G=200 | B=95 will become R=70 | G=180 | B=75.

Answer 2

You will have to disable property translucent for navigation bar

you can do it programatically with following line

self.navigationController?.navigationBar.isTranslucent = false 

OR

Just un-tick "Translucent" check box from storyboard, you will find it in UINavigationBar properties on UINavigationController

Answer 3

Try this, this works

navigationController?.navigationBar.shadowImage = UIImage() navigationController?.navigationBar.setBackgroundImage(UIImage(), for: .default)

Answer 4

I had the same problem as the op. After number of hours of failed attempts I decided to change the logic in my code:

First, set the backround color of the navigation bar:

navigationBar.barTintColor = UIColor.red

iOS will make the red a bit darker/lighter as described by others in this thread.

Second, take the color of the navigation bar and set it to what you need, in my case the background of the cell:

cell.backgroundColor = navigationBar.barTintColor

Now the colors will be the same.

Answer 5

I've had this same issue happen to me before. Completely closing Xcode, fixed the issue for me.

Answer 6

For me this worked -

        let img = UIImage(color: UIColor.red)
        navigationController?.navigationBar.shadowImage = img
        navigationController?.navigationBar.setBackgroundImage(img, for: .default)