iOS自定義Tabbar


因為公司需求,蘋果的原生tabBar已經不能滿足本人類的需求,我在網上查了下,覺得還是自己寫一個tabBar比較好。

雖然是自定義tabBar,還是在原生基礎上寫

基本思路就是:隱藏系統原生tabBar,自己寫一個tabView(一個自定義View)放在底部當成tabBar,在點擊View上面的button的時候調用原生方法,實現控制器切換

可以實現的功能:

1 可以自己隨意的隱藏顯示tabBar,實現一些關於tabBar的動畫,所有的一切只需要設置tabView就可以了

2 可以自定義tabBar的樣式,在tabBar上添加背景圖,添加氣泡等等完全無壓力

在網上找了一個別人寫好的tabBar,然后自己修改了一下,立即就可以實現需求,非常方便

 

CBTabBar

只有兩個類

CBTabBarViewController的.h代碼

#import <UIKit/UIKit.h>

/*
 *可以實現隱藏tabBar功能
 */


@interface CBTabBarViewController : UITabBarController
-(void)hidCBTabbar:(BOOL)ishid;
@property (nonatomic, strong) NSArray           * imageNameArray;
@property (nonatomic, strong) NSArray           * imageName_sel_Array;
-(instancetype)initWithImageArray:(NSArray *)array andImageSelArray:(NSArray *)selArray;
-(void)setSelectedButton:(NSUInteger)selectedIndex;
@end

CBTabBarViewController的.m代碼

#import "CBTabBarViewController.h"
#import "CBTabBarButton.h"
@interface CBTabBarViewController (){
    UIView * myView;
    NSMutableArray * _buttonArray;
}
@property (nonatomic, weak) UIButton *selectedBtn;
@end

@implementation CBTabBarViewController

-(instancetype)initWithImageArray:(NSArray *)array andImageSelArray:(NSArray *)selArray{
    self = [super init];
    if (self) {

        
        self.imageNameArray = array;
        self.imageName_sel_Array = selArray;
        [self loadSubView];//添加自定義tabBar
    }
    return self;
}

- (void)viewDidLoad {
    [super viewDidLoad];
    
    self.imageNameArray = [NSArray array];
    self.imageName_sel_Array = [NSArray array];
    _buttonArray = [[NSMutableArray alloc] init];
}

-(void)loadSubView{
    
    
    //刪除現有的tabBar
    CGRect rect = self.tabBar.frame;
    [self.tabBar removeFromSuperview];  //移除TabBarController自帶的下部的條
    
    
    
    //添加自己的視圖
    /*
     *tabBar的底部View
     *背景圖,button都會添加到這個myVIew上面
     *可以自己添加其他View
     */
    myView = [[UIView alloc] init];
    myView.frame = rect;
//    myView.backgroundColor = [UIColor redColor];
    [self.view addSubview:myView];
    
    
    
    //給tabBar添加自定義背景圖
    UIImageView * imageView = [[UIImageView alloc] init];
    imageView.image = [UIImage imageNamed:@"tabBarBGImg"];
    imageView.frame = CGRectMake(0, 0, myView.frame.size.width, myView.frame.size.height);
    [myView addSubview:imageView];

    
    
    if (self.imageName_sel_Array.count < 1 || self.imageNameArray.count < 1) {
        return;
    }
    [_buttonArray removeAllObjects];
    for (int i = 0; i < 5; i++) {
        
        CGFloat x = i * myView.frame.size.width / 5;
        
        UIView * view = [[UIView alloc] initWithFrame:CGRectMake(x, 2, myView.frame.size.width / 5, myView.frame.size.height)];
        [myView addSubview:view];
        if (i == 2) {
            view.frame = CGRectMake(x, 0, myView.frame.size.width / 5, myView.frame.size.height);
        }
        
        
        //tabber 上面的button
        CBTabBarButton *btn = [[CBTabBarButton alloc] init];
        
        NSString *imageName = [self.imageNameArray objectAtIndex:i];
        NSString *imageNameSel = [self.imageName_sel_Array objectAtIndex:i];
        
        [btn setImage:[UIImage imageNamed:imageName] forState:UIControlStateNormal];
        [btn setImage:[UIImage imageNamed:imageNameSel] forState:UIControlStateSelected];
        
        btn.tag = i;//設置按鈕的標記, 方便來索引當前的按鈕,並跳轉到相應的視圖
        [btn addTarget:self action:@selector(clickBtn:) forControlEvents:UIControlEventTouchUpInside];
        
        btn.center = CGPointMake(view.frame.size.width / 2, view.frame.size.height / 2);
        btn.bounds = CGRectMake(0, 0, 40, 40);
        
        [view addSubview:btn];
        [_buttonArray addObject:btn];

        
        //設置剛進入時,第一個按鈕為選中狀態
        if (0 == i) {
            btn.selected = YES;
            self.selectedBtn = btn;  //設置該按鈕為選中的按鈕
        }  
    }
}


