How do I disable the navigation bar shadow in iOS 6 for navigation bars with custom background images?

Question

It seems in iOS 6, a drop shadow is automatically added to the navigation bar even when you set a custom background image. I'm pretty sure this wasn't the case with iOS 5 as when I test the same code in the iOS 5 and 6 sim, the shadow appears in iOS 6 but not 5.

Does anyone know anything about this? Or how to enable/disable it?

iOS 6 is beta, pre-release software and I'm pretty sure that it's under NDA right now. — Alladinian, Jun 18 '12 at 13:57
I would delete this question to avoid getting all the NDA comments and post it on the dev forums provided by Apple for pre-release software. https://devforums.apple.com/community/ios — Bill Burgess, Jun 18 '12 at 14:23
David is right - the UI customisation video covers this exact topic. — Cthutu, Oct 22 '12 at 19:45

score 141 · Accepted Answer · edited Dec 26 '22 at 01:29

141

Place this in your AppDelegate

[[UINavigationBar appearance] setShadowImage:[UIImage new]];
// is IOS 7 and later
[[UINavigationBar appearance] setBackgroundImage:[UIImage new] forBarMetrics:UIBarMetricsDefault];

Swift version with updates from comments

    UINavigationBar.appearance().shadowImage = UIImage()
    UINavigationBar.appearance().setBackgroundImage(UIImage(), forBarMetrics: .Default)

edited Dec 26 '22 at 01:29

starball

20,030
7
43
238

answered Nov 09 '12 at 19:12

Kevin Fernandes

1,442
1
10
2

15

NOTE: For a custom shadow image to be shown, a custom background image must also be set with the setBackgroundImage:forBarMetrics: method. If the default background image is used, then the default shadow image will be used regardless of the value of this property. – Mike Pollard Jun 04 '13 at 19:10
1

This is the right answer. `self.navigationBar.shadowImage = nil;` doesn't have the same effect as the technique described in the answer. – bithavoc Jul 18 '13 at 23:07
You may want to add an autorelease to the [[UIImage alloc] init] – Bas Holtrop Oct 07 '13 at 18:57
6

@BasHoltrop Autorelease? The Medieval period is gone. :) – Rudolf Adamkovič Jul 17 '14 at 10:35
15

The complete solution for >= iOS7 is -- `[[UINavigationBar appearance] setShadowImage:[UIImage new]]; [[UINavigationBar appearance] setBackgroundImage:[UIImage new] forBarMetrics:UIBarMetricsDefault];` – gchbib Dec 19 '14 at 14:26
This helped me for **iPhone 6 Plus simulator** `[[UINavigationBar appearance] setBackgroundImage:[UIImage new] forBarMetrics:UIBarMetricsDefault];` – Almas Adilbek Apr 15 '15 at 15:15

score 57 · Answer 2 · answered Oct 14 '12 at 13:34

57

I know this has been solved with more complicated answers above, but this is the quickest and easiest way I hid the shadow under the navigation bar.

self.navigationController.navigationBar.clipsToBounds = YES;

answered Oct 14 '12 at 13:34

Hank Brekke

2,024
2
24
33

This works except during rotation, when the shadow returns. Dima Korbin's answer above seems to be the most complete fix. – janineanne Oct 16 '12 at 20:40
25

on iOS 7, this hides the status bar as well :( – d2burke Dec 05 '13 at 19:37
Works well, I had trouble with the other answers on an iOS 6 app that also works on iOS 7 :) – Jack Solomon Apr 05 '14 at 23:29

score 25 · Answer 3 · answered Apr 25 '13 at 09:19

Note from the Apple dev docs on the subject of the shadowImage property:

Discussion: The default value is nil, which corresponds to the default shadow image. When non-nil, this property represents a custom shadow image to show instead of the default. For a custom shadow image to be shown, a custom background image must also be set with the setBackgroundImage:forBarMetrics: method. If the default background image is used, then the default shadow image will be used regardless of the value of this property.

So to use the nil UIImage hack you must also be setting a custom nav bar background image. This can be a nil image too, which results in a nice flat, clean 'metro' style nav bar :

[[UINavigationBar appearance] setShadowImage:[[UIImage alloc] init]];
        [[UINavigationBar appearance] setBackgroundImage:[[UIImage alloc] init] forBarMetrics:UIBarMetricsDefault];

score 19 · Answer 4 · answered Sep 18 '12 at 10:09

19

Also you can try this:

controller.navigationBar.shadowImage = [[[UIImage alloc] init] autorelease];

controller is a UINavigationController.

answered Sep 18 '12 at 10:09

Dima Korbin

222
2
10

4

Remember this only works in iOS 6. From UINavigationBar.h: /* Default is nil. When non-nil, a custom shadow image to show instead of the default shadow image...*/ @property(nonatomic,retain) UIImage *shadowImage NS_AVAILABLE_IOS(6_0) UI_APPEARANCE_SELECTOR; – José M. Gilgado Dec 04 '12 at 07:35

score 7 · Answer 5 · answered Jul 08 '12 at 18:26

