网上看了很多有关于透明导航栏的,单单设置透明导航栏没什么问题,也就几句代码
先了解一下相关知识点吧 UINavigationBar知识点
- 设置导航栏透明只需要两步,我已经写成一个UINavigationBar分类 传送门
1、调用navigationController.navigationBar 的 setBackgroundImage 方法,利用颜色创建一个image对象(利用上下文绘制很容易)
2、隐藏导航栏下面的分割线:navigationController.navigationBar.shadowImage = [UIImage new];只需要给一个iamge对象就行
- 主要出现问题的地方是:透明导航栏 - push -> 非透明导航栏
1.gif
如图:第一个个控制器我是实现了透明导航栏,下一个控制器设置导航栏颜色为橙色,当我push到secondVc 的时候,firstVc的导航栏也变了,这个没啥好解释的,因为共用一个导航控制器嘛~~~
- 那么如何实现这个功能呢?
通过自定义modal动画,模仿push动画,modal一个新的导航控制器,这个迟点会另开文章说明 传送门
还是使用push,网上也有很多实现的方法,貌似都挺麻烦的,有截图掩饰的、自定义整个NavigationBar的等等,大家有兴趣就去翻翻呗,这里就不多作介绍
通过继承,在父类中默认实现了透明导航栏创建一个UIView,就是一个假的UINavigationBar,对外提供一个API 设置其颜色,在setter里面设置给这个view
.h 文件
/**
* @author 孔凡列, 16-09-01 09:09:44
*
* 默认clearColor,即透明,设置颜色为非透明
*/
@property (nonatomic,strong)UIColor *fl_navBarColor;
.m 文件
/**
* @author 孔凡列, 16-09-01 10:09:38
*
* 假的UINavigationBar
*/
@property (nonatomic,strong)UIView *navBar;
- (void)viewDidLoad {
[super viewDidLoad];
// key code
[self.navigationController.navigationBar setBackgroundImage:[self createImageWithColor:[UIColor clearColor]] forBarMetrics:UIBarMetricsDefault];
self.automaticallyAdjustsScrollViewInsets = NO;
[self.view addSubview:self.navBar];
}
- (void)viewWillAppear:(BOOL)animated {
[super viewWillAppear:animated];
//去掉分割线
self.navigationController.navigationBar.shadowImage = [UIImage new];
}
#pragma mark -- private method
- (UIImage *)createImageWithColor:(UIColor *)color {
CGRect rect = CGRectMake(0.0f, 0.0f, 1.0f, 1.0f);
UIGraphicsBeginImageContext(rect.size);
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSetFillColorWithColor(context, [color CGColor]);
CGContextFillRect(context, rect);
UIImage *theImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return theImage;
}
#pragma mark -- Setter & Getter
- (UIView *)navBar{
if (_navBar == nil) {
_navBar = [[UIView alloc] init];
_navBar.frame = CGRectMake(0, 0, self.view.bounds.size.width, 64);
_navBar.alpha = 0.0;
}
return _navBar;
}
- (void)setFl_navBarColor:(UIColor *)fl_navBarColor{
_fl_navBarColor = fl_navBarColor;
self.navBar.backgroundColor = fl_navBarColor;
self.navBar.alpha = 1.0;
[self.view bringSubviewToFront:self.navBar];
}
此时外界只需要继承-然后设置fl_navBarColor相应的颜色就OK啦,一句代码搞定,爽
效果图如下:对于gitHub地址 一句代码实现 gitHub上添加了swift版,喜欢就给个star吧
2.gif
2016.9.22更新:此时fl_navBarColor 设置颜色必须是在添加所有控件之后设置,适配横屏,注意横屏的时候frame要做处理,可参看我之前写的一篇:iOS 指定控制器 横屏 一句代码都不用写~