//通過點擊tabBar上面的button來跳轉控制器
- (void)clickBtn:(UIButton *)button {
    //1.先將之前選中的按鈕設置為未選中
    self.selectedBtn.selected = NO;
    //2.再將當前按鈕設置為選中
    button.selected = YES;
    //3.最后把當前按鈕賦值為之前選中的按鈕
    self.selectedBtn = button;
    //4.跳轉到相應的視圖控制器. (通過selectIndex參數來設置選中了那個控制器)
    self.selectedIndex = button.tag;
}

//調用此方法來跳轉控制器
-(void)setSelectedButton:(NSUInteger)selectedIndex{
    //1.先將之前選中的按鈕設置為未選中
    self.selectedBtn.selected = NO;
    //2.從buttonarray中找到當前button
    UIButton * button = [_buttonArray objectAtIndex:selectedIndex];
    //3.最后把當前按鈕賦值為之前選中的按鈕
    button.selected = YES;
    //4.跳轉到相應的視圖控制器. (通過selectIndex參數來設置選中了那個控制器)
    self.selectedIndex = selectedIndex;
}

//通過設置View的透明度來隱藏tabBar
-(void)hidCBTabbar:(BOOL)ishid{
    if (ishid) {
        myView.alpha = 0;
    }else{
        myView.alpha = 1;
    }
}

 CBTabBarButton.m代碼

-(void)setHighlighted:(BOOL)highlighted{
    //只需要取消高亮,這里什么都不用寫
}

 調用tabBar的代碼

#import "ViewController.h"

#import "CBTabBarViewController.h"
#import "TestViewController.h"
@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    
    
    UIViewController *firstViewController = [[TestViewController alloc] init];
    firstViewController.view.backgroundColor = [UIColor redColor];
    UIViewController *firstNavigationController = [[UINavigationController alloc]
                                                   initWithRootViewController:firstViewController];
    
    UIViewController *secondViewController = [[TestViewController alloc] init];
    secondViewController.view.backgroundColor = [UIColor yellowColor];
    UIViewController *secondNavigationController = [[UINavigationController alloc]
                                                    initWithRootViewController:secondViewController];
    
    UIViewController *thirdViewController = [[TestViewController alloc] init];
    thirdViewController.view.backgroundColor = [UIColor greenColor];
    UIViewController *thirdNavigationController = [[UINavigationController alloc]
                                                   initWithRootViewController:thirdViewController];
    
    UIViewController *fourthViewController = [[TestViewController alloc] init];
    fourthViewController.view.backgroundColor = [UIColor orangeColor];
    UIViewController *fourthNavigationController = [[UINavigationController alloc]
                                                    initWithRootViewController:fourthViewController];
    
    UIViewController *fifthViewController = [[TestViewController alloc] init];
    fifthViewController.view.backgroundColor = [UIColor blueColor];
    UIViewController *fifthNavigationController = [[UINavigationController alloc]
                                                   initWithRootViewController:fifthViewController];
    
    
    NSArray * imageArray = [NSArray arrayWithObjects:@"sq_03",@"sq_05",@"zcfTabIcon",@"sousuo",@"wode",nil];
    NSArray * selImageArray = [NSArray arrayWithObjects:@"sq_18",@"sq_19",@"sq_16",@"sousuo_sel",@"wode_sel",nil];
    
    CBTabBarViewController * tabVC = [[CBTabBarViewController alloc] initWithImageArray:imageArray andImageSelArray:selImageArray];
    tabVC.viewControllers = @[firstNavigationController,secondNavigationController,thirdNavigationController,fourthNavigationController,fifthNavigationController];
    [tabVC setSelectedButton:0];

    
    UIWindow * window = [[[UIApplication sharedApplication] delegate] window];
    window.rootViewController = tabVC;
    
    
    
}

 很簡單的tabBar,其中的loadSubView方法可能有隱患,以后再處理

這樣靠設置frame寫出來的tabBar沒有橫屏效果,想要實現橫屏效果需要自己再寫約束代碼


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM