StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>As I support Colin's answer, I want to give you an additional hint to customize the appearance of an UINavigationBar including the alpha.</p> <p>The trick is to use <strong>UIAppearance</strong> for your NavigationBar. This enables you to assign an UIImage to your NavigationBar's <strong>backgroundImage</strong>. You can generate these UIImages programmatically and use for that UIColors and set <strong>the colors' alpha properties</strong> as you want. I've done this in one of my own applications and it works as expected.</p> <p>Here I give you some <strong>code snippets</strong>:</p> <ol> <li><p>E.g. in your ..AppDelegate.m add these lines in didFinishLaunchingWithOptions:</p> <pre><code>//create background images for the navigation bar UIImage *gradientImage44 = nil; //replace "nil" with your method to programmatically create a UIImage object with transparent colors for portrait orientation UIImage *gradientImage32 = nil; //replace "nil" with your method to programmatically create a UIImage object with transparent colors for landscape orientation //customize the appearance of UINavigationBar [[UINavigationBar appearance] setBackgroundImage:gradientImage44 forBarMetrics:UIBarMetricsDefault]; [[UINavigationBar appearance] setBackgroundImage:gradientImage32 forBarMetrics:UIBarMetricsLandscapePhone]; [[UINavigationBar appearance] setBarStyle:UIBarStyleDefault]; </code></pre></li> <li><p>Implement convenience methods to programmatically creates UIImage objects, e.g. create a new category for UIImage:</p> <pre><code>//UIImage+initWithColor.h // #import <UIKit/UIKit.h> @interface UIImage (initWithColor) //programmatically create an UIImage with 1 pixel of a given color + (UIImage *)imageWithColor:(UIColor *)color; //implement additional methods here to create images with gradients etc. //[..] @end //UIImage+initWithColor.m // #import "UIImage+initWithColor.h" #import <QuartzCore/QuartzCore.h> @implementation UIImage (initWithColor) + (UIImage *)imageWithColor:(UIColor *)color { CGRect rect = CGRectMake(0, 0, 1, 1); // create a 1 by 1 pixel context UIGraphicsBeginImageContextWithOptions(rect.size, NO, 0); [color setFill]; UIRectFill(rect); UIImage *image = UIGraphicsGetImageFromCurrentImageContext(); UIGraphicsEndImageContext(); return image; } </code></pre></li> <li><p>Re-work your image creation in 1. (#import "UIImage+initWithColor.h" in AppDelegate.m and replace the "nil"s):</p></li> </ol> <p><strong>This is your spot of interest: by changing your colors' alpha property you are influencing the opacity level of you NavigationBar as well!</strong></p> <pre><code> UIImage *gradientImage44 = [UIImage imageWithColor:[UIColor colorWithRed:1.0 green:0.0 blue:1.0 alpha:0.2]]; UIImage *gradientImage32 = [UIImage imageWithColor:[UIColor colorWithRed:1.0 green:0.0 blue:1.0 alpha:0.2]]; </code></pre> <p>I created a small <strong>demo project</strong> and add you two <strong>screenshots</strong>: the view itself has a yellow backgroundColor. The backgroundImages of the NavigationBar have a red color. Screenshot 1 shows a NavigationBar with a value for alpha = 0.2. Screenshot 2 shows a NavigationBar with a value for alpha = 0.8.</p> <p><img src="https://i.stack.imgur.com/MwFGW.png" alt="Screenshot for NavigationBar with alpha=0.2"> <img src="https://i.stack.imgur.com/Y8c47.png" alt="Screenshot for NavigationBar with alpha=0.8"></p>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload