最近在仿写这个软件，发现UITabBar不是使用的原生的。所以，需要自己去自定义

观察掌盟的UITabBar

观察官方的软件下面的tabBar，我们可以发现几点需要我们注意的
1. 当select一个tabBarItem时，图片会变大，然后文字也变大，同时字体的颜色也会变成红色
2. 在图片变大之前和之后，我们可以看到图片都已经超出了，tabBar的高度。这一点可以说明这几个tabBarItem并没有放在固定了高度的tabBar里面

思路

1. 如果，我们只放一个UIView在原生的UITabBar里面,然后将这几个按钮放在UIView中的话，图片肯定不能超出这个UIView的高度。所以这样不行
2. 然后，我思考既然高度已经超出了，但是这几个按钮还是放在一个UIView中，这个高度是能包含这几个按钮的最高的高度。
3. 但是，你可以看到这几个按钮的背景UIView的高度是没有这几个按钮高的。所以我们上面创建的UIView的颜色是clearColor

ok,我们在尝试着做下

• 既然要创建一个UITabBar,而我们要去管理这个tabBar.所以我们最好创建一个BMCustomTabBarController class继承于UITabBarController.好,直接上代码：

//  BMCustomTabBarController.m
//  BMLOL
//
//  Created by donglei on 2/27/16.
//  Copyright © 2016 donglei. All rights reserved.
//

#import "BMCustomTabBarController.h"
#import "BMTabBarBtn.h"


@interface BMCustomTabBarController()
@property(nonatomic,strong) UIView *transparenceView; // 透明的view
@property(nonatomic,strong) BMTabBarBtn *previewBtn; // 上一个被选中的按钮
@end

@implementation BMCustomTabBarController

-(void) viewDidLoad{
    [super viewDidLoad];


    //1>覆盖原生的tabbar

    UIView *coverTabBarView = ({
        UIView *view         = [[UIView alloc] init];
        view.backgroundColor = [UIColor colorWithRed:242/255.0 green:242/255.0 blue:242/255.0 alpha:1.0];

        [self.view addSubview:view];
        [view mas_makeConstraints:^(MASConstraintMaker *make) {
            make.left.equalTo(self.view.mas_left);
            make.bottom.equalTo(self.view.mas_bottom);
          make.width.equalTo(@(self.tabBar.frame.size.width));
            make.height.equalTo(@(self.tabBar.frame.size.height));
        }];
        view;
    }); //我们把这个view放在UITabBarController的view中，去显示那个灰色的背景
    [self.tabBar removeFromSuperview]; // 移除默认的tabbar





    //2>添加透明的view 方式图片和文字
    UIView *transparenceView  = ({
        UIView *view = [UIView new];
        [self.view addSubview:view];
        view.backgroundColor = [UIColor clearColor];

        [view mas_makeConstraints:^(MASConstraintMaker *make) {
            make.bottom.equalTo(self.view.mas_bottom);
            make.left.equalTo(self.view.mas_left);
            make.right.equalTo(self.view.mas_right);
            make.height.equalTo(@67);
        }];

        view;
    }); //这个view是clearColor主要的作用去承载那几个按钮
    _transparenceView = transparenceView;





    //3>创建4个按钮
    CGFloat singleBtnW = screenWidth/4;

    BMTabBarBtn *newsBtn= [BMTabBarBtn createBtnNormalImage:@"theme_spring_tab_news_normal" selectedImageName:@"theme_spring_tab_news_selected" title:@"咨询"];
    newsBtn.tag = 0; //设置tag，以便之后，点击按钮之后。进行控制器的切换
    newsBtn.selected = YES;   //默认 第一个是选中的
    _previewBtn = newsBtn; //保存一个被select的按钮，以便我们选中另一个按钮时，可以取消上一个按钮被选中的状态
    [self setBtnLayout:newsBtn marginLeft:0];


    BMTabBarBtn *friendBtn= [BMTabBarBtn createBtnNormalImage:@"theme_spring_tab_friend_normal" selectedImageName:@"theme_spring_tab_friend_selected" title:@"好友"];
    friendBtn.tag = 1;
    [self setBtnLayout:friendBtn marginLeft:1*singleBtnW];


    BMTabBarBtn *locateBtn= [BMTabBarBtn createBtnNormalImage:@"theme_spring_tab_locate_normal" selectedImageName:@"theme_spring_tab_locate_selected" title:@"发现"];
    locateBtn.tag = 2;
    [self setBtnLayout:locateBtn marginLeft:2*singleBtnW];


    BMTabBarBtn *mineBtn= [BMTabBarBtn createBtnNormalImage:@"theme_spring_tab_mine_normal" selectedImageName:@"theme_spring_tab_mine_selected" title:@"我"];
    mineBtn.tag = 3;
    [self setBtnLayout:mineBtn marginLeft:3*singleBtnW];



}

