Change color of translucent black UINavigationBar

Question

I stumbled upon this many times, never found a solution. A UINavigationController's navigationBar can be set to black translucent like:

self.navigationController.navigationBar.barStyle=UIBarStyleBlackTranslucent;

Also, there is a translucent property in UINavigationBar, the docs say:

When YES, the navigation bar is drawn with partial opacity, regardless of the bar style. The amount of opacity is fixed and cannot be changed. It is permissible to set the value of this property when the navigation bar is being managed by a navigation controller object.

I tried

self.navigationcontroller.navigationBar.tintColor=[UIColor blueColor];
self.navigationcontroller.navigationBar.translucent=YES;

and a thousand variations: Setting the translucent property first, setting it in the AppDelegate and in the ViewController, setting the barstyle first. The result is always the same: No transparency. Hence my question:

Is it really possible to change the color of a translucent UINavigationBar to something different than black (preferably within a UINavigationController)?.

I hope there is a review-safe solution.

Thanks, m

Brickkiln

Answer 1

Once you know it, it's fairly simple:

self.navigationController.navigationBar.tintColor = [UIColor blueColor];
self.navigationController.navigationBar.alpha = 0.7f;
self.navigationController.navigationBar.translucent = YES;

The translucent property seems only to determine wether the main view should be visible under the navigation bar, and resizes the view appropiately.

Brickkiln

The side effect I notice from this is that it changes the alpha for the whole navigationBar (not just the background). Specifically the title is not "bright" white, but appears to also be 0.7f alpha. – Teraterai

I want to say that if you hace this piece of code in your viewDidLoad is not going to work if ([self respondsToSelector:@selector(edgesForExtendedLayout)]) self.edgesForExtendedLayout = UIRectEdgeNone; you will have a black nice navigationBar – Omphale

works, but the title and barbuttons take the same alpha. – Deprive

Answer 2

To mimic more accurately the translucent effect, meaning that only the background of the navbar is translucent, and the buttons, title and everything else are opaque, you can do like this:

self.navigationController.navigationBar.translucent = YES;
[(UIView*)[self.navigationController.navigationBar.subviews objectAtIndex:0] setAlpha:0.7f];

Lambdoid

Answer 3

At least in iOS 6 on an iPhone 4S, you can make a colored translucent navigation bar like this:

self.navigationController.navigationBar.tintColor = [UIColor blueColor];
self.navigationController.navigationBar.translucent = YES;

The alpha setting doesn't seem to be necessary anymore. This also leaves my title bright white and my buttons opaque.

Reciprocate

Answer 4

Here is the solution:

[[UIApplication sharedApplication] setStatusBarStyle:UIStatusBarStyleLightContent];
[[UINavigationBar appearance] setBarTintColor:[UIColor colorWithRed:3.f/255.f green:8.f/255.f blue:61.f/255.f alpha:1]];
self.navigationController.navigationBar.translucent = YES;
self.navigationController.navigationBar.barTintColor = [UINavigationBar appearance].barTintColor;

Bullish