如何为UINavigation bar添加阴影效果

Question

你好，我想为我的NavigationBar添加这种阴影效果。我该怎么做呢？

以下是我尝试添加阴影的方式：

[self.navigationController.navigationBar setBackgroundImage:[UIImage new] forBarMetrics:UIBarMetricsDefault];
self.navigationController.navigationBar.shadowImage=[UIImage new];

self.navigationController.navigationBar.translucent=YES;

self.navigationController.navigationBar.topItem.titleView.tintColor=[UIColor whiteColor];
self.navigationController.navigationBar.titleTextAttributes=[NSDictionary dictionaryWithObject:[UIFont fontWithName:@"HelveticaNeue" size:15.0f] forKey:NSFontAttributeName];
self.navigationController.navigationBar.topItem.title=strNavigtionTitle;
self.navigationController.navigationBar.titleTextAttributes = [NSDictionary dictionaryWithObject:[UIColor whiteColor] forKey:NSForegroundColorAttributeName];
self.navigationItem.leftBarButtonItem = [[UIBarButtonItem alloc] initWithImage:[UIImage imageNamed:@"backarrow"] style:UIBarButtonItemStylePlain target:self action:@selector(revealToggle :)];
[self.navigationController navigationBar].tintColor = [UIColor whiteColor];

[self.navigationController navigationBar].layer.shadowColor=[UIColor colorWithRed:53.0/255.0 green:108.0/255.0 blue:130.0/255.0 alpha:1.0f].CGColor;
[self.navigationController navigationBar].layer.shadowOffset=CGSizeMake(0, 20);
[self.navigationController navigationBar].layer.shadowOpacity=0.8;
[self.navigationController navigationBar].layer.shadowRadius=5.5;

但这只是为箭头和我的“申请请假”标题添加了一个阴影。但我想添加一个像这张图片中那样的投影，它应该位于NavigationBar和我的主要UIView之间。我该怎么做？请帮帮我。 谢谢

- user1960169

---

你能展示一下你的输出图像吗？ - Balaji Kondalrayal

我会要求合作伙伴给我一张带有阴影的背景图片。 - AechoLiu

导航栏的背景图片？ - user1960169

Answer 1

在这里，您需要导入QuartzCore框架。

self.navigationController.navigationBar.layer.borderColor = [[UIColor whiteColor] CGColor];
self.navigationController.navigationBar.layer.borderWidth = 2; //Set border you can see the shadow 
self.navigationController.navigationBar.layer.shadowColor = [[UIColor blackColor] CGColor];
self.navigationController.navigationBar.layer.shadowOffset = CGSizeMake(1.0f, 1.0f);
self.navigationController.navigationBar.layer.shadowRadius = 3.0f;
self.navigationController.navigationBar.layer.shadowOpacity = 1.0f;
self.navigationController.navigationBar.layer.masksToBounds = NO;

另外一件事情 你必须

set self.layer.masksToBounds = NO;

该属性的默认值为YES，这意味着即使阴影被渲染出来，也不会在视图范围之外渲染，这实际上意味着您根本看不到它。

如果您以任何方式对此视图进行动画处理，还应添加此行：

self.layer.shouldRasterize = YES;

- tania_S

---

这将阴影添加到导航栏标题和箭头图标，而不是整个栏。 - user1960169

是的，我将 masksToBounds 设置为 NO。 - user1960169

我应该如何更改导航栏的外观？我所做的是否正确？ - user1960169

self.navigationController.navigationBar.layer.borderColor = [[UIColor whiteColor] CGColor]; self.navigationController.navigationBar.layer.borderWidth=2; 设置边框，你可以看到阴影。 - tania_S

谢谢！正是我想要的。 - Sylar

Answer 2

self.navigationController.navigationBar.layer.shadowColor = [[UIColor blackColor] CGColor];
self.navigationController.navigationBar.layer.shadowOffset = CGSizeMake(2.0f, 2.0f);
self.navigationController.navigationBar.layer.shadowRadius = 4.0f;
self.navigationController.navigationBar.layer.shadowOpacity = 1.0f;

- vaibby

---

如果导航栏是半透明的，这段代码会将阴影应用到文本和按钮图标上。 - MLBDG

Answer 3

我可以通过以下方式实现。我删除了导航栏的阴影效果，取而代之地在导航栏下方添加一个相同大小的视图。将该视图的背景颜色设置为导航栏颜色。然后为该视图添加阴影效果。这样做非常完美。

-(void)setupNavigationBar
{
    [self.navigationController.navigationBar setBackgroundImage:[UIImage new] forBarMetrics:UIBarMetricsDefault];
    self.navigationController.navigationBar.shadowImage=[UIImage new];

    self.navigationController.navigationBar.translucent=YES;
    self.navigationController.navigationBar.topItem.titleView.tintColor=[UIColor whiteColor];
    self.navigationController.navigationBar.titleTextAttributes=[NSDictionary dictionaryWithObject:[UIFont fontWithName:@"HelveticaNeue" size:15.0f] forKey:NSFontAttributeName];
    self.navigationController.navigationBar.topItem.title=strNavigtionTitle;
    self.navigationController.navigationBar.titleTextAttributes = [NSDictionary dictionaryWithObject:[UIColor whiteColor] forKey:NSForegroundColorAttributeName];
    self.navigationItem.leftBarButtonItem = [[UIBarButtonItem alloc] initWithImage:[UIImage imageNamed:@"backarrow"] style:UIBarButtonItemStylePlain target:self action:@selector(revealToggle :)];
    [self.navigationController navigationBar].tintColor = [UIColor whiteColor];

    UIView *shadow=[[UIView alloc] initWithFrame:CGRectMake(0, 0, dm.screenWidth, 64)];
    [shadow setBackgroundColor:[UIColor colorWithRed:62.0/255.0 green:81.0/255.0 blue:119.0/255.0 alpha:1.0]];
    shadow.layer.shadowColor=[UIColor colorWithRed:51/255 green:76/255 blue:104/255 alpha:1.0].CGColor;
    shadow.layer.shadowOffset=CGSizeMake(0, 15);
    shadow.layer.shadowOpacity=0.12;
    shadow.layer.shadowRadius=4.5;
    [self.view addSubview:shadow];
}

- user1960169