iOS個人整理16-標籤視圖控制器--UITabBarController

一、UITabBarController

微信底部那一排 微信、通訊錄、發現、朋友圈,就是UITabBarController

它上面的控制的四個視圖控制器是平級的,一般情況下將self.window.rootViewController設置爲UITabBarController

然後在UITabBarController上面添加UINavigationController

UINavigationController上面添加一般的UIViewController

UITabBarController-->UINavigationController-->UIViewController




二、屬性和方法


UITabBar的高度是49,最多顯示5個UITabBarItem,超過5個會增加一個更多按鈕。

    
    //創建一個ViewController加到NavigationController上
    //再將NavigationController加到TabBarController上

    RootViewController *rootVC = [[RootViewController alloc]init];
    UINavigationController *navigationC = [[UINavigationController alloc]initWithRootViewController:rootVC];
    
    //創建UITabBarController
    UITabBarController *myTabBar = [UITabBarController new];
    
    //將導航控制器放入tabBar
    myTabBar.viewControllers = @[navigationC];
    
    //設置底部的item標題,這個字很小
    navigationC.tabBarItem.title = @"根";
    
    //設置圖片,這裏圖片大小不能自適應,最好把圖片裁好 40*40,照片還有設置渲染效果,背景色會影響照片顯示
    navigationC.tabBarItem.image = [[UIImage imageNamed:@"b3.gif"]
    imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];;
    
    //設置tabBar的字體顏色
    myTabBar.tabBar.tintColor = [UIColor colorWithRed:109/255.0 green:211/255.0 blue:206/255.0 alpha:1];
    
    //設置tabbar背景顏色
    myTabBar.tabBar.barTintColor =  [UIColor colorWithRed:200/255.0 green:233/255.0 blue:160/255.0 alpha:1];

    //是否半透明
    myTabBar.tabBar.translucent = NO;

    //將tabBarController設置爲根視圖控制器
    self.window.rootViewController = myTabBar;
    
    //把SecondView添加
    SecondViewController *secondVC = [[SecondViewController alloc]init];
    UINavigationController *secondNavC = [[UINavigationController alloc]initWithRootViewController:secondVC];
    
    //設置標題
    secondNavC.tabBarItem.title = @"second";
    
    //設置item角標,右上角的紅色數字,未讀消息數
    secondNavC.tabBarItem.badgeValue = @"10";


    //去掉(默認) 
<pre name="code" class="objc">    secondNavC.tabBarItem.badgeValue = nil;

 //當前被選中的頁面/按鈕 myTabBar.selectedIndex = 0;  //將第三個界面加入 tabbar ThirdViewController *thirdVC = [[ThirdViewController alloc]init]; UINavigationController *thirdNavC = [[UINavigationController alloc]initWithRootViewController:thirdVC]; thirdNavC.tabBarItem.title = @"third"; //將所有視圖加入 tabbar myTabBar.viewControllers = @[navigationC,secondNavC,thirdNavC]; //設置默認頁 myTabBar.selectedIndex = 1; //設置爲根視圖控制器 RootTabBarViewController *rootTabBarVC = [[RootTabBarViewController alloc]init]; self.window.rootViewController = rootTabBarVC

 

 


UITabBarController自帶邏輯,點擊下面的分區bar會自動跳轉到相應的NavigationController下的ViewController

這是UITabBarItem的樣式和對應的枚舉值

三、自定義UITabBarViewController

系統的TabBar有時不能滿足我們的需求,我們可以更改它的外觀。

自定義一個UIView的視圖,貼在UITabBar的View上

將UITabBarController的tabbar屬性的hidden設置爲YES,就可以隱藏原有的tabbar顯示了。

先寫自定義的tabBarUIview,思路是做一個底部橫條視圖,給上面加上自定義的button,給button加上方法,該方法來改變系統的UITabBarController的selectedIndex值。

這裏涉及一個頁面間傳值的問題,可以使用block或者協議方法

customTabBarView.h

#import <UIKit/UIKit.h>

//block傳值

typedef void(^passValue)(NSInteger tag);

@protocol CustomTabBarDelegate <NSObject>

//把btn的tag傳出去的方法
-(void)selectedIndexWithTag:(NSInteger)tag;

@end

@interface CustomTabBarView : UIView

@property (nonatomic,copy)passValue passValueTag;
@property (nonatomic,assign)id <CustomTabBarDelegate>delegate;

@end

customTabBarView.m

