自定义tabbar标签栏

标签：

学iOS以来，感觉自定义的东西，比系统自带的要容易操作一点，可修改和执行的空间要多一点。

下面说一下用到很多的tabbar。

首先，创建一个FButton类，继承UIButton，用来规范tabbar上的按钮。

然后，创建一个RootViewController，继承UITabbarController作为根视图控制器。

废话不多说，直接上代码：

在FButton的.m文件中：

#import "FButton.h"

@implementation FButton

-(id)initWithFrame:(CGRect)frame
{
    if (self = [super initWithFrame:frame]) {
        
    }
    return self;
}

#pragma mark set image in btn
-(CGRect)imageRectForContentRect:(CGRect)contentRect
{
    CGFloat imageW = contentRect.size.width;
    CGFloat imageH = contentRect.size.height * 0.65;
    
    return CGRectMake(0, 3, imageW, imageH);
}
#pragma mark set title in btn
-(CGRect)titleRectForContentRect:(CGRect)contentRect
{
    CGFloat titleY = contentRect.size.height * 0.65;
    CGFloat titleW = contentRect.size.width;
    CGFloat titleH = contentRect.size.height - titleY;
    
    return CGRectMake(0, titleY, titleW, titleH);
}

@end

在RootViewController的.h文件中：

#import <UIKit/UIKit.h>

@interface RootViewController : UITabBarController

//是否隐藏tabbar
-(void)isHiddenCustomTabbar:(BOOL)isHidden;

@end

.m文件中：

@interface RootViewController ()
{
    UIImageView * _tabbarView;    //自定义tabbar 覆盖系统自带的
    FButton * _previousBtn;       //记录上一个按钮
}

@end

@implementation RootViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    
    //隐藏系统自带的tabbar
    self.tabBar.hidden = YES;
    
    [self creatCustomTabbarView];
}
#pragma mark - 创建自定义的tabbar
-(void)creatCustomTabbarView
{
    //tabBar标签栏的高度为49
    _tabbarView = [[UIImageView alloc]initWithFrame:CGRectMake(0, HEIGHT-49, WIDTH, 49)];
    _tabbarView.image = [UIImage imageNamed:@"tabbar"];
    _tabbarView.userInteractionEnabled = YES;
    [self.view addSubview:_tabbarView];
    
    HomeViewController * first = [[HomeViewController alloc]init];
    UINavigationController * navi1 = [[UINavigationController alloc]initWithRootViewController:first];
    ExpertViewController * second = [[ExpertViewController alloc]init];
    UINavigationController * navi2 = [[UINavigationController alloc]initWithRootViewController:second];
    HospitalViewController * third = [[HospitalViewController alloc]init];
    UINavigationController * navi3 = [[UINavigationController alloc]initWithRootViewController:third];
    CommunityViewController * fourth = [[CommunityViewController alloc]init];
    UINavigationController * navi4 = [[UINavigationController alloc]initWithRootViewController:fourth];
    MineViewController * fifth = [[MineViewController alloc]init];
    UINavigationController * navi5 = [[UINavigationController alloc]initWithRootViewController:fifth];
    
    self.viewControllers = @[navi1,navi2,navi3,navi4,navi5];

　//下边的内容，根据自己的要求，自定义实现
    NSArray * title_arr = @[@"首页",@"专家",@"医院",@"社区",@"我的"];
    NSArray * arr = @[@"home",@"doctor",@"hospital",@"community",@"mine"];
    
    for (int i=0; i<arr.count; i++) {
        [self creatButtonWithNormalName:arr[i] andSelectName:[NSString stringWithFormat:@"selected-%@",arr[i]] andTitle:title_arr[i] andIndex:i];
    }
    //设置默认选中按钮
    FButton * button = _tabbarView.subviews[0];
    [self changeViewController:button];
}
#pragma mark 创建标签栏上的按钮以及文字
- (void)creatButtonWithNormalName:(NSString *)normal andSelectName:(NSString *)selected andTitle:(NSString *)title andIndex:(int)index{
    
    FButton * customButton = [FButton buttonWithType:UIButtonTypeCustom];
    customButton.tag = index;
    
    CGFloat buttonW = _tabbarView.frame.size.width / 5;
    CGFloat buttonH = _tabbarView.frame.size.height;
    
    customButton.frame = CGRectMake(buttonW * index, 0, buttonW, buttonH);
    [customButton setImage:[UIImage imageNamed:normal] forState:UIControlStateNormal];
    [customButton setImage:[UIImage imageNamed:selected] forState:UIControlStateDisabled];
    [customButton setTitle:title forState:UIControlStateNormal];
    //按钮的点击事件
    [customButton addTarget:self action:@selector(changeViewController:) forControlEvents:UIControlEventTouchDown];
    //设置image和label的位置以及字体大小和颜色
    customButton.imageView.contentMode = UIViewContentModeCenter;
    customButton.titleLabel.textAlignment = NSTextAlignmentCenter;
    UIColor * color = UTILS_COLORRGB(0, 154, 154);
    [customButton setTitleColor: color forState:UIControlStateNormal];
    customButton.titleLabel.font = [UIFont systemFontOfSize:11];
    
    [_tabbarView addSubview:customButton];
    
}

#pragma mark 按钮被点击时调用
- (void)changeViewController:(FButton *)sender
{
    self.selectedIndex = sender.tag; //切换不同控制器的界面
    sender.enabled = NO;
    if (_previousBtn != sender) {
        _previousBtn.enabled = YES;
    }
    _previousBtn = sender;
    self.selectedViewController = self.viewControllers[sender.tag];
}
#pragma mark - 是否隐藏tabbar
-(void)isHiddenCustomTabbar:(BOOL)isHidden
{
    _tabbarView.hidden = isHidden;
}

以上都完成后，最后在appdelegate中将RootViewController 设置为根视图控制器：

　　//设置tabbar的根视图控制器
    _delegate = [[RootViewController alloc]init];
    self.window.rootViewController = _delegate;

然后就可以实现了。

效果如下图所示：

希望这篇文章会对你有所帮助。

自定义tabbar标签栏

标签：

原文地址：http://www.cnblogs.com/gwfeng/p/4807147.html