iOS UINavigationBar

一、导航栏外观

外观	属性
bar的样式	barStyle
bar的透明度	translucent
bar的颜色	barTintColor
bar上控件的颜色	tintColor
bar的背景图片	backgroundImage

二、导航栏内容

内容	属性
标题	title
标题视图	titleView
左侧按钮	leftBarButtonItem
右侧按钮	rightBarButtonItem
返回按钮	backBarButtonItem
返回按钮指示图像	backIndicatorImage
返回按钮遮罩图像	backIndicatorTransitionMaskImage

第三、效果显示

• 给viewController添加一个导航栏，默认效果如下：

  
  
  

  默认效果.png

• 默认添加一个子视图

-(void)test1{
    //默认样式
    self.navigationController.navigationBar.barStyle = UIBarStyleDefault;
    //默认透明度为透明[此时添加的控件frame从屏幕最上方开始算起]
    self.navigationController.navigationBar.translucent = YES;
    
    UIView * showView = [[UIView alloc]initWithFrame:CGRectMake(100, 0, 200, 200)];
    showView.backgroundColor = [UIColor purpleColor];
    [self.view addSubview:showView];
}

默认添加效果.png

、

• 透明度为不透明

//设置导航栏的barStyle和translucent
-(void)test2{
    //默认样式
    self.navigationController.navigationBar.barStyle = UIBarStyleDefault;
    //透明度为不透明[此时添加的控件frame从导航栏下面开始算起]
    self.navigationController.navigationBar.translucent = NO;
    
    UIView * showView = [[UIView alloc]initWithFrame:CGRectMake(100, 0, 200, 200)];
    showView.backgroundColor = [UIColor purpleColor];
    [self.view addSubview:showView];
   
}

不透明.png

• edgesForExtendedLayout

self.edgesForExtendedLayout = UIRectEdgeNone;

透明2.png

第四、导航栏的颜色设置：barTintColor

self.navigationController.navigationBar.barTintColor = [UIColor purpleColor];

bar颜色.png

第五、导航栏的控件颜色设置[默认为蓝色]tintColor

self.navigationController.navigationBar.tintColor = [UIColor redColor];

第六、设置背景图片背景图片不同的size会展示不同的效果

backgroundImage 
64像素时，会包含状态栏
44像素时，只包含导航栏 
小于44时，会叠满状态栏和导航栏

[self.navigationController.navigationBar setBackgroundImage:[UIImage imageNamed:@"图片名"] forBarMetrics:UIBarMetricsDefault];

第七、UIBarButtonItem

• 初始化的变化

1、initWithBarButtonSystemItem: target:  action: 
系统提供样式改变  

UIBarButtonItem * right = [[UIBarButtonItem alloc]initWithBarButtonSystemItem:UIBarButtonSystemItemFastForward target:self action:@selector(pushNextController)];
self.navigationItem.rightBarButtonItem = right;

-(void)pushNextController{
    SecondViewController * secondVc = [[SecondViewController alloc]init];
    [self.navigationController pushViewController:secondVc animated:YES];
}

初始化一.png

2、initWithTitle: style: target: action: 
style设置为UIBarButtonItemStylePlain 

//使用title初始化，style不能使用边框类型   
UIBarButtonItem * right = [[UIBarButtonItem alloc]initWithTitle:@"Right" style:UIBarButtonItemStylePlain target:self action:@selector(pushNextController)];
self.navigationItem.rightBarButtonItem = right;

初始化二.png

3、initWithImage: style: target: action: 
图像需要进行渲染，默认渲染成模版  

//默认---渲染为模版时
UIBarButtonItem * right = [[UIBarButtonItem alloc]initWithImage:[UIImage imageNamed:@""] style:UIBarButtonItemStylePlain target:self action:@selector(pushNextController)];

//渲染为原图
UIBarButtonItem * right = [[UIBarButtonItem alloc]initWithImage:[[UIImage imageNamed:@""] imageWithRenderingMode: UIImageRenderingModeAlwaysOriginal] style:UIBarButtonItemStylePlain target:self action:@selector(pushNextController)];

第八、设置title和titleView

//设置title
self.navigationItem.title = @"title";

设置titleView
self.navigationItem.titleView = [UIButton buttonWithType:UIButtonTypeContactAdd];

titleView.png

//导航栏的控件颜色设置[默认为蓝色]
self.navigationController.navigationBar.tintColor = [UIColor whiteColor];

self.navigationItem.titleView = [UIButton buttonWithType:UIButtonTypeContactAdd];

titleView2.png

第九、导航栏设置backBarButtonItem

• 没有title，默认显示back
• 设置title，显示title的内容

self.navigationItem.backBarButtonItem = [[UIBarButtonItem alloc]initWithTitle:@"回去" style:UIBarButtonItemStylePlain target:nil action:nil];

back.png

补充

导航栏中设置控件的image对象都需要进行渲染设置
默认是渲染为模版，需要渲染为原图才能正常显示。