UITableBarController 和UINavigationController类似, UITabBarController 也可以轻松地管理多个控制器,轻松完成控制器之间的切换,典型的例子就是QQ、微信等应⽤。效果如下图:
①使用UITabBarController步骤如下:
(1) 初始化UITabBarController
(2) 设置UIWindow的rootViewController为UITabBarController
(3)创建相应的子控制器(viewcontroller)
(4)把子控制器添加到UITabBarController
实现上述效果代码如下:
//创建第一个试图控制器
FirstViewController *firstVc = [[FirstViewController alloc] init];
//设置barButton标题
firstVc.tabBarItem.title = @"消息";
//角标
firstVc.tabBarItem.badgeValue = @"new";
//设置被选中时的图片
first Vc.tabBarItem.selectedImage = [UIImage imageNamed:@"tabbar_contacts"];
//设置图片
firstVc.tabBarItem.image = [UIImage imageNamed:@"tabbar_mainframe"];
firstVc.tabBarItem.tag = 100;//设置tag
//创建第二个控制器
SecondViewController *secondVc = [[SecondViewController alloc] init];
secondVc.tabBarItem.title = @"通讯里";
//被选中的时的图片
secondVc.tabBarItem.selectedImage = [UIImage imageNamed:@"tabbar_discover"];
secondVc.tabBarItem.badgeValue = @"33";
secondVc.tabBarItem.tag = 101;
//修改字体的位置
[secondVc.tabBarItem setTitlePositionAdjustment:UIOffsetMake(-1, -1)];
secondVc.tabBarItem.image = [UIImage imageNamed:@"tabbar_contacts"];
//第三个
ThirdViewController *thirdVc = [[ThirdViewController alloc] init];
thirdVc.tabBarItem.title = @"发现";
thirdVc.tabBarItem.tag = 102;
thirdVc.tabBarItem.badgeValue = @"2";
thirdVc.tabBarItem.image = [UIImage imageNamed:@"tabbar_discover"];
thirdVc.tabBarItem.selectedImage = [UIImage imageNamed:@"tabbar_me.png"];
//第四个
FoursViewController *fourVc = [[FoursViewController alloc] init];
fourVc.tabBarItem.title = @"我的";
fourVc.tabBarItem.tag = 103;
fourVc.tabBarItem.image = [UIImage imageNamed:@"tabbar_me.png"];
fourVc.tabBarItem.badgeValue = @"88";
fourVc.tabBarItem.selectedImage = [UIImage imageNamed:@"tabbar_discover"];
//第五个
FifthViewController *fifthVC = [[FifthViewController alloc] init];
fifthVC.tabBarItem.title = @"下载";
fifthVC.tabBarItem.image = [UIImage imageNamed:@"qr_toolbar_online_download_hl"];
//第六个
SixViewController *sixVc = [[SixViewController alloc] init];
sixVc.tabBarItem.title = @"工具";
sixVc.tabBarItem.image = [UIImage imageNamed:@"qr_toolbar_light_up_hl"];
//当标签视图控制器管理的视图控制器超过5个时.标签栏第五个标签自动变成More(更多)标签,
除了前四个标签,其余标签全部放入更多中.
//创建UITabBarController对象
UITabBarController *barVC = [[UITabBarController alloc] init];
//1.配置标签视图控制器所管理的多个视图控制器
barVC.viewControllers = @[firstVc,secondVc,thirdVc,fourVc,fifthVC,sixVc];
//3.修改标签栏的渲染颜色
barVC.tabBar.barTintColor = [UIColor whiteColor];
barVC.tabBar.tintColor = [UIColor blackColor];
//4.设置默认选中的标签
barVC.selectedIndex = 2;
//设置默认视图控制器
barVC.selectedViewController = thirdVc;
//5.给tabBar设置背景图片
//barVC.tabBar.backgroundImage = [UIImage imageNamed:@"320x49"];
//6.设置代理
barVC.delegate = self;
//7.将视图标签指定为window的根视图控制器
self.window.rootViewController = barVC;
②UITabBarController控制器常用代理方法如下:
//询问标签是否可选中
- (BOOL)tabBarController:(UITabBarController *)tabBarController
shouldSelectViewController:(UIViewController *)viewController {
return YES;
}
//当选中标签时触发
- (void)tabBarController:(UITabBarController *)tabBarController
didSelectViewController:(UIViewController *)viewController {
//需要选中的是第二个标签,则去掉角标
if (viewController.tabBarItem.tag == 101) {
viewController.tabBarItem.badgeValue = nil;
}
}
//将要开始自定义标签视图控制器所管理的多个视图控制器时触发,点击edit时
- (void)tabBarController:(UITabBarController *)tabBarController
willBeginCustomizingViewControllers:(NSArray *)viewControllers {
NSLog(@"%s %d",__FUNCTION__,__LINE__);
NSLog(@"%@",viewControllers);
}
//结束自定义标签视图控制器所管理的多个视图控制器时触发.点击done时
- (void)tabBarController:(UITabBarController *)tabBarController didEndCustomizingViewControllers:(NSArray *)viewControllers changed:(BOOL)changed {
NSLog(@"%s %d",__FUNCTION__,__LINE__);
NSLog(@"%@ \n %d",viewControllers,changed);
}
③UITabBar
下方的工具条称为UITabBar ,如果UITabBarController有N个子控制器,那么UITabBar内部就会有N 个UITabBarButton作为子控件与之对应。
注意: UITabBarButton在UITabBar中得位置是均分的,UITabBar的高度为49。
在上面的程序中,UITabBarController有6个子控制器,所以UITabBar中有6个UITabBarButton,UITabBar的结构⼤大致如下图所示:
UITabBarButton ⾥面显⽰什么内容,由对应子控制器的 tabBarItem 属性来决定.如下:设置
firstVc.tabBarItem.title = @"消息";
//角标
firstVc.tabBarItem.badgeValue = @"new";
//设置被选中时的图片
first Vc.tabBarItem.selectedImage = [UIImage imageNamed:@"tabbar_contacts"];
//设置图片
firstVc.tabBarItem.image = [UIImage imageNamed:@"tabbar_mainframe"];
注意:视图展示的顺序和添加的顺序一致,和导航控制器中不同,展现在眼前的是第一个添加的控制器对应的View。
2.UIToorBar
工具条,主要搭配导航控制器使用,由导航控制器控制,主要用来存储一些系统的辅助功能.在网页切换,微信的评论等.
可以在toolBar上添加任何View。其实它的原理是把你要添加的View先加到UIBarButtonItem里面,最后再把UIBarButtonItem数组一次性放到toolbar的items里面。
-initWithTitle
-initWithImage
-initWithBarButtonSystemItem
-initWithCustomView
实现效果如下:
实现代码如下:
//创建UIToorBar对象
UIToolbar *toolBar = [[UIToolbar alloc] initWithFrame:CGRectMake(0, 64, 320, 49)];
toolBar.translucent = NO;//配置属性,毛玻璃效果
toolBar.barTintColor = [UIColor greenColor];//背景颜色
//设置字体样式
toolBar.tintColor = [UIColor purpleColor];
//toolbar样式
//toolBar.barStyle = UIBarStyleBlackOpaque;
//设置图片
[toolBar setBackgroundImage:[UIImage imageNamed:@"user_guide_page6"] forToolbarPosition:UIBarPositionBottom barMetrics:UIBarMetricsDefault];
//添加到视图控制器的根视图上
[self.view addSubview:toolBar];
[toolBar release];
//UIBarButtonItem初始化方法1(initWithTitle)
UIBarButtonItem *barItems = [[UIBarButtonItem alloc] initWithTitle:@"妞1"
style:UIBarButtonItemStylePlain target:self action:@selector(handleBarAction:)];
//系统button
//UIBarButtonItem初始化方法2(initWithBarButtonSystemItem)
UIBarButtonItem *addItems = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:
UIBarButtonSystemItemAdd target:self action:@selector(handleAddAction:)];
//添加图片<pre name="code" class="objc"> //UIBarButtonItem初始化方法3(initWithImage)
UIBarButtonItem *imageItems = [[UIBarButtonItem alloc] initWithImage:[UIImage imageNamed:@"post_timeline_mood_icon_1"]
style:UIBarButtonItemStylePlain target:self action:@selector(handleReplyAction:)];
<pre name="code" class="objc"> //UIBarButtonItem初始化方法2(initWithBarButtonSystemItem)
UIBarButtonItem *items = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:
UIBarButtonSystemItemFlexibleSpace target:self action:nil];
//调节buttonItem之间的间距
UIBarButtonItem *fiex = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:
UIBarButtonSystemItemFixedSpace target:self action:nil];
fiex.width = 50;
//将UIBarButtonItem添加到数组
//fiex 和items 起到调节按钮之间的位置
NSArray *itemsArr1 = @[items,barItems,fiex,items,addItems,items,imageItems,items];
NSLog(@"%@",itemsArr1);
//NSArray *itemsArr = @[fiex,barItems,fiex,addItems,fiex,imageItems,fiex];
//添加
[toolBar setItems:itemsArr animated:YES];
[barItems release];
[itemsArr release];