Can anyone advise me on how the border below the navigation bar can be changed?
I would like to change it from the current black light to a softer color. Appreciate any help here
Can anyone advise me on how the border below the navigation bar can be changed?
I would like to change it from the current black light to a softer color. Appreciate any help here
I do not think there is a method to change the border color of the navigation color, other than the tintColor
property of the UINavigationBar
.
I would suggest that you create a UIView of that border size and place it below the navigation bar / add it as a subView
.
UIView *navBorder = [[UIView alloc] initWithFrame:CGRectMake(0,navigationBar.frame.size.height-1,navigationBar.frame.size.width, 1)];
// Change the frame size to suit yours //
[navBorder setBackgroundColor:[UIColor colorWithWhite:200.0f/255.f alpha:0.8f]];
[navBorder setOpaque:YES];
[navigationBar addSubview:navBorder];
[navBorder release];
In Swift like the @Legolas answer:
if let navigationController = self.navigationController {
let navigationBar = navigationController.navigationBar
let navBorder: UIView = UIView(frame: CGRectMake(0, navigationBar.frame.size.height - 1, navigationBar.frame.size.width, 1))
// Set the color you want here
navBorder.backgroundColor = UIColor(red: 0.19, green: 0.19, blue: 0.2, alpha: 1)
navBorder.opaque = true
self.navigationController?.navigationBar.addSubview(navBorder)
}
You can put in the viewDidLoad()
of your UIViewController
.
For iOS 7 you could use this:
[self.navigationController.navigationBar setShadowImage:[UIImage new]];
You can also add a child view to your nav bar
The following code will add a 4 pixel deep blue border below your navigation bar
UINavigationBar* navBar = self.navigationController.navigationBar;
int borderSize = 4;
UIView *navBorder = [[UIView alloc] initWithFrame:CGRectMake(0,navBar.frame.size.height-borderSize,navBar.frame.size.width, borderSize)];
[navBorder setBackgroundColor:[UIColor blueColor]];
[self.navigationController.navigationBar addSubview:navBorder];
I found a couple of issues with the previous answers:
One way of solving this would be to use autolayout:
extension UINavigationBar {
func setBottomBorderColor(color: UIColor, height: CGFloat) -> UIView {
let bottomBorderView = UIView(frame: CGRectZero)
bottomBorderView.translatesAutoresizingMaskIntoConstraints = false
bottomBorderView.backgroundColor = color
self.addSubview(bottomBorderView)
let views = ["border": bottomBorderView]
self.addConstraints(NSLayoutConstraint.constraintsWithVisualFormat("H:|[border]|", options: [], metrics: nil, views: views))
self.addConstraint(NSLayoutConstraint(item: bottomBorderView, attribute: .Height, relatedBy: .Equal, toItem: nil, attribute: .NotAnAttribute, multiplier: 1.0, constant: height))
self.addConstraint(NSLayoutConstraint(item: bottomBorderView, attribute: .Bottom, relatedBy: .Equal, toItem: self, attribute: .Bottom, multiplier: 1.0, constant: height))
return bottomBorderView
}
}
The reason why I return the border is that during rotation you do see it in the middle of the navigation bar
, so I hide it during the rotation.
Despite navigationBar is read-only property for UINavigationController you can avoid this restriction by "setValue:forKey:". This method was approved on 5 applications successfully submitted to AppStore.
You can subclass UINavigationBar and change drawRect: method as you want. For example,
@implementation CustomNavigationBar
- (void) drawRect:(CGRect)rect
{
[super drawRect:rect];
UIImage *backgroundImage = ImageFromColor(WANTED_COLOR);
[backgroundImage drawInRect:rect];
}
After you can subclass UINavigationController and change initWithRootViewController:
- (id) initWithRootViewController:(UIViewController *)rootViewController
{
self = [super initWithRootViewController:rootViewController];
if (self)
{
CustomNavigationBar *navBar = [CustomNavigationBar new];
[self setValue:navBar forKey:@"navigationBar"];
}
return self;
}
Also you can vary this approach by making Category for UINavigationController and implementing method swizzling for initWithRootViewController:
P.S. Yesterday my new app appeared at AppStore without any problem with this approach.