文档章节

自定义tabBar

麦兜卖鱼丸
 麦兜卖鱼丸
发布于 2016/03/02 13:52
字数 699
阅读 114
收藏 0

精选30+云产品,助力企业轻松上云!>>>

(一)思路:(1)在原来的tabBar空间上面添加一个自定义的tabBar,这样UIViewController的hidesBottomBarWhenPushed属性依然有效;

(2)在自定义的添加UIButton,并加上相应的事件即可;

(3)本实例参考网络上的列子,根据自己项目的要求修改了部分。

(二)自定义tabBar;

#import "XNTabBar.h"
#import "XNTabBarButton.h"
#define kunSelectColor [UIColor clearColor]
#define kSelectColor [UIColor colorWithRed:17.0f/255 green:110.0f/255 blue:181.0f/255 alpha:1.0f]

@interface XNTabBar ()
{
    UIButton *clickButton;
    XNTabBarButton *barButton;
}

@property (nonatomic,strong) UIButton *selectedBtn;
@end

@implementation XNTabBar

- (void)addButtonWithImage:(UIImage *)image selectedImage:(UIImage *)selectedImage barButtonTitle:(NSString *)title btnRect:(CGRect)frame
{
    barButton = [[XNTabBarButton alloc] initTabBarButtonWithImage:image tabBarButtonTitle:title tabBarRect:frame];
    [barButton addTarget:self action:@selector(btnSelectClick:) forControlEvents:UIControlEventTouchUpInside];//带参数的监听方法记得加"冒号"
    
    [self addSubview:barButton];
}

/**专门用来布局子视图, 别忘了调用super方法*/
- (void)layoutSubviews{
    [super layoutSubviews];
    
    [self selectedButtonIndex:self.seletedIndex];
    NSInteger count = self.subviews.count;
    for (int i = 0; i < count; i++)
    {
        //取得按钮
        UIButton *btnCurrentClick = [self.subviews objectAtIndex:i];
        btnCurrentClick.tag = i; //设置按钮的标记, 方便来索引当前的按钮,并跳转到相应的视图 
    }
}
- (void)selectedButtonIndex:(NSInteger)selectIndex
{
    NSInteger count = self.subviews.count;
    for (int i = 0; i < count; i++)
    {
        if (self.seletedIndex == i)
        {
            UIButton *seleBtn = [self.subviews objectAtIndex:i];
            [seleBtn setBackgroundColor:kSelectColor];
            [self btnSelectClick:seleBtn];
            return;
        }
    }
}

/**
 *  自定义TabBar的按钮点击事件
 */
- (void)btnSelectClick:(UIButton *)button
{
    //1.先将之前选中的按钮设置为未选中
    self.selectedBtn.selected = NO;
    if (self.selectedBtn) {
        [self.selectedBtn setBackgroundColor:kunSelectColor];
    }
    //2.再将当前按钮设置为选中
    button.selected = YES;

    //却换视图控制器的事情,应该交给controller来做
    //最好这样写, 先判断该代理方法是否实现
    if ([self.delegate respondsToSelector:@selector(tabBar:selectedFrom:to:)])
    {
        [self.delegate tabBar:self selectedFrom:self.selectedBtn.tag to:button.tag];
        //3.最后把当前按钮赋值为之前选中的按钮
        self.selectedBtn = button;
        [button setBackgroundColor:kSelectColor];
    }
}

(三)自定义tabBar上的按钮;

#import "XNTabBarButton.h"
#define kLblTopOffsety 4.0f
#define kigWidth 20.0f
#define kigHeight 20.0f
#define kLblHeight 15.0f
#define kbgColor [UIColor colorWithRed:0 green:160.0f/255 blue:223.0f/255 alpha:1.0f]

@interface XNTabBarButton ()
{
    UIImageView *igBarIcon;
    UILabel *lblTitle;
}
@end

@implementation XNTabBarButton

- (instancetype)initTabBarButtonWithImage:(UIImage *)image tabBarButtonTitle:(NSString *)title tabBarRect:(CGRect)rect
{
    self = [super initWithFrame:rect];
    if (self)
    {
        CGFloat kbtnTopOffsety = (CGRectGetHeight(rect)-(kigHeight+kLblHeight+kLblTopOffsety))/2;
        igBarIcon = [[UIImageView alloc] initWithFrame:({
            CGRect frame = CGRectMake((CGRectGetWidth(rect)-kigWidth)/2, kbtnTopOffsety, kigWidth, kigHeight);
            frame;
        })];
        igBarIcon.image = image;
        
        lblTitle = [[UILabel alloc] initWithFrame:({
            CGRect frame = CGRectMake(0, CGRectGetMaxY(igBarIcon.frame)+kLblTopOffsety, CGRectGetWidth(rect), kLblHeight);
            frame;
        })];
        lblTitle.text = title;
        lblTitle.textColor = [UIColor whiteColor];
        lblTitle.textAlignment = NSTextAlignmentCenter;
        lblTitle.font = [UIFont systemFontOfSize:12.0f];
        
        
        [self addSubview:igBarIcon];
        [self addSubview:lblTitle];
    }
    return self;
}
@end

