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透过导航栏的方式。

123456

Specifies whether or not the view controller should automatically adjust its scroll view insets. @property(nonatomic, assign) BOOL automaticallyAdjustsScrollViewInsetsDiscussion 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 Indicatestheextendededgestouseforthelayout.   @property(nonatomic,assign)UIRectEdgeedgesForExtendedLayout Discussion DefaultvalueisUIRectEdgeAll.

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

1 2 3 4 5 6

extendedLayoutIncludesOpaqueBars Indicateswhetherornottheextendedlayoutincludesopaquebars.   @property(nonatomic,assign)BOOLextendedLayoutIncludesOpaqueBars Discussion DefaultvalueisNO.

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

[b]UITabBarController简单使用[/b]

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