christianroman/CRGradientNavigationBar

Custom UINavigationBar subclass which allows gradient coloured navigation bar on iOS 7.

CRGradientNavigationBar

Custom UINavigationBar subclass which allows gradient coloured navigation bar on iOS 6/7.

Usage

1. Add the dependency to your Podfile:

platform :ios
pod 'CRGradientNavigationBar'
...

1. Run pod install to install the dependencies.

2. Import the header file wherever you want to use the gradient colored navigation bar:

#import "CRGradientNavigationBar.h"

1. Use with UINavigationController's initWithNavigationBarClass:toolbarClass: method:

UINavigationController *navigationController = [[UINavigationController alloc] initWithNavigationBarClass:[CRGradientNavigationBar class] toolbarClass:nil];

1. Use an NSArray to set the gradient colors (You can set unlimited colors):

UIColor *firstColor = [UIColor colorWithRed:255.0f/255.0f green:42.0f/255.0f blue:104.0f/255.0f alpha:1.0f];
UIColor *secondColor = [UIColor colorWithRed:255.0f/255.0f green:90.0f/255.0f blue:58.0f/255.0f alpha:1.0f];
NSArray *colors = [NSArray arrayWithObjects:firstColor, secondColor, nil];

1. Set the gradient colors via NSArray using UIAppearance setBarTintGradientColors: method:

[[CRGradientNavigationBar appearance] setBarTintGradientColors:colors];

1. Remember to set (YES) or not (NO) to translucent value using setTranslucent: method:

[[navigationController navigationBar] setTranslucent:NO];

You can change the transparency default value (0.5f), just change this line in the CRGradientNavigationBar.m file:

static CGFloat const kDefaultOpacity = 0.5f;

Full example:

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
    self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
    
    [[UIApplication sharedApplication] setStatusBarStyle:UIStatusBarStyleLightContent];
    
    UINavigationController *navigationController = [[UINavigationController alloc] initWithNavigationBarClass:[CRGradientNavigationBar class] toolbarClass:nil];
    
    UIColor *firstColor = [UIColor colorWithRed:255.0f/255.0f green:42.0f/255.0f blue:104.0f/255.0f alpha:1.0f];
    UIColor *secondColor = [UIColor colorWithRed:255.0f/255.0f green:90.0f/255.0f blue:58.0f/255.0f alpha:1.0f];
    
    NSArray *colors = [NSArray arrayWithObjects:firstColor, secondColor, nil];
    // or NSArray *colors = [NSArray arrayWithObjects:(id)UIColorFromRGB(0xf16149).CGColor, (id)UIColorFromRGB(0xf14959).CGColor, nil];
    
    [[CRGradientNavigationBar appearance] setBarTintGradientColors:colors];
    [[navigationController navigationBar] setTranslucent:NO]; // Remember, the default value is YES.
    
    DemoViewController *viewController = [[DemoViewController alloc] init];
    [navigationController setViewControllers:@[viewController]];
    
    [self.window setRootViewController:navigationController];
    
    self.window.backgroundColor = [UIColor whiteColor];
    [self.window makeKeyAndVisible];
    return YES;
}

Example gradient combinations

• Translucent = NO

• Translucent = YES

• Example using three different colors and translucent` value to NO

• If you need just one color use UIAppearance setBarTintColor: method:

[[CRGradientNavigationBar appearance] setBarTintColor:UIColorFromRGB(0xEE695D)];

Translucent demo 1:

Translucent demo 2:

Requirements

• iOS 6.0 or higher
• ARC

License

CRGradientNavigationBar is released under the MIT license. See LICENSE.

Contact me

Christian Roman

Website: http://chroman.me

Contact: chroman16@gmail.com

Twitter: http://twitter.com/chroman