IOS UITabBar+UINavigation(改变背景/标题文字颜色、状态图片、tabbar选中方形背景、item间距)

基本属性

上导航栏高度：44

状态栏高度：20

下导航栏高度：49

下导航栏图片大小：22px * 22px

iOS7新引入的区别

iOS7中系统自带的上下导航栏当没有设置背景图的时候自带半透明+玻璃磨砂效果。这种磨砂效果是很难自己实现的。所以如果想要保留这种效果，就不要自定义上下导航栏。

关于自定义上导航栏的是否是自定义的判断：用手势慢慢切换两个View，如果导航栏的按钮自己渐变消失，那么是系统的上导航；如果整个导航栏随着整个View整体滑动，并且能看到清晰边界，那么是自定义导航栏。

系统导航栏的弊端是：上导航栏左侧的按钮的相应区域会很大，即向右侧和下侧扩展，右侧的扩展可以通过给Button下面嵌套一个不能相应事件的UIVIew来规避；而下侧的区域则无法规避，这是苹果为了使得相应区域更大一点，利于用户点击造成的。这本来无可厚非，但是如果我们的设计中，如果紧贴着上导航栏下面安排了点击区域，那么会严重影响这些点击区域的相应范围，一般的情况下，紧贴上导航栏左侧的按钮会无法点击，这时候只能通过替换系统的上导航栏为自定义上导航栏来实现。

自定义导航栏的弊端是：无法实现半透明玻璃磨砂效果，无法通过简单地属性设置实现UITableView的透过上导航栏的效果。这是由于UITableView在iOS7中新增属性的使用限制造成的。

iOS7引入后，苹果的本意是让大家充分利用上下导航栏的空间。在上下导航栏存在的时候，如果尝试获取其中的UIViewController的view大小，iOS6和iOS7上面会有不同的表现：

iOS6中，给出的区域会去除导航栏；而在iOS7中则会包括导航栏 + 状态栏的区域。

iOS7中对于状态栏和导航栏的半透明效果利用

为了在iOS7中充分利用状态栏、导航栏的半透效果，苹果给UIController新增了几个属性，用于自动设置它的View透过导航栏的方式。

1 2 3 4 5 6

Specifies whether or not the view controller should automatically adjust its scroll view insets .   @ property ( nonatomic , assign ) BOOL automaticallyAdjustsScrollViewInsets Discussion   Default value is YES , which allows the view controller to adjust its scroll view insets in response to the screen areas consumed by the status bar , navigation bar , and toolbar or tab bar . Set to NO if you want to manage scroll view inset adjustments yourself , such as when there is more than one scroll view in the view hierarchy .

该属性可以设置UIScrollView的显示，当设置为YES的时候，UIScrollView及其子类半透穿过导航栏及状态栏显示内容。
这个属性通过设置UIScrollView的contentInset和scrollIndicatorInsets来实现，但是当UIScrollView拥有兄弟View的时候会失效，这时候，我们可以通过主动设置这2个Inset来达到相同目的。这时候应该注意：上边是64(44 + 20)，下边是49。

1 2 3 4 5 6

edgesForExtendedLayout Indicates the extended edges to use for the layout .   @ property ( nonatomic , assign ) UIRectEdge edgesForExtendedLayout Discussion Default value is UIRectEdgeAll .

这个属性用来设置UIViewController的view在哪个方向上做穿透导航栏的实现。可以设置的有上导航和下导航。可以搭配上一个属性使用。

1 2 3 4 5 6

extendedLayoutIncludesOpaqueBars Indicates whether or not the extended layout includes opaque bars .   @ property ( nonatomic , assign ) BOOL extendedLayoutIncludesOpaqueBars Discussion Default value is NO .

当设置了背景图后，导航栏会变得不再透明，而此属性可以设置这时候UIViewController的view是否仍然做和半透明同样的扩展设置。

UITabBarController简单使用

UITabBarController和UINavigationController类似,UITabBarController也可以轻松地管理多个控制器,轻松完成控制器之间的切换,典型的例子就是QQ、微信等应⽤。

1.使用步骤：

（1）初始化UITabBarController

（2）设置UIWindow的rootViewController为UITabBarController

（3）创建相应的子控制器（viewcontroller）

（4）把子控制器添加到UITabBarController

2.代码示例

新建一个空的文件，在Application的代理中编码

YYAppDelegate.m文件

复制代码代码如下:

//
//  YYAppDelegate.m
//  01-UITabBar控制器基本使用
//
//  Created by 孔医己 on 14-6-7.
//  Copyright (c) 2014年 itcast. All rights reserved.
//

#import "YYAppDelegate.h"

@implementation YYAppDelegate

- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
    //1.创建Window
    self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
    self.window.backgroundColor = [UIColor whiteColor];
    
    //a.初始化一个tabBar控制器
    UITabBarController *tb=[[UITabBarController alloc]init];
    //设置控制器为Window的根控制器
    self.window.rootViewController=tb;
    
    //b.创建子控制器
    UIViewController *c1=[[UIViewController alloc]init];
    c1.view.backgroundColor=[UIColor grayColor];
    c1.view.backgroundColor=[UIColor greenColor];
    c1.tabBarItem.title=@"消息";
    c1.tabBarItem.image=[UIImage imageNamed:@"tab_recent_nor"];
    c1.tabBarItem.badgeValue=@"123";
    
    UIViewController *c2=[[UIViewController alloc]init];
    c2.view.backgroundColor=[UIColor brownColor];
    c2.tabBarItem.title=@"联系人";
    c2.tabBarItem.image=[UIImage imageNamed:@"tab_buddy_nor"];
    
    UIViewController *c3=[[UIViewController alloc]init];
    c3.tabBarItem.title=@"动态";
    c3.tabBarItem.image=[UIImage imageNamed:@"tab_qworld_nor"];
    
    UIViewController *c4=[[UIViewController alloc]init];
    c4.tabBarItem.title=@"设置";
    c4.tabBarItem.image=[UIImage imageNamed:@"tab_me_nor"];
   
    
    //c.添加子控制器到ITabBarController中
    //c.1第一种方式
//    [tb addChildViewController:c1];
//    [tb addChildViewController:c2];
    
    //c.2第二种方式
    tb.viewControllers=@[c1,c2,c3,c4];
    
    
    //2.设置Window为主窗口并显示出来
    [self.window makeKeyAndVisible];
    return YES;
}

@end

实现效果：

三、重要说明

1.UITabBar

下方的工具条称为UITabBar ，如果UITabBarController有N个子控制器,那么UITabBar内部就会有N 个UITabBarButton作为子控件与之对应。

注意：UITabBarButton在UITabBar中得位置是均分的，UITabBar的高度为49。

在上面的程序中，UITabBarController有4个子控制器,所以UITabBar中有4个UITabBarButton，UITabBar的结构⼤大致如下图所示：

2.UITabBarButton

UITabBarButton⾥面显⽰什么内容,由对应子控制器的tabBarItem属性来决定

 c1.tabBarItem.title=@"消息";
 c1.tabBarItem.image=[UIImage imageNamed:@"tab_recent_nor"];

3.有两种方式可以往UITabBarController中添加子控制器

（1）[tb addChildViewController:c1];

（2）tb.viewControllers=@[c1,c2,c3,c4];

注意：展示的顺序和添加的顺序一致，和导航控制器中不同，展现在眼前的是第一个添加的控制器对应的View。

2、UITabBarController、TabBar背景颜色设置、TabBarItem颜色处理

转自:http://www.jianshu.com/p/cf9db8bc057c

所以直接通过[[UITabBar appearance] setBackgroundColor:[UIColor redColor]];(此处写错，应该是[[UITabBar appearance] setBarTintColor:[UIColor redColor]];在demo中是写对的，只是这里写错了)。来改变tabar的颜色是不能得到想要的颜色的。如果想要得到想要的颜色需要再另外添加一句：[UITabBar appearance].translucent = NO;这句表示取消tabBar的透明效果。

第二种方法是你可以在tabBar上添加一个有颜色的View：

这样也可以实现相同的效果

还有第三种方法就是使用背景图片：

[[UITabBar appearance] setBackgroundImage:[UIImage imageNamed:@"tabBarBackgroundImage"]];

[UITabBar appearance].translucent = NO;

但同样需要[UITabBar appearance].translucent = NO;

接下来需要处理的第二个问题就是：tabBarItem

设置tabBarItem

首先很多运用中需要在点击某个item后，需要改变背景色，可以通过tabBar的selectionIndicatorImage属性来实现。

第一种方式就是让美工切出符合的图直接放上去，但这种方式美工需要切多个不同尺寸的图，不方便，如果背景色改变，全部图又要重新切，很麻烦。

第二种方式就是自己画，画好后，如果背景色需要改变只需要修改颜色就可以了，不用切图代码实现：

现在选中颜色已经改变了，如图：

好了，tabBarItem的选中时的背景颜色已经弄好了。解决下一个问题

tabBarItem图标文字颜色修改

应该发现了tabBarItem的图标和文字的默认颜色是灰色，选中颜色是蓝色。这是系统默认给图标、文字修改成了灰色和蓝色。如果要改变选中item的颜色可以直接使用tabBar的tintColor来实现，但是如果图标换成别的颜色了又要重新修改tintColor，很不方便。所以重写一个继承与UITabBarItem的自定义类，在initWithCoder:方法中实现如下代码:

mostColorWithImage:方法是自定义的获取图片主颜色的方法，具体代码：

修改BarItem间距

http://m.blog.csdn.net/article/details?id=51336425

navigationbar弄成透明的而不是带模糊的效果？

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

类似天猫和网易新闻的导航控制器的pop效果：ZFNavigationController

 http://www.open-open.com/lib/view/open1450623346597.html