美文网首页
自定义UITabBar

自定义UITabBar

作者: Robinone | 来源:发表于2018-11-08 20:19 被阅读0次

思路

  1. 移除自带的TabBar
  2. 用UIView自定义TabBar

2.1 自定义一个view添加到原来的TabBar的位置。
2.2 在自定义View上添加按钮,监听按钮点击事件,改变selectIndex,关联各个子viewController,覆盖相关事件。


在 TabBarViewController中移除TabBar应该在viewDidAppear中

- (void)viewDidAppear:(BOOL)animated
{
    [super viewDidAppear:animated];
    [self.tabBar removeFromSuperview];
}

实现

1.新建一个继承UIButton的类,用来创建自定义TabBar中的按钮,比如命名为XXTabBarButton。
在XXTabBarButton.m中

//重写setHighlighted:方法,留空即可以取消点击时的高亮状态
- (void)setHighlighted:(BOOL)highlighted{
   
}

2.在TabBarController使用自定义UITabBar

#import "XXTabBarController.h"
#import "XXRedViewController.h"
#import "XXGreenViewController.h"
#import "XXTabBarButton.h"
 
@interface XXTabBarController ()
/**
 *  设置之前选中的按钮
 */
@property (nonatomic, weak) UIButton *selectedBtn;
@end
 
@implementation XXTabBarController
 
 
 
- (void)viewDidLoad {
    [super viewDidLoad];
    //设置子控制器
    [self setupChildControllers];
     
    //设置TabBar
    [self setupTabBar];
 
}
 
- (void)setupChildControllers {
    XXRedViewController *redViewController = [[XXRedViewController alloc] init];
    redViewController.view.backgroundColor  = [UIColor redColor];
    redViewController.tabBarItem.title = @"red";
    //设置图片
    redViewController.tabBarItem.image = [UIImage imageNamed:@"tabbar_mainframe"];
    //设置选中图片
    redViewController.tabBarItem.selectedImage = [UIImage imageNamed:@"tabbar_mainframeHL"];
     
     
    XXGreenViewController *greenViewController = [[XXGreenViewController alloc] init];
    greenViewController.view.backgroundColor = [UIColor greenColor];
    greenViewController.tabBarItem.title = @"green";
    greenViewController.tabBarItem.image = [UIImage imageNamed:@"tabbar_me"];
    greenViewController.tabBarItem.selectedImage = [UIImage imageNamed:@"tabbar_meHL"];
    self.viewControllers = @[redViewController,greenViewController];
}
 
- (void)setupTabBar {
    //移除现有的tabBar,在移除之前记录它的frame备用
    CGRect rect = self.tabBar.frame;
  //  [self.tabBar removeFromSuperview];  
  
    UIView *myView = [[UIView alloc] init];
    myView.frame = rect;
    myView.backgroundColor = [UIColor cyanColor];
    [self.view addSubview:myView];
     
    for (int i = 0; i < 2; i++) {
 
        XXTabBarButton *button = [[XXTabBarButton alloc] init];
         
        NSString *imageName = [NSString stringWithFormat:@"tabbar_%d",i];
        NSString *imageNameSel = [NSString stringWithFormat:@"tabbar_%dHL",i];
         
        [button setImage:[UIImage imageNamed:imageName] forState:UIControlStateNormal];
        [button setImage:[UIImage imageNamed:imageNameSel] forState:UIControlStateSelected];
         
        CGFloat x = i * myView.frame.size.width / 2;
        button.frame = CGRectMake(x, 0, myView.frame.size.width / 2, myView.frame.size.height);
         
        [myView addSubview:button];
         
        //设置按钮的标记, 方便来索引当前的按钮,并跳转到相应的视图
        button.tag = i;
         
        [button addTarget:self action:@selector(clickBtn:) forControlEvents:UIControlEventTouchUpInside];
         
        //设置初始显示界面
        if (0 == i) {
            button.selected = YES;
            self.selectedBtn = button;  //设置该按钮为选中的按钮
        }
    }
}
 
 
 
//TabBar点击,切换界面
- (void)clickBtn:(UIButton *)button {
    //1.先将之前选中的按钮设置为未选中
    self.selectedBtn.selected = NO;
    //2.再将当前按钮设置为选中
    button.selected = YES;
    //3.最后把当前按钮赋值为之前选中的按钮
    self.selectedBtn = button;
     
    //4.跳转到相应的视图控制器. (通过selectIndex参数来设置选中了那个控制器)
    self.selectedIndex = button.tag;
} 
 
 
@end

相关文章

网友评论

      本文标题:自定义UITabBar

      本文链接:https://www.haomeiwen.com/subject/suhgxqtx.html