(四)使用;

//删除现有的tabBar
    CGRect barRect = self.tabBar.bounds; //这里要用bounds来加, 否则会加到下面去.看不见
    if (!self.xnTabBar)
    {
        self.xnTabBar = [[XNTabBar alloc] init]; //设置代理必须改掉前面的类型,不能用UIView
        self.xnTabBar.seletedIndex = self.selectedIndex;
        self.xnTabBar.delegate = self; //设置代理
        self.xnTabBar.frame = barRect;
        self.xnTabBar.backgroundColor = kbgColor;
        [self.tabBar addSubview:self.xnTabBar];//添加到系统自带的tabBar上, 这样可以用的的事件方法. 而不必自己去写
        
        //为控制器添加按钮
        NSInteger count = self.viewControllers.count;
        for (int i = 0; i < count; i++)
        {
            //根据有多少个子视图控制器来进行添加按钮
            NSString *imageName = [NSString stringWithFormat:@"%@",[igArray objectAtIndex:i]];
            NSString *barButtonTitle = [NSString stringWithFormat:@"%@",[titleArray objectAtIndex:i]];
            UIImage *image = [UIImage imageNamed:imageName];
            
            CGFloat x = i * ceilf(CGRectGetWidth(barRect)/count);
            CGFloat y = 0;
            CGFloat width = ceilf(CGRectGetWidth(barRect)/count);
            CGFloat height = CGRectGetHeight(barRect);
            [self.xnTabBar addButtonWithImage:image selectedImage:nil barButtonTitle:barButtonTitle btnRect:CGRectMake(x, y, width, height)];
        }
    }


下一篇: PNChart
麦兜卖鱼丸
粉丝 12
博文 69
码字总数 69333
作品 0
桂林
iOS工程师
私信 提问
加载中
请先登录后再评论。
微信小程序自定义tabbar填坑记

以下摘录自官方文档,重点标记了红色。 自定义 tabBar 基础库 2.5.0 开始支持,低版本需做兼容处理。 自定义 tabBar 可以让开发者更加灵活地设置 tabBar 样式,以满足更多个性化的场景。 在自...

renjunjie
2019/12/08
1.2K
0
关于iOS自定义UITabBar的几种方法

  作为iOS开发最常用的两个多视图控制器 NavigationController 和 TabBarController 已经很强大了,基本上在大部分的应用中都能看到它们的影子。但是在使用的过程中,系统自带的空间也经常...

coderCD
2015/09/16
31
0
taro中自定义tabbar实现中间图标凸出效果

遇到的一个需求是在tabbar上有一个凸起的小图标, 但是微信自带的tabbar是没有这个效果的, 无奈,只能使用自定义tabbar,查找了多方文档后发现大多是原生小程序实现, 关于taro文档的少之又...

osc_v8ngb6p0
2019/11/19
89
0
iOS自定义tabbar后popToRootViewContriller和poptoviewcont

iOS自定义tabbar后popToRootViewContriller和poptoviewcontroller时出现两个tabbar 的解决办法 问题:iOS自定义tabbar后popToRootViewContriller和poptoviewcontroller时出现两个tabbar 1.自......

stevenSeven
2016/06/20
8
0
UITabBar就那么点事

IrregularTabBar gitHub地址 https://github.com/jiangyongjian/IrregularTabBar自定义tabBar,IrregularTabBar。自己的,有什么不足请多多指教哈哈 GIF 现在主流app很多都是tabBar下面5个按...

arts114114
2016/08/10
20
0

没有更多内容

加载失败,请刷新页面

加载更多

CSS背景不透明度[重复] - CSS Background Opacity [duplicate]

问题: This question already has an answer here: 这个问题已经在这里有了答案: How do I give text or an image a transparent background using CSS? 如何使用CSS为文本或图像提供透明背...

fyin1314
23分钟前
15
0
node http 获取gb2312网页如何转为utf8

最初,我想当然认为是下述做法,但被证明是错误的 const http = require('http'), iconv = require('iconv-lite');const url = 'http://xxx';http.get(url, function(res) { var bo......

高延
39分钟前
24
0
我在哪里可以在线找到Android源代码? [关闭] - Where can I find Android source code online? [closed]

问题: Particularly, where can I browse the source code for any android source application(egthe contact application) ? 特别是,我在哪里可以浏览任何Android源应用程序(例如联系人......

javail
53分钟前
17
0
动态规划:LC198.打家劫舍

题目描述: 你是一个专业的小偷,计划偷窃沿街的房屋。每间房内都藏有一定的现金,影响你偷窃的唯一制约因素就是相邻的房屋装有相互连通的防盗系统,如果两间相邻的房屋在同一晚上被小偷闯入...

曦鱼violet
今天
30
0
OSChina 周一乱弹 —— 南方水到底多深

Osc乱弹歌单(2020)请戳(这里) 【今日歌曲】 @薛定谔的兄弟 :分享洛神有语创建的歌单「我喜欢的音乐」: Various Artists-用印度乐器演奏苏联国歌(洛天侬 remix) 手机党少年们想听歌,请...

小小编辑
今天
56
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部