How to remove UINavigationBar inner shadow in iOS 7?

21
votes

Inner shadow example

I'm trying to put nav bar below the other one to make it look like one tall nav bar. But in iOS 7 UINavigationBar now has inner shadow on top and on bottom of it. I really need to remove it. But I didn't found any solution. It looks like the shadow is prerendered, but in fact it slowly appears in about 0.4 second after the view appears.

I've tried almost everything but the shadow is still there. I removed the horizontal line below the bar with this code:

for (UIView *view in [[[self.navigationController.navigationBar subviews] objectAtIndex:0] subviews]) {
     if ([view isKindOfClass:[UIImageView class]]) view.hidden = YES;
}

But I can't figure it out how to remove the shadow. Thanks a lot!

I've tried this:

[self.navigationController.navigationBar setShadowImage:[[UIImage alloc] init]];

But that code doesn't even remove the horizontal line below the bar (this method needs custom background image). I use Xcode Version 5.0 (5A11365x)

6
uinavigationbarshadowios7
stackoverflow.com/tags/ios7/info, second paragraph. – CaptJak
@CaptJak your link doesn't provide any useful information (anymore?). I am interested to know more about why this is a bad idea. – Jarrod
@Jarrod, anymore is correct. I posted the comment in Aug, before iOS 7 was released. The second paragraph in the link stated that iOS 7 is under NDA. As it is no longer under NDA and there is also only one paragraph. The answer below concurs with the fact that answering this while under NDA is not a good idea. – CaptJak
@CaptJak ah yeah NDA. I took your comment to mean that removing the line was a bad idea. Thanks. – Jarrod
Thanks for the tip on how to remove line under nav bar! – Dannie P

6 Answers

56
votes

The "horizontal" line at the bottom of the navigation bar is simply it's shadowImage. It can simply be removed by applying an empty UIImage. According to the documentation you also have to set a custom background image:

- (void)viewDidLoad
{
    [super viewDidLoad];

    // Set the background and shadow image to get rid of the line.
    [self.navigationController.navigationBar setBackgroundImage:[[UIImage alloc] init] forBarMetrics:UIBarMetricsDefault];
    self.navigationController.navigationBar.shadowImage = [[UIImage alloc] init];
}
21
votes

I really shouldn't as CaptJak has pointed out but for anyone else who gets stuck: 

for (UIView *view in self.navigationController.navigationBar.subviews) {
    for (UIView *view2 in view.subviews) {
        if ([view2 isKindOfClass:[UIImageView class]]) {
            [view2 removeFromSuperview];
        }
    }
}

enter image description here

9
votes

In Swift (tested on iOS9)

self.navigationController!.navigationBar.setBackgroundImage(UIImage(), forBarMetrics: .Default)
self.navigationController!.navigationBar.shadowImage = UIImage()
0
votes

If your app support only iOS 6.0+, you can simply add below line:

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
...
[[UINavigationBar appearance] setShadowImage:[UIImage new]];
...
}
0
votes

I had a similar problem, where I wanted to remove the 1px line and the shadow from the navigation bar on iOS7. In my case, I needed a 3 points thick green line at the bottom of the navigation bar.

If there is a solution to get rid of the 1px line at the bottom of the navigation bar that doesn't involve traversing subviews, I don't know, but there is a way to add a view that hides that line as follows (at least the color of the line can be changed that way).

UIView * bgView = [[UIView alloc] initWithFrame:CGRectMake(0, navBarHeight, navBarWidth, 1)]; // Dont use magic numbers in your code
bgView.backgroundColor = //some other color
[navigationBar addSubview:bgView];
[navigationBar setShadowImage:nil];
0
votes

You can easily use this UInavigationBar category called UINavigationBar-Addition found here I have used the solution described in this answer but I couldn't get rid of the 1Px line under navigationBar