7

General, non-NDA-infringing answer:

If you don't want something sticking out of a layer, mask the layer to its bounds.

[self.layer setMasksToBounds:YES];

Set the height explicitly to 44 (or 32 for landscape on iPhone) if that doesn't work on its own.

answered Jul 08 '12 at 18:26

Steve Cotner

505
4
14

This solves the problem, but causes any UIBarButtonItems that "show touch on highlight" (the white glow) to be rendered incorrectly when tapped. – akaru Aug 03 '12 at 03:56
1

There is a better answer involving an image file, but that would be saying too much. – Steve Cotner Aug 13 '12 at 11:02
What property is that, layer? – marciokoko Aug 27 '13 at 20:24

score 6 · Answer 6 · answered Oct 31 '12 at 17:27

Setting the shadowImage to a null image does work, however, the way the solution is presented results in adding a property if the OS is earlier than iOS 6.

A better way to do something that is dependent on the existence of a property or method is:

if ([self.navigationController.navigationBar
respondsToSelector:@selector(shadowImage)]) {
self.navigationController.navigationBar.shadowImage = [[[UIImage alloc] init] autorelease];
}

eager · Answer 7 · 2013-01-28T19:29:21.523

There are two possible solutions, the second of which is mentioned in other answers.

Add a single, transparent, pixel at the bottom of your navigation bar background image, making it 45pt tall. This disables the shadows in iOS 6.

Implement the following code:

// Omit the conditional if minimum OS is iOS 6 or above
if ([UINavigationBar instancesRespondToSelector:@selector(setShadowImage:)]) {
    [[UINavigationBar appearance] setShadowImage:[[UIImage alloc] init]];
}

Source: Advanced Appearance Customization on iOS, @27:15

score 2 · Answer 8 · answered Sep 13 '13 at 07:39

Since self.navigationController.navigationBar.shadowImage = [[UIImage alloc] init]; not working, I've found an easy and workable way to remove the shadow of UINavigationBar in both iOS 6 AND iOS 5. Hope people who need can see this post.

All you have to do is prepare one background image that the height is 1 pixel larger than your navigation bar height (e.g. 320×45 for default UINavigationBar, 640×90 for 2x of course).

Then just use [[UINavigationBar appearance] setBackgroundImage: ...], you will find shadow is replaced by that 1 pixel. cheers!

BTW I found Twitter has done the exactly same thing, if you unzip Twitter.ipa and look into bg_nav_bar_events_dark.png, the size is 320×47. They made their own shadow for 3 pixels :)

score 1 · Answer 9 · answered Oct 30 '12 at 21:16

I cannot comment so I'll add my information here.

Perhaps the above suggestions worked in the beta, but it does not seem to be the case now.

self.navigationController.navigationBar.shadowImage = [[UIImage alloc] init];

The above does not work, neither do any of the other similar answers above. I have tried them all.

Clipping to bounds does work but doesn't give the result I want as I'd like other views to hang outside the nav bar.

score 1 · Answer 10 · answered Oct 16 '13 at 18:26

I came across this SO question when trying to get nav bars to look the same between iOS6 and iOS7.

The answer I found worked was simply to use:

    NSMutableDictionary *titleBarAttributes = [NSMutableDictionary dictionaryWithDictionary: [[UINavigationBar appearance] titleTextAttributes]];
    [titleBarAttributes setValue:[NSNumber numberWithInt:0] forKey:UITextAttributeTextShadowOffset];
    [[UINavigationBar appearance] setTitleTextAttributes:titleBarAttributes];

ie: set the shadow offset to zero.

score 1 · Answer 11 · answered Sep 29 '15 at 08:29

1

How about the alternative way:

UINavigationBar.appearance().barStyle = .Black

For the dark navigation bars iOS doesn't show the shadow.

answered Sep 29 '15 at 08:29

SoftDesigner

5,640
3
58
47

score 0 · Answer 12 · edited Oct 04 '12 at 22:05

0

I had the same problem and I've solved it by following:

CustomNavBar *navBar = (CustomNavBar *)self.navigationController.navigationBar;
        [navBar setBackgroundImage:[UIImage imageNamed:@"navigation_bar_gray.png"] forBarMetrics:UIBarMetricsDefault];
        navBar.shadowImage = [[UIImage alloc]init]; // this is what acctually removed the shadow under navigation bar

edited Oct 04 '12 at 22:05

Titouan de Bailleul

12,920
11
66
121

answered Oct 04 '12 at 07:18

Dejan Balaban

461
4
11

score 0 · Answer 13 · answered Oct 24 '16 at 08:50

0

In Swift 3.0 this would look like this

UINavigationBar.appearance().shadowImage = UIImage ()
UINavigationBar.appearance().setBackgroundImage(UIImage(), for: .default)

answered Oct 24 '16 at 08:50

Kumar C

525
6
21

How do I disable the navigation bar shadow in iOS 6 for navigation bars with custom background images?

13 Answers13

Swift version with updates from comments

Linked