ios基础篇（九）——自定义UITabBar

上一篇讲到了UITabBarViewController，接着说说UITabBarViewController中怎么自定义TabBar.

今天仿写了微博，发现底部tabbar中间的button和其他有所不同，button较大且着色；而且我们平时工作中也有很多类似这样的问题，有些app有一个看起来像标准 tabBarController，但是呢，tabBar的中间是凸起的或者着色的。我们怎样做可以构建这种现实效果呢？

如图：

这些标签栏除了中间项以外看起来都相当的标准，所以我们会从一个标准的包含一个tabBar的UITabBarController开始；查看应用内的图片，显而易见的是中间的标签是一个简单的自定义button，一个UITabBar 包含了一个UITabBaritems的数组，UITabBaritem继承自UIBarItem。但是和同样继承自UIBarItem的UIBarButtonItem不同，苹果官方没有提供给UITabBarItem创建自定义视图的api。

我们的基本方案是子类化UITabBarController然后添加一个自定义的button再UITabBar上面。

代码实现：(这里我用第二张图片举例)

 //
 //  TabBarViewController.m
 //  WeiBo
 //
 //  Created by Oran Wu on 15-11-18.
 //  Copyright (c) 2015年 Xinxin. All rights reserved.
 //

 #import "TabBarViewController.h"
 #import "ViewAdditions.h"
 #import "AddViewController.h"

 @interface TabBarViewController ()<UITabBarControllerDelegate>{

     UITabBar *tabBar;
     UIImageView *tabBarView;
     UIButton *lastSelectedButton;

     UILabel *titleLabel;

 }

 @end

 @implementation TabBarViewController

 - (void)viewDidLoad {
     [super viewDidLoad];
     // Do any additional setup after loading the view.

     //把原tabBar隐藏
     self.tabBar.hidden = YES;

     //在底部创建一个tabBarView替代原tabBar
     tabBarView =[[UIImageView alloc] initWithFrame:(CGRect){,self.view.height-,self.view.width,}];
     [self.view addSubview:tabBarView];
     //可交互
     tabBarView.userInteractionEnabled = YES;

     //创建常见的四个tabBarButton
     [self creatButtonWithNormalName:@"tabbar_home" andSelectedName:@"tabbar_home_selected" andTitle:@"首页" andIndex:];
     [self creatButtonWithNormalName:@"tabbar_message_center" andSelectedName:@"tabbar_message_center_selected" andTitle:@"消息" andIndex:];
     [self creatButtonWithNormalName:@"tabbar_discover" andSelectedName:@"tabbar_discover_selected" andTitle:@"发现" andIndex:];
     [self creatButtonWithNormalName:@"tabbar_profile" andSelectedName:@"tabbar_profile_selected" andTitle:@" 我" andIndex:];
     [self creatCenterButton:@"jia"];

     //这里用了通知，切换页面时用来隐藏tabBar
     [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(hideTabbar:) name:@"HideTabbar" object:nil];
     [[NSNotificationCenter defaultCenter] addObserver:self selector:@selector(showTabbar) name:@"ShowTapBar" object:nil];
 }

 - (void)hideTabbar:(NSNotification *)notification{
  //   NSNumber *number = notification.object;

     tabBarView.hidden = YES;
 }

 - (void)showTabbar{

     tabBarView.hidden = NO;
 }

 //自定义方法用来设置button两种状态的图片
 - (void)creatButtonWithNormalName:(NSString*)normal andSelectedName:(NSString*)selected andTitle:(NSString*)title
 andIndex:(int)index{

     //初始化button
     UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
     button.tag = index+;

     CGFloat buttonWidth = tabBarView.width/;
     CGFloat buttonHeight = tabBarView.height;
     //设置button位置及大小，注意：要留出中间特殊button的位置
     if (index<) {
          button.frame = (CGRect){+*index,,buttonWidth,buttonHeight};
     }else
         button.frame = (CGRect){+*(index+),,buttonWidth,buttonHeight};

     [button setImage:[UIImage imageNamed:normal] forState:UIControlStateNormal];
     [button setImage:[UIImage imageNamed:selected] forState:UIControlStateSelected];

     //设置buttonLabel（tabBar的文字）
     [button.titleLabel setFont:[UIFont systemFontOfSize:]];
     [button setTitle:title forState:UIControlStateNormal];
     [button setTitleColor:[UIColor colorWithWhite:0.5 alpha:] forState:UIControlStateNormal];
     [button setTitleColor:[UIColor orangeColor] forState:UIControlStateSelected];

     [button setTitleEdgeInsets:(UIEdgeInsets){, -, , }];

     //button动作
     [button addTarget:self action:@selector(changeViewController:) forControlEvents:UIControlEventTouchUpInside];
     button.imageView.contentMode =UIViewContentModeCenter;
     [tabBarView addSubview:button];

     UIButton *bt = tabBarView.subviews[];
     [self changeViewController:bt];

 }

 - (void)creatCenterButton:(NSString*)centerImage{

     //初始化中间特殊button
     UIButton *centerButton = [UIButton buttonWithType:UIButtonTypeCustom];
     //位置及大小
     centerButton.frame = (CGRect){,,,tabBarView.height-};
     //图片
     [centerButton setImage:[UIImage imageNamed:centerImage] forState:UIControlStateNormal];
     //动作
     [centerButton addTarget:self action:@selector(addViewController) forControlEvents:UIControlEventTouchUpInside];
     //加到tabBarView上
     [tabBarView addSubview:centerButton];

 }

 //换页和button的动作关联上
 - (void)changeViewController:(UIButton*)button {

     if (self.selectedIndex == button.tag-) {
         return;
     }

     self.selectedIndex = button.tag-;

     button.selected = YES;

     if (lastSelectedButton != button) {
         lastSelectedButton.selected = NO;
     }
     lastSelectedButton = button;

     self.tabBarController.selectedViewController = [self.tabBarController.viewControllers objectAtIndex:self.selectedIndex];

 }

 //中间button点击动作
 - (void)addViewController{
     AddViewController *AddVC = [[AddViewController alloc] init];
     [self presentViewController:AddVC animated:YES completion:nil];

 }