Set NavigationBar background to a solid color

Question

Is there any way I can set the background of the Navigation Bar of the UINavigationController to a solid color?

I know I can change the Tint color, but that still leaves me with the gradient/glass effect.

Any way I can get rid of that, and just have a plain old solid color?

score 47 · Answer 1 · edited Mar 29 '13 at 23:05

47

The following code also results in solid color of navigation bar:

[[UINavigationBar appearance] setBackgroundImage:[[UIImage alloc] init] forBarMetrics:UIBarMetricsDefault];
[[UINavigationBar appearance] setBackgroundColor:[UIColor redColor]];

edited Mar 29 '13 at 23:05

darksky

20,411
61
165
254

answered Mar 21 '13 at 16:18

Lubiluk

704
5
12

2

Be sure to also set the tint color or your buttons on the nav bar will not get the color: [[UINavigationBar appearance] setTintColor:[UIColor redColor]]; – Jul 16 '13 at 04:56
Where do you do this? I'm trying to do it in the viewDidLoad of the view controller with the navigation bar and it does not seem to take effect. Does it need to be done sometime earlier. I have a storyboard which appears to be overriding it. – David Mar 24 '15 at 14:03
David, it has to be done before you present the view. Configuring "appearance" doesn't update visible views. If you want to set this globally the best place to do it would be in application:didFinishLaunchingWithOptions:. – Lubiluk Mar 25 '15 at 14:38

score 5 · Accepted Answer · answered Apr 24 '12 at 18:43

5

I think you have to subclass UINavigationBar and override -(void)drawRect:(CGRect)rect:

UIColor *colorFlat = /* any UIColor*/
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSetFillColorWithColor(context, [colorFlat CGColor]);
CGContextFillRect(context, rect);

answered Apr 24 '12 at 18:43

Jonathan Naguin

14,526
6
46
75

Thanks. Works like a charm. To set the colors of the buttons, I changed the tint color of the Navigation Bar, and they get the tint color. Just as I expected. – MartinHN Apr 24 '12 at 19:01
Do you know if it's possible to do via the appearance proxy? `[[UINavigationBar appearance] .....];` – MartinHN Apr 24 '12 at 19:04
I don't know, I use this code in a project with iOS 4.2 when appearance wasn't available – Jonathan Naguin Apr 24 '12 at 19:07
3

Overriding drawRect causes problems on iOS7; it becomes 44 px and leaves an empty statusBar – Yunus Nedim Mehel Feb 17 '14 at 14:15

score 0 · Answer 3 · answered Feb 17 '14 at 14:20

I used to override drawRect method and fill color; but after iOS7 upgrade it causes some problems on UINavigationBar. If you write your own drawrect method, even if you call [super drawRect], it changes the bar's dimension and you end up with a navigationBar with 44 pixels height. The status bar is left empty.

To get a solid colored navigationBar, I used an image as background image (any small solid colored image will do since you are stretching it) and added this lines inside the initWithFrame method of the UINavigationBar subclass:

[self setBackgroundColor:[UIColor clearColor]]     
[[UINavigationBar appearance] setBackgroundImage:[[UIImage imageNamed:@"bgimage.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(5, 5, 5, 5) resizingMode:UIImageResizingModeStretch] forBarMetrics:UIBarMetricsDefault];

score 0 · Answer 4 · answered Dec 30 '15 at 11:16

The following code worked for me:

[self.navigationController.navigationBar setBackgroundImage:[UIImage new] forBarMetrics:UIBarMetricsDefault];
[self.navigationController.navigationBar setBarTintColor:[UIColor greenColor]];
self.navigationController.navigationBar.translucent = NO;
[self.navigationController.navigationBar setShadowImage:[UIImage new]];

score -4 · Answer 5 · edited May 23 '17 at 12:06

-4

Create a CustomUIViewController that extends UIViewController and override viewDidLoad to something like this:

- (void)viewDidLoad
{
    [super viewDidLoad];
    // Do any additional setup after loading the view from its nib.
    self.view.backgroundColor = [UIColor colorWithRed: 0.0 green: 0.0 blue: 1.0 alpha: 1.0];
}

After that, use your CustomUIViewController in your controllers.

Credits

edited May 23 '17 at 12:06

Community

1
1

answered Apr 24 '12 at 18:18

kcho0

169
1
1
7

Isn't possible to do without an image? – MartinHN Apr 24 '12 at 18:19
Shure, sorry for the mistake, try using: [UIColor colorWithRed: 0.0 green: 0.0 blue: 1.0 alpha: 1.0] – kcho0 Apr 24 '12 at 18:25
No luck. Shouldn't I set the background on the navigationbar? e.g. `self.navigationController.navigationBar.backgroundColor`? Which doesn't work either :) – MartinHN Apr 24 '12 at 18:30
5

question is how to set navbar bg color, not uiviewcontroller bg color – Alfie Hanssen Feb 22 '13 at 18:26

Set NavigationBar background to a solid color

5 Answers5