//
//  CustomTabBarView.m
//  Class_09_UITabBarController02
//
//  Created by wanghao on 16/1/22.
//  Copyright © 2016年 wanghao. All rights reserved.
//

#import "CustomTabBarView.h"

@implementation CustomTabBarView

//創建按鈕
-(void)createSubViews
{
    
    for (int i = 0; i < 2; i ++) {
        //初始化按鈕
        UIButton *btn = [UIButton buttonWithType:UIButtonTypeCustom];
        [btn setTitle:[@(i) stringValue] forState:UIControlStateNormal];
        
        //點擊時的樣式
        [btn setTitle:@"選" forState:UIControlStateHighlighted];
        [btn setTitle:@"33" forState:UIControlStateFocused];
        [btn setImage:[[UIImage imageNamed:@"b33"]imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal] forState:UIControlStateSelected];
        [btn setTitle:@"" forState:UIControlStateSelected];
        
        //選中狀態
//        btn.selected = NO;
        
        //通過tag值來確定我們點擊的是哪一個按鈕,來切換到對應的視圖控制器
        [btn setTag:1000+i];
        
        //設置點擊方法
        [btn addTarget:self action:@selector(customSelectedIndex:) forControlEvents:UIControlEventTouchDown];
        
        //設置frame
        btn.frame = CGRectMake((414)/2*i, 0, 414/2, 50);
        
        
        [self addSubview:btn];
    }
}

//按鈕的回調方法
-(void)customSelectedIndex:(UIButton*)sender
{
    for (int  i = 0; i< 2; i++) {
        UIButton *btn = (UIButton*)[self viewWithTag:1000+i];
        btn.selected = NO;
    }
    
    sender.selected = YES;
    
//    判斷在指定的代理類中是否實現了該協議方法
//    確保執行時無此方法時不崩潰
    if([self.delegate respondsToSelector:@selector(selectedIndexWithTag:)])
    {
        [self.delegate selectedIndexWithTag:(sender.tag - 1000)];
    }
    else
    {
        NSLog(@"selectIndexWithTag該方法沒有實現");
    }
    
    //調用block方法
    //self.passValueTag(sender.tag - 1000);
    
}

//初始化自定義的UIView
-(instancetype)initWithFrame:(CGRect)frame
{
    //設置frame
    frame = CGRectMake(0, 736-50, 414, 50);
    
    self = [super initWithFrame:frame];
    if (self) {
        [self createSubViews];
        self.backgroundColor = [UIColor colorWithRed:109/255.0 green:211/255.0 blue:206/255.0 alpha:1];
    }
    
    return self;
}

@end

在RootTabBController.m中添加自定義的視圖,並隱藏原本的TabBar

這裏的secondViewController和FirstViewController就是跳轉後顯示的VC

//

#import "RootTabBarController.h"
#import "FirstViewController.h"
#import "SecondViewController.h"
#import "CustomTabBarView.h"

//導入協議
@interface RootTabBarController ()<CustomTabBarDelegate>

@end

@implementation RootTabBarController

-(void)viewDidLoad
{
    [super viewDidLoad];
    
    //創建視圖控制器
    FirstViewController *firstVC = [[FirstViewController alloc]init];
    UINavigationController *firstNavC = [[UINavigationController alloc]initWithRootViewController:firstVC];
    firstVC.view.backgroundColor = [UIColor colorWithRed:109/255.0 green:211/255.0 blue:206/255.0 alpha:1];
    
    SecondViewController *secondVC = [[SecondViewController alloc]init];
    UINavigationController *secondNavC = [[UINavigationController alloc]initWithRootViewController:secondVC];
    secondVC.view.backgroundColor = [UIColor colorWithRed:200/255.0 green:233/255.0 blue:160/255.0 alpha:1];
    
    //給tabBarController添加子控制器
    [self addChildViewController:firstNavC];
    [self addChildViewController:secondNavC];
    
    //使用自定義的tabbar先把系統的隱藏掉
    self.tabBar.hidden = YES;
    
    //初始化自定義的tabbar
    CustomTabBarView *customView = [[CustomTabBarView alloc]initWithFrame:CGRectZero];
    [self.view addSubview:customView];
    
    //指定代理
    customView.delegate = self;
    
    //設置block內容
    customView.passValueTag = ^(NSInteger tag)
    {
        self.selectedIndex = tag;
    };
    
}

//實現代理方法
- (void)selectedIndexWithTag:(NSInteger)tag
{
    self.selectedIndex = tag;
}


@end

做的比較醜和簡單

 

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章