iOS 7 UIBarButton back button arrow color
IosIos7Ios Problem Overview
I'm trying to change the back button arrow
I'm currently using the following to control the text size as well as the text color on the back button:
[[UIBarButtonItem appearance] setTitleTextAttributes:
[NSDictionary dictionaryWithObjectsAndKeys:
[UIColor whiteColor], UITextAttributeTextColor,
[UIFont boldSystemFontOfSize:16.0f], UITextAttributeFont,
[UIColor darkGrayColor], UITextAttributeTextShadowColor,
[NSValue valueWithCGSize:CGSizeMake(0.0, -1.0)], UITextAttributeTextShadowOffset,
nil] forState:UIControlStateNormal];
but if I want to change only the arrow's color for the back button, what should i do?
Ios Solutions
Solution 1 - Ios
To change the back button chevron color for a specific navigation controller*:
self.navigationController.navigationBar.tintColor = [UIColor whiteColor];
*If you are using an app with more than 1 navigation controller, and you want this chevron color to apply to each, you may want to use the appearance proxy to set the back button chevron for every navigation controller, as follows:
[[UINavigationBar appearance] setTintColor:[UIColor whiteColor]];
And for good measure, in swift (thanks to Jay Mayu in the comments):
UINavigationBar.appearance().tintColor = UIColor.whiteColor()
Solution 2 - Ios
You have to set the tintColor of the entire app.
self.window.tintColor = [UIColor redColor];
Or in Swift 3:
self.window?.tintColor = UIColor.blue
Source: iOS 7 UI Transition Guide
Solution 3 - Ios
You can set the color on the entire app navigation's bar using the method
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:
(NSDictionary *)launchOptions{
[[UINavigationBar appearance] setTintColor:[UIColor whiteColor]];
}
Solution 4 - Ios
It is possible to change only arrow's color (not back button title's color) on this way:
[[self.navigationController.navigationBar.subviews lastObject] setTintColor:[UIColor blackColor]];
Navigation bar contains subview of _UINavigationBarBackIndicatorView type (last item in subviews array) which represents arrow.
Result is navigation bar with different colors of back button arrow and back button title
Solution 5 - Ios
Solution 6 - Ios
Inside the rootViewController that initializes the navigationController, I put this code inside my viewDidAppear method:
//set back button color
[[UIBarButtonItem appearanceWhenContainedIn:[UINavigationBar class], nil] setTitleTextAttributes:[NSDictionary dictionaryWithObjectsAndKeys:[UIColor whiteColor], UITextAttributeTextColor,nil] forState:UIControlStateNormal];
//set back button arrow color
[self.navigationController.navigationBar setTintColor:[UIColor whiteColor]];
Solution 7 - Ios
In iOS 6, tintColor tinted the background of navigation bars, tab bars, toolbars, search bars, and scope bars. To tint a bar background in iOS 7, use the barTintColor property instead.
Solution 8 - Ios
You can set the tintColor
property on the button (or bar button item) or the view controller's view. By default, the property will inherit the tint from the parent view, all the way up to the top level UIWindow
of your app.
Solution 9 - Ios
I had to use both:
[[UIBarButtonItem appearanceWhenContainedIn:[UINavigationBar class], nil]
setTitleTextAttributes:[NSDictionary
dictionaryWithObjectsAndKeys:[UIColor whiteColor], UITextAttributeTextColor,nil]
forState:UIControlStateNormal];
[[self.navigationController.navigationBar.subviews lastObject] setTintColor:[UIColor whiteColor]];
And works for me, thank you for everyone!
Solution 10 - Ios
UINavigationBar *nbar = self.navigationController.navigationBar;
if (floor(NSFoundationVersionNumber) > NSFoundationVersionNumber_iOS_6_1) {
//iOS 7
nbar.barTintColor = [UIColor blueColor]; // bar color
//or custom color
//[UIColor colorWithRed:19.0/255.0 green:86.0/255.0 blue:138.0/255.0 alpha:1];
nbar.navigationBar.translucent = NO;
nbar.tintColor = [UIColor blueColor]; //bar button item color
} else {
//ios 4,5,6
nbar.tintColor = [UIColor whiteColor];
//or custom color
//[UIColor colorWithRed:19.0/255.0 green:86.0/255.0 blue:138.0/255.0 alpha:1];
}
Solution 11 - Ios
Update Swift 3
navigationController?.navigationItem.rightBarButtonItem?.tintColor = UIColor.yellow
navigationController?.navigationBar.tintColor = UIColor.red
navigationController?.navigationBar.barTintColor = UIColor.gray
navigationController?.navigationBar.titleTextAttributes = [NSForegroundColorAttributeName: UIColor.blue]
Solution 12 - Ios
Just to change the NavigationBar
color you can set the tint color like below.
[[UINavigationBar appearance] setTintColor:[UIColor whiteColor]];
Solution 13 - Ios
In case you're making custom back button basing on UIButton with image of arrow, here is the subclass snippet. Using it you can either create button in code or just assign class in Interface Builder to any UIButton. Back Arrow Image will be added automatically and colored with text color.
@interface UIImage (TintColor)
- (UIImage *)imageWithOverlayColor:(UIColor *)color;
@end
@implementation UIImage (TintColor)
- (UIImage *)imageWithOverlayColor:(UIColor *)color
{
CGRect rect = CGRectMake(0.0f, 0.0f, self.size.width, self.size.height);
if (UIGraphicsBeginImageContextWithOptions) {
CGFloat imageScale = 1.0f;
if ([self respondsToSelector:@selector(scale)])
imageScale = self.scale;
UIGraphicsBeginImageContextWithOptions(self.size, NO, imageScale);
}
else {
UIGraphicsBeginImageContext(self.size);
}
[self drawInRect:rect];
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSetBlendMode(context, kCGBlendModeSourceIn);
CGContextSetFillColorWithColor(context, color.CGColor);
CGContextFillRect(context, rect);
UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return image;
}
@end
#import "iOS7backButton.h"
@implementation iOS7BackButton
-(void)awakeFromNib
{
[super awakeFromNib];
BOOL is6=([[[UIDevice currentDevice] systemVersion] floatValue] <7);
UIImage *backBtnImage = [[UIImage imageNamed:@"backArrow"] imageWithOverlayColor:self.titleLabel.textColor];
[self setImage:backBtnImage forState:UIControlStateNormal];
[self setTitleEdgeInsets:UIEdgeInsetsMake(0, 5, 0, 0)];
[self setImageEdgeInsets:UIEdgeInsetsMake(0, is6?0:-10, 0, 0)];
}
+ (UIButton*) buttonWithTitle:(NSString*)btnTitle andTintColor:(UIColor*)color {
BOOL is6=([[[UIDevice currentDevice] systemVersion] floatValue] <7);
UIButton *backBtn=[[UIButton alloc] initWithFrame:CGRectMake(0, 0, 60, 30)];
UIImage *backBtnImage = [[UIImage imageNamed:@"backArrow"] imageWithOverlayColor:color];
[backBtn setImage:backBtnImage forState:UIControlStateNormal];
[backBtn setTitleEdgeInsets:UIEdgeInsetsMake(0, is6?5:-5, 0, 0)];
[backBtn setImageEdgeInsets:UIEdgeInsetsMake(0, is6?0:-10, 0, 0)];
[backBtn setTitle:btnTitle forState:UIControlStateNormal];
[backBtn setTitleColor:color /*#007aff*/ forState:UIControlStateNormal];
return backBtn;
}
@end
Solution 14 - Ios
If you want to change only the Back Arrow BUT on the entire app, do this:
[[NSClassFromString(@"_UINavigationBarBackIndicatorView") appearance]
setTintColor:[UIColor colorWithHexString: @"#f00000"]];
Solution 15 - Ios
In iOS 7, you can put the following line of code inside application:didFinishLaunchingWithOptions:
in your AppDelegate.m
file:
[[UINavigationBar appearance] setTintColor:myColor];
Set myColor
to the color you want the back button to be throughout the entire app. No need to put it in every file.
Solution 16 - Ios
Swift 2.0: Coloring Navigation Bar & buttons
navigationController?.navigationBar.barTintColor = UIColor.blueColor()
navigationController?.navigationBar.tintColor = UIColor.whiteColor()
navigationController!.navigationBar.titleTextAttributes = [NSForegroundColorAttributeName: UIColor.whiteColor()]
Solution 17 - Ios
In swift 3 , to change UIBarButton back button arrow color
self.navigationController?.navigationBar.tintColor = UIColor.black