christianroman / crgradientnavigationbar Goto Github PK

View Code? Open in Web Editor NEW

916.0 27.0 116.0 363 KB

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

License: MIT License

Ruby 5.97% Objective-C 94.03%

crgradientnavigationbar's Introduction

CRGradientNavigationBar

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

Usage

Add the dependency to your Podfile:

platform :ios
pod 'CRGradientNavigationBar'
...

Run pod install to install the dependencies.
Import the header file wherever you want to use the gradient colored navigation bar:

#import "CRGradientNavigationBar.h"

Use with UINavigationController's initWithNavigationBarClass:toolbarClass: method:

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

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];

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

[[CRGradientNavigationBar appearance] setBarTintGradientColors:colors];

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: [email protected]

Twitter: http://twitter.com/chroman

crgradientnavigationbar's People

Contributors

Stargazers

Watchers

Forkers

favormm mayoita ytrjp happyjiahan donjordano nickvon coderxl choijeongmin nicolastinkl khalidelsayed tasselx luliuli mdabbagh88 cyndibaby905 vinod1988 usbwc wangjuntang nebulafox andriariii bhanubirani hengesense didge caamorales duongvanthai pcrask kozlov-v wanggao bangslosan nooner2014 moszq rubnov wjcwukong yinjiahjk krishaamer iosapplist lyly51 michaelmuss huntdo miguellunahernandez osharim avishaan thisiscrazy4 uipower lifetimecode yak0xff litianzhu818 atmycode antoinep303 hanhailong jakkraphan jackman0925 eurus luffyjie heliang219 uikit0 robertibiris managerorganization datumlogic hoowang jestemnawakacjach serjip mane-sandeep zhangyandong blessneo suninus mohsinalimat ndv-lab luiseduardohdbackup jianwoo onurersel hejunbinlan cuddles 200895045 aashouwang rakutou dennishappy weiai p418318818 chineseboy0822 wenhaowang darling0825 xjshane kafka2 yufeiskyer jasonszl vladiulianbogdan rajaseenivasan8989 tornadoback andrecreighton lionel-sf yuzhongxingke snakerxo jixuqianxing wuchunyin sixleaves woshilaozhang 583175259 shicuf yangguangyu kumareshbabuas

crgradientnavigationbar's Issues

Double Navigation Bars

My app is a Tab Bar Controller app, in which each tab is a NavigationController. I have my code set as:

`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.

[navigationController setViewControllers:@[tabBarController]];

[self.window setRootViewController:navigationController];`

However, I am getting double navigation bars, with title and uibarbuttonitems being added to the 2nd, and not the gradient one. Any suggestions?

Gradient not showing – only the second color

I set the class CRGradientNavigationBar to the NavigationBar in my Storyboard.

Then in my custom UINavigationController class I do this in the viewDidLoad:

UIColor *firstColor = [UIColor colorWithRed:0/255.0f green:0/255.0f blue:255/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];
[[CRGradientNavigationBar appearance] setBarTintGradientColors:colors];
[self.navigationBar setTranslucent:NO];

The bar changes it's color, but only to the second one provided.

Thanks in advance.

Totally different if set translucent yes

Downloaded the demo, on iOS 7, run it after just only set translucent = YES, it looks totally different from NO.

How to handle the actual effect of color gradient with translucent, which are like your screenshots.

This library looks like a lifesaver! I need to do something exactly like this (with a translucent gradient), however, I need the gradient to be horizontal, rather than vertical. Is this supported? Or how could I extend this library to support this feature?

EKEventEditViewController don't work with Gradient

It is possible using gradient in this case?

EKEventEditViewController *controller2 = [[EKEventEditViewController 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];

[[CRGradientNavigationBar appearance] setBarTintGradientColors:colors];
[[controller2 navigationBar] setTranslucent:NO];

Storyboards?

I'm using storyboards so I don't use the App Delegate class to initialize my views. How would I implement the CRGradientNavBar then? Is it not possible?

[[UINavigationBar appearance] setTintColor:[~gradient~]]

Modal view

I have CRGradientNavigationBar set to translucnet=NO, and it works great.

But when I call a modal view which also has translucent=NO the color gets darker.

How can I have modal view get the same color?

Navigation bar

Navigation bar in modal view

Gradient colors showing as much darker than specified colors

Hey croman,

Your navigation bar works great, but the colors that I include in the array show up much darker than they should. When I set both gradient colors to white (ffffff) then the nav bar is a solid gray.

Thanks for your help! I'm using storyboards.