//设置按钮的位置
-(void) setBtnLayout:(BMTabBarBtn *)btn marginLeft:(CGFloat) left{
    [_transparenceView addSubview:btn];//把按钮放在透明的view上
    [btn addTarget:self action:@selector(btnClick:) forControlEvents:UIControlEventTouchDown]; //添加按钮的点击事件
    [btn mas_makeConstraints:^(MASConstraintMaker *make) {
        make.left.equalTo(_transparenceView.mas_left).with.offset(left);
        make.top.equalTo(_transparenceView.mas_top);
        make.bottom.equalTo(_transparenceView.mas_bottom);
        make.width.equalTo(_transparenceView.mas_width).multipliedBy(1.0/4);
    }];
}

//按钮点击事件
-(void) btnClick:(BMTabBarBtn *)btn{
    if (_previewBtn.isSelected) {//上一个按钮，如果是被选中的，就取消选中状态
        _previewBtn.selected = NO; 
    }
    _previewBtn = btn; //将本次选中的按钮，设置为上一个被选中的按钮
    btn.selected = YES; //设置本次被点击的按钮为选中状态

    self.selectedIndex = btn.tag; //切换控制器


}


@end

• 自定义按钮
  

自定义的原因是，我们需要去调整按钮中图片和文字的位置
代码：

//
//  BMTabBarBtn.m
//  BMLOL
//
//  Created by donglei on 2/27/16.
//  Copyright © 2016 donglei. All rights reserved.
//

#import "BMTabBarBtn.h"
#define btnWidth self.frame.size.width
#define btnHeight self.frame.size.height

#define titlePadding 2

@interface BMTabBarBtn ()
@property(nonatomic,assign) CGFloat tittleH;

@end

@implementation BMTabBarBtn

//该类的工厂方法
+(instancetype)createBtnNormalImage:(NSString *)normalName selectedImageName:(NSString*) selectedName title:(NSString *)titileName{
    BMTabBarBtn *btn = [[self alloc] init]; 
    if (btn) {
        [btn setImage:[UIImage imageNamed:normalName] forState:UIControlStateNormal];
        [btn setImage:[UIImage imageNamed:selectedName] forState:UIControlStateSelected];
        [btn setTitle:titileName forState:UIControlStateNormal];
        [btn setTitleColor:[UIColor grayColor] forState:UIControlStateNormal];
        [btn setTitleColor:[UIColor redColor] forState:UIControlStateSelected];
        btn.titleLabel.textAlignment = NSTextAlignmentCenter;

       btn.titleLabel.font = [UIFont systemFontOfSize:13];
    }
    return btn;
}


//更改按钮标题的位置(这些按钮的图片文字 的高度.宽度 x y 需要自己去截图，然后使用软件去观察。我使用的sketch)
-(CGRect)titleRectForContentRect:(CGRect)contentRect{
   _tittleH =  12.f;
    CGFloat tittleW = 37;
    if(self.selected){
        _tittleH = 14.f;
    }
    CGFloat titleY = btnHeight - _tittleH -titlePadding;
    CGFloat titleX = (btnWidth- tittleW)/2;


    return  CGRectMake(titleX, titleY, tittleW, _tittleH);

}

//更改按钮图片的位置
-(CGRect)imageRectForContentRect:(CGRect)contentRect{

    CGFloat imagePadding  = 3;

    CGFloat imageH = 41;
    CGFloat imageW = 37;

    if (self.selected) {
        imageW = 45;
        imageH = 52;
    }
    CGFloat imageX = (btnWidth - imageW) / 2 ;
    CGFloat imageY = btnHeight-titlePadding-_tittleH-imagePadding-imageH;

    return CGRectMake(imageX, imageY, imageW, imageH);
}


//禁止高亮
-(BOOL) isHighlighted{
    return  NO;
}






@end

最后上结果图