导航栏背景色设置
2019-01-12 本文已影响17人
追逐你的影子
比较简单的方式是,直接设置导航栏的tintColor 如下:
self.navigationBar.barTintColor = [UIColor orangeColor];
barTintColor.png
但设置后会发现,实际显示的颜色与自定义的颜色会有误差。
问题原因:默认情况下,在 navigationBar 的上面还覆盖着一个 visualeffectView,它会对导航栏背景进行模糊渲染,从而造成颜色变化。要解决这个问题,有如下两种方法:
方法一
设置导航栏的背景图片(backgroundImage),那么 barTintColor 就会自动失效。注意:设置导航栏的背景图片后,布局就会从导航栏下面开始了(控制器的 view会下移(64或88)) 。如下图:
9D766E8E-42D8-4767-9398-49B781A8C0AE.png
导航栏控制器代码
- (void)viewDidLoad {
[super viewDidLoad];
self.navigationBar.barTintColor = [UIColor blueColor];
UIImage *image = [self imageWithColor:[UIColor orangeColor]];
[self.navigationBar setBackgroundImage:image forBarMetrics:UIBarMetricsDefault];
}
// 根据颜色生成UIImage
- (UIImage*)imageWithColor:(UIColor*)color{
CGRect rect = CGRectMake(0.0f, 0.0f, 1.0f, 1.0f);
// 开始画图的上下文
UIGraphicsBeginImageContext(rect.size);
// 设置背景颜色
[color set];
// 设置填充区域
UIRectFill(CGRectMake(0, 0, rect.size.width, rect.size.height));
// 返回UIImage
UIImage* image = UIGraphicsGetImageFromCurrentImageContext();
// 结束上下文
UIGraphicsEndImageContext();
return image;
}
视图控制器代码
- (void)viewDidLoad {
[super viewDidLoad];
CGFloat width = [UIScreen mainScreen].bounds.size.width;
self.navigationItem.title = @"导航栏";
UIView *view2 = [[UIView alloc] initWithFrame:CGRectMake(0, 100, width, 40)];
view2.backgroundColor = [UIColor greenColor];
[self.view addSubview:view2];
}
方法二
设置导航栏的translucent设置为NO能达到同样的效果。(同样控制器的 view会下移(64或88)) 。如下图:
9D766E8E-42D8-4767-9398-49B781A8C0AE.png
导航栏控制器代码
- (void)viewDidLoad {
[super viewDidLoad];
self.navigationBar.barTintColor = [UIColor orangeColor];
self.navigationBar.translucent = NO;
}