CODEWITHSUNDEEP
iosiphoneobjective-cxcode
ozg
ozg

Reputation: 17562

UINavigationBar background color not the exact UIColor I set it to

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 some reason the navigationbar color is slightly different. What could be the reason for this?

Thanks..

screenshot

Upvotes: 49

Views: 17994

Answers (12)

niku
niku

Reputation: 492

For me this worked -

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

Upvotes: 1

serg_zhd
serg_zhd

Reputation: 1043

FOR FURTHER READERS

If none of solutions worked for you try to check this one.

Probably you have set the background color of your view controller in the Storyboard using Generic RGB which differs from sRGB used in UIColor class since iOS 10 SDK.

Upvotes: 0

Abhijit Hadkar
Abhijit Hadkar

Reputation: 240

Add 20 in your RGB to get the desired output. eg. My navbar and UIView in UIViewController RGB was (66,66,167)

I incremented the All RGB's to (86,86,187) to get the same outputenter image description here

Upvotes: 2

Harshad Madaye
Harshad Madaye

Reputation: 478

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

enter image description here

Upvotes: 13

Tomas
Tomas

Reputation: 61

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.

Upvotes: 2

abhi
abhi

Reputation: 106

Try this, this works

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

Upvotes: 1

Yvonne Marggraf
Yvonne Marggraf

Reputation: 408

I've tried every solution, mentioned in the answers here. But nothing solved it completly. I found this:

First of all you have to have to select the navigationbar and disable the Translucent Checkbox. It's right at the top.

After this is done. The BackgroundColor is still wrong. So don't set the BackgroundColor, set the TintColor of the NavBar. You can do this on the same way like the Translucent. The possibility to set the TintColor is 2 elements under the Translucent Checkbox.

Or you set it using swift or objC:

self.navigationController?.navigationBar.isTranslucent = false  
navBar.barTintColor = UIColor.CustomColor.colorPrimary

Upvotes: 4

atraczyk
atraczyk

Reputation: 56

navigationBar.barStyle = UIBarStyle.blackOpaque

Worked to prevent undesired blending with the background, when none of the previous answers worked (in iOS 9.3).

Upvotes: 3

Brandon A
Brandon A

Reputation: 8279

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.

enter image description here

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.

enter image description here

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.

enter image description here

Upvotes: 34

Danyun Liu
Danyun Liu

Reputation: 3092

The difference between your navigation bar and search bar is because the navigation bar is translucent,the system will apply a default alpha value for the navigation bar.

Try self.navigationController.navigationBar.translucent = NO;

Upvotes: 78

Krivoblotsky
Krivoblotsky

Reputation: 1502

It differs because of default UINavigationBar blur effect. I can suggest to set 2px width stretchable background image with your color. Something like this:

    UIImage *image = [UIImage imageNamed:@"yourBlueImage"];
    image = [image stretchableImageWithLeftCapWidth:image.size.width / 2.0f topCapHeight:0.0f];
    [yourNavBar setBackgroundImage:image forBarMetrics:UIBarMetricsDefault];

It's like a trick, because when you set custom backgroundImage blur effect will be disabled and you'll get exact color.

Upvotes: 5

Adam Johnson
Adam Johnson

Reputation: 2216

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

Upvotes: -36

Related Questions