iOS Tabbar上增加一个自定义按钮

前言

大多情况下,我们使用系统的tabbar基本上可以满足产品的需求,但是有时候产品不按套路出牌,比如说类似于微博客户端一样,在tabbar中间增加一个”+”号按钮,那我们就需要自定了,其实也比较简单。

一、自定义一个UITabBar

1、新建一个类,继承UITabBar,我取的类名叫做:HSTabBar.

2、在HSTabBar.h中添加如下代码:

#import 

@class HSTabBar;

@protocol HSTabBarDelegate <UITabBarDelegate>

@optional

- (void)tabBarDidClickPlusButton:(HSTabBar *)tabBar;

@end

@interface HSTabBar : UITabBar

@property (nonatomic, strong) UIButton *plusBtn;
@property (nonatomic, weak) id  tabBarDelegate;

@end

3、在HSTabBar.m中添加如下代码:

#import "HSTabBar.h"

@implementation HSTabBar

- (id)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        // 添加一个按钮到tabbar中
        UIButton *plusBtn = [[UIButton alloc] init];
        [plusBtn setImage:[UIImage imageNamed:@"icon_bottom_add"] forState:UIControlStateNormal];
        CGRect temp = plusBtn.frame;
        temp.size=plusBtn.currentImage.size;
        plusBtn.frame=temp;
        [plusBtn addTarget:self action:@selector(plusClick) forControlEvents:UIControlEventTouchUpInside];
        [self addSubview:plusBtn];
        self.plusBtn = plusBtn;
    }
    return self;
}

- (void)plusClick
{
    // 通知代理
    if ([self.tabBarDelegate respondsToSelector:@selector(tabBarDidClickPlusButton:)]) {
        [self.tabBarDelegate tabBarDidClickPlusButton:self];
    }
}

- (void)layoutSubviews
{
    [super layoutSubviews];

    // 1.设置加号按钮的位置
    CGPoint temp = self.plusBtn.center;
    temp.x=self.frame.size.width/2;
    temp.y=self.frame.size.height/2;
    self.plusBtn.center=temp;

    // 2.设置其它UITabBarButton的位置和尺寸
    CGFloat tabbarButtonW = self.frame.size.width / 5;
    CGFloat tabbarButtonIndex = 0;
    for (UIView *child in self.subviews) {
        Class class = NSClassFromString(@"UITabBarButton");
        if ([child isKindOfClass:class]) {
            // 设置宽度
            CGRect temp1=child.frame;
            temp1.size.width=tabbarButtonW;
            temp1.origin.x=tabbarButtonIndex * tabbarButtonW;
            child.frame=temp1;
            // 增加索引
            tabbarButtonIndex++;
            if (tabbarButtonIndex == 2) {
                tabbarButtonIndex++;
            }
        }
    }
}

@end

二、HSTabBar的使用

1、新建一个类,继承UITabbarViewControll, 类名命名为:RootTabBarController.

2、导入HSTabBar的头文件

#import "HSTabBar.h"

3、在RootTabBarController 中的 viewDidLoad方法中添加代码:

  HSTabBar *tabBar = [[HSTabBar alloc] init];
  tabBar.tabBarDelegate = self;
  [self setValue:tabBar forKeyPath:@"tabBar"];

其他的一些创建导航控制器和将控制器加入tabBar中的代码此处省略了,自己去吧。

4、实现HSTabBarDelegate代理方法

#pragma mark - HSTabBarDelegate代理方法
- (void)tabBarDidClickPlusButton:(HSTabBar *)tabBar
{
    _bgView = [UICommonCtrl commonViewWithFrame:CGRectMake(0, 0, SCREEN_WIDTH, SCREEN_HEIGHT) color:kColor_Transparent];
    [kAppDelegate.window addSubview:_bgView];

    UITapGestureRecognizer *tapGesture = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tapGesture:)];
    [_bgView addGestureRecognizer:tapGesture];


    NSArray *arrData = @[@{@"title":@"签到",@"image":@"icon_add_sign"},
                         @{@"title":@"发起群聊",@"image":@"icon_add_group"},
                         @{@"title":@"申请",@"image":@"icon_add_apply"},
                         @{@"title":@"创建项目",@"image":@"icon_add_project"},
                         @{@"title":@"创建任务",@"image":@"icon_add_task"},
                         @{@"title":@"会议预定",@"image":@"icon_add_boardroom"}];

    UIView *baseView = [UICommonCtrl commonViewWithFrame:CGRectMake(0, SCREEN_HEIGHT-200, SCREEN_WIDTH, 200) color:kColor_White];
    [_bgView addSubview:baseView];

    float spaceWidth = (SCREEN_WIDTH-60*3)/6;

    for (NSInteger i=0; i.count; i++) {

        NSInteger x = i % 3;
        NSInteger y = i / 3;

        UIButton *btn = [UICommonCtrl commonCenterControlButtonWithFrame:CGRectMake(spaceWidth+(spaceWidth*2+60)*x, 20+y*100, 60, 60)
                                                                    text:[[arrData objectAtIndex:i] objectForKey:@"title"]
                                                                   color:kColor_Black
                                                                    font:kFont_Middle
                                                                   image:[UIImage imageNamed:[[arrData objectAtIndex:i]objectForKey:@"image"]]
                                                                 spacing:5.0
                                                                  target:self
                                                                  action:@selector(btnClick:)];
        [btn setTag:i];
        [baseView addSubview:btn];

    }

}

- (void)btnClick:(UIButton *)btn
{
    if (btn.tag == 0) {

    } else if (btn.tag  == 1) {

    } else if (btn.tag  == 2) {

    } else if (btn.tag  == 3) {

    } else if (btn.tag  == 4) {

    } else {

    }
    [_bgView removeFromSuperview];
}

- (void)tapGesture:(UITapGestureRecognizer *)tapGesture
{
    [_bgView removeFromSuperview];
}

根据自己的需求添加或修改相应的代码。

效果图

iOS Tabbar上增加一个自定义按钮_第1张图片

你可能感兴趣的:(iOS开发)