自定义中间带加号UITabBar

项目中经常有tabbar中间有个➕的需求,今天整理了一下,PO在这里

整体思路:因为➕超出了tabbar的响应范围,想要点击有响应,需要重写view的hitTest方法。所以我们需自定义一个tabbar,添加了一个➕,它不是正常的tabbaritem,我把他作为一个button来对待

1)我们需要自定义一个tabbarcontroller,方便移植

2)自定义一个tabbar,用到layoutSubviews方法,更改它原有tabbaritem的frame,通过setter/getter方法添加plusBtn

 3)tabbar定制协议,让tabbarcontroller遵循并实现协议方法,完成点击plusBtn进入新的界面

4)在tabbar中重写view的hitTest方法,响应点击超出tabbar的加号按钮

现在我直接贴出每个文件的具体代码,以免看乱

1.    自定义TGZTabbarController ,图1为.h文件


图1

2.图2为.m文件上半部分内容

图2

- (void)createUI{ 

    AViewController * avc = [[AViewController alloc]init];

    BViewController * bvc = [[BViewController alloc]init];

    CViewController * cvc = [[CViewController alloc]init];

    DViewController * dvc = [[DViewController alloc]init];

    avc.view.backgroundColor = [UIColor yellowColor];

    bvc.view.backgroundColor = [UIColor brownColor];

    cvc.view.backgroundColor = [UIColor greenColor];

    dvc.view.backgroundColor = [UIColor purpleColor];

    UINavigationController * anva = [[UINavigationController alloc]initWithRootViewController:avc];

    UINavigationController * bnva = [[UINavigationController alloc]initWithRootViewController:bvc];

    UINavigationController * cnva = [[UINavigationController alloc]initWithRootViewController:cvc];

    UINavigationController * dnva = [[UINavigationController alloc]initWithRootViewController:dvc];

    avc.tabBarItem = [[UITabBarItem alloc]initWithTabBarSystemItem:UITabBarSystemItemMore tag:1];

    avc.tabBarItem.title = @"首页";

    bvc.tabBarItem = [[UITabBarItem alloc]initWithTabBarSystemItem:UITabBarSystemItemSearch tag:2];

    bvc.tabBarItem.title = @"喜欢";

    cvc.tabBarItem = [[UITabBarItem alloc]initWithTabBarSystemItem:UITabBarSystemItemHistory tag:3];

    cvc.tabBarItem.title = @"历史";

    dvc.tabBarItem = [[UITabBarItem alloc]initWithTabBarSystemItem:UITabBarSystemItemContacts tag:4];

    dvc.tabBarItem.title = @"我的";

    TGZTabbar* tabBar = [[TGZTabbaralloc]init];

    //取消tabbar的透明效果

    tabBar.translucent=NO;

    //设置tabbar的代理

    tabBar.TabDelegate=self;

    self.viewControllers=@[anva,bnva,cnva,dnva];

    //kvc : 如果要修改系统的某些属性,但被设置为readonly,就用kvc,setvalue:forkey

    [selfsetValue:tabBarforKey:@"tabBar"];

}

#pragma mark - - - - -- - 实现代理协议  点击了加号按钮 - - - - -

-(void)DidClickPlusBtnIntabbar:(TGZTabbar*)tabbar{

    //在这里写点击了加号按钮,需要处理的事件

    UIViewController * addvc = [[UIViewController alloc]init];

    addvc.view.backgroundColor = [UIColor cyanColor];

    [self presentViewController:addvc animated:YES completion:nil];

}


3. 自定义TGZTabbar,图3为.h文件


图3    

4. 下面为TGZTabbar.m文件内容

#import "TGZTabbar.h"

@interface TGZTabbar ()

@property (nonatomic,strong)UIButton *plusBtn;

@end

@implementation TGZTabbar

@synthesize plusBtn = _plusBtn; //重写setter和getter方法时,需要加上这句话

#pragma mark  - -- -  lifeCycle 确保每次都添加PlusBtn

-(instancetype)initWithFrame:(CGRect)frame{

    if(self= [superinitWithFrame:frame]) {

        [selfaddSubview:self.plusBtn];//添加➕按钮

    }

    return self;

}

#pragma mark - - - --  private method

//重新布局tabbaritem,

-(void)layoutSubviews{ //系统方法,只有更改frame时,才能重写此方法

    [super layoutSubviews];//与viewwillappear类似

    //1. 设置plusBtn的位置

    self.plusBtn.center = CGPointMake(self.center.x, self.frame.size.height*0.1);

    //设置其他tabbaritem的位置,大小

    CGFloattabbaritemwidth =self.frame.size.width/5;

    CGFloattabbarindex =0;

    for(UIView* viewinself.subviews) {

        Classclass =NSClassFromString(@"UITabBarButton");

        if([viewisKindOfClass:class]) {

            //设置位置            view.frame=CGRectMake(tabbaritemwidth*tabbarindex,CGRectGetMinY(view.frame), tabbaritemwidth,CGRectGetHeight(view.frame));

           //增加索引,只对非➕按钮的其他4个item进行操作

            tabbarindex += (tabbarindex ==1?2:1);

       }

    }

}

#pragma mark  - - -- - - 重写hitTest方法,响应点击超出tabbar的加号按钮

- (UIView*)hitTest:(CGPoint)point withEvent:(UIEvent*)event{

    //这是view的点击事件

    if (self.isHidden == NO) { // 当前界面 tabBar显示

        CGPointnewPoint = [selfconvertPoint:pointtoView:self.plusBtn];

        if( [self.plusBtnpointInside:newPointwithEvent:event]) {// 点 属于按钮范围

            returnself.plusBtn;

        }else{

           return[superhitTest:pointwithEvent:event];

        }

    }else{

        return[superhitTest:pointwithEvent:event];

    }

}

#pragma mark - - - - - - plusBtn的setter /getter方法

- (void)setPlusBtn:(UIButton*)plusBtn{

    _plusBtn= plusBtn;

}

- (UIButton*)plusBtn{

    if(!_plusBtn) {

        _plusBtn= [[UIButtonalloc]init];

        [_plusBtn setImage:[UIImage imageNamed:@"addImage"] forState:UIControlStateNormal];

//        [_plusBtn setImage:[UIImage imageNamed:@""] forState:UIControlStateHighlighted];

        _plusBtn.frame = CGRectMake(0, 0, _plusBtn.imageView.image.size.width, _plusBtn.imageView.image.size.height);

        _plusBtn.frame=CGRectMake(0,0,80,80);//尺寸具体看项目需求

        [_plusBtn addTarget:self action:@selector(respondsToPlusButton) forControlEvents:UIControlEventTouchUpInside];

    }

    return _plusBtn;

}

#pragma mark  - - -- -  event responds

- (void)respondsToPlusButton{

    //点击了Plusbtn,通知代理,执行代理协议方法

        [self.TabDelegate DidClickPlusBtnIntabbar:self];

}

效果如图5

图5


这样就大功告成了,点击➕弹出一个新的界面!!!类似样式,都可以这样操作,代码里面有详细的注释,可以帮助理解。

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 214,922评论 6 497
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 91,591评论 3 389
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 160,546评论 0 350
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 57,467评论 1 288
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,553评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,580评论 1 293
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,588评论 3 414
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,334评论 0 270
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,780评论 1 307
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,092评论 2 330
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,270评论 1 344
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,925评论 5 338
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,573评论 3 322
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,194评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,437评论 1 268
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,154评论 2 366
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,127评论 2 352

推荐阅读更多精彩内容