一、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
做的比較醜和簡單