iOS开发UI篇—UITabBarController简单介绍
iOS开发UI篇—UITabBarController简单介绍
iOS开发UI篇—UITabBarController简单介绍
一、简单介绍
UITabBarController和UINavigationController类似,UITabBarController也可以轻松地管理多个控制器,轻松完成控制器之间的切换,典型的例子就是QQ、微信等应⽤。
二、UITabBarController的使用
1.使用步骤:
(1)初始化UITabBarController
(2)设置UIWindow的rootViewController为UITabBarController
(3)创建相应的子控制器(viewcontroller)
(4)把子控制器添加到UITabBarController
2.代码示例
新建一个空的文件,在Application的代理中编码
YYAppDelegate.m文件
1 //
2 // YYAppDelegate.m
3 // 01-UITabBar控制器基本使用
4 //
5 // Created by 孔医己 on 14-6-7.
6 // Copyright (c) 2014年 itcast. All rights reserved.
7 //
8
9 #import "YYAppDelegate.h"
10
11 @implementation YYAppDelegate
12
13 - (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
14 {
15 //1.创建Window
16 self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
17 self.window.backgroundColor = [UIColor whiteColor];
18
19 //a.初始化一个tabBar控制器
20 UITabBarController *tb=[[UITabBarController alloc]init];
21 //设置控制器为Window的根控制器
22 self.window.rootViewController=tb;
23
24 //b.创建子控制器
25 UIViewController *c1=[[UIViewController alloc]init];
26 c1.view.backgroundColor=[UIColor grayColor];
27 c1.view.backgroundColor=[UIColor greenColor];
28 c1.tabBarItem.title=@"消息";
29 c1.tabBarItem.image=[UIImage imageNamed:@"tab_recent_nor"];
30 c1.tabBarItem.badgeValue=@"123";
31
32 UIViewController *c2=[[UIViewController alloc]init];
33 c2.view.backgroundColor=[UIColor brownColor];
34 c2.tabBarItem.title=@"联系人";
35 c2.tabBarItem.image=[UIImage imageNamed:@"tab_buddy_nor"];
36
37 UIViewController *c3=[[UIViewController alloc]init];
38 c3.tabBarItem.title=@"动态";
39 c3.tabBarItem.image=[UIImage imageNamed:@"tab_qworld_nor"];
40
41 UIViewController *c4=[[UIViewController alloc]init];
42 c4.tabBarItem.title=@"设置";
43 c4.tabBarItem.image=[UIImage imageNamed:@"tab_me_nor"];
44
45
46 //c.添加子控制器到ITabBarController中
47 //c.1第一种方式
48 // [tb addChildViewController:c1];
49 // [tb addChildViewController:c2];
50
51 //c.2第二种方式
52 tb.viewControllers=@[c1,c2,c3,c4];
53
54
55 //2.设置Window为主窗口并显示出来
56 [self.window makeKeyAndVisible];
57 return YES;
58 }
59
60 @end
实现效果:
三、重要说明
1.UITabBar
下方的工具条称为UITabBar ,如果UITabBarController有N个子控制器,那么UITabBar内部就会有N 个UITabBarButton作为子控件与之对应。
注意:UITabBarButton在UITabBar中得位置是均分的,UITabBar的高度为49。
在上面的程序中,UITabBarController有4个子控制器,所以UITabBar中有4个UITabBarButton,UITabBar的结构⼤大致如下图所示:
2.UITabBarButton
UITabBarButton⾥面显⽰什么内容,由对应子控制器的tabBarItem属性来决定
c1.tabBarItem.title=@"消息";
c1.tabBarItem.image=[UIImage imageNamed:@"tab_recent_nor"];
3.有两种方式可以往UITabBarController中添加子控制器
(1)[tb addChildViewController:c1];
(2)tb.viewControllers=@[c1,c2,c3,c4];
注意:展示的顺序和添加的顺序一致,和导航控制器中不同,展现在眼前的是第一个添加的控制器对应的View。
学习笔记:UITabBarController使用详解
首先我们看一下它的view层级图:
一、手动创建UITabBarController
最常见的创建UITabBarController的地方就是在application delegate中的 applicationDidFinishLaunching:方法,因为UITabBarController通常是作为整个程序的rootViewController的,我们需要在程序的window显示之前就创建好它,具体步骤如下:
1、创建一个UITabBarController对象
2、创建tabbarcontroller中每一个tab对应的要显示的对象
3、通过UITabBarController的viewController属性将要显示的所有content viewcontroller添加到UITabBarController中
4、通过设置UITabBarController对象为window.rootViewController,然后显示window
下面看一个简单的例子:
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions { self.window = [[[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]] autorelease]; // Override point for customization after application launch.
SvTabBarFirstViewController *viewController1, *viewController2;
viewController1 = [[SvTabBarFirstViewController alloc] initWithNibName:nil bundle:nil]; viewController1.title = @"First"; viewController2 = [[SvTabBarFirstViewController alloc] initWithNibName:nil bundle:nil]; viewController2.title = @"Second"; self.tabBarController = [[[UITabBarController alloc] init] autorelease]; self.tabBarController.delegate = self; self.tabBarController.viewControllers = [NSArray arrayWithObjects:viewController1, viewController2, nil];
[viewController1 release]; [viewController2 release]; self.window.rootViewController = self.tabBarController; [self.window makeKeyAndVisible]; return YES; }
二、UITabBarItem
UITabBar上面显示的每一个Tab都对应着一个ViewController,我们可以通过设置viewcontroller.tabBarItem属性来改变tabbar上对应的tab显示内容。否则系统将会根据viewController的title自动创建一个,该tabBarItem只显示文字,没有图像。当我们自己创建UITabBarItem的时候,我们可以显示的指定显示的图像和对应的文字描述。当然还可以通过setFinishedSelectedImage:withFinishedUnselectedImage:方法给选中状态和飞选中状态指定不同的图片。下面看个自己创建UITabBarItem的小例子:
UITabBarItem *item = [[UITabBarItem alloc] initWithTitle:@"Second" image:nil tag:2]; [item setFinishedSelectedImage:[UIImage imageNamed:@"second.png"] withFinishedUnselectedImage:[UIImage imageNamed:@"first.png"]]; viewController2.tabBarItem = item; [item release];
此外UITabBarItem还有一个属性badgeValue,通过设置该属性可以在其右上角显示一个小的角标,通常用于提示用户有新的消息,使用很简单,后面有例子。
三、moreNavigationController
UITabBar上最多可以显示5个Tab,当我们往UITabBarController中添加超过的viewController超过5个时候,最后一个一个就会自动变成,按照设置的viewControlles的顺序,显示前四个viewController的tabBarItem,后面的tabBarItem将不再显示。当点击more时候将会弹出一个标准的navigationViewController,里面放有其它未显示的的viewController,并且带有一个edit按钮,通过点击该按钮可以进入类似与ipod程序中设置tabBar的编辑界面。编辑界面中默认所有的viewController都是可以编辑的,我们可以通过设置UITabBarController的customizableViewControllers属性来指定viewControllers的一个子集,即只允许一部分viewController是可以放到tabBar中显示的。但是这块儿要注意一个问题就是每当UITabBarController的viewControllers属性发生变化的时候,customizableViewControllers就会自动设置成跟viewControllers一致,即默认的所有的viewController都是可以编辑的,如果我们要始终限制只是某一部分可编辑的话,记得在每次viewControlles发生改变的时候,重新设置一次customizableViewControllers。
四、UITabBarController的Rotation
UITabBarController默认只支持竖屏,当设备方向放生变化时候,它会查询viewControllers中包含的所有ViewController,仅当所有的viewController都支持该方向时,UITabBarController才会发生旋转,否则默认的竖向。
此处需要注意当UITabBarController支持旋转,而且发生旋转的时候,只有当前显示的viewController会接收到旋转的消息。
五、UITabBar
UITabBar自己有一些方法是可以改变自身状态,但是对于UITabBarController自带的tabBar,我们不能直接去修改其状态。任何直接修改tabBar的操作将会抛出异常,下面看一个抛出异常的小例子:
self.tabBarController = [[[UITabBarController alloc] init] autorelease]; self.tabBarController.delegate = self; self.tabBarController.viewControllers = [NSArray arrayWithObjects:viewController1, viewController2, viewController3, nil]; self.window.rootViewController = self.tabBarController; [self.window makeKeyAndVisible]; self.tabBarController.tabBar.selectedItem = nil;
上面代码的最后一行直接修改了tabBar的状态,运行程序回得到如下结果:
六、Change Selected Viewcontroller
改变UITabBarController中当前显示的viewController,可以通过一下两种方法:
1、selectedIndex属性
通过该属性可以获得当前选中的viewController,设置该属性,可以显示viewControllers中对应的index的viewController。如果当前选中的是MoreViewController的话,该属性获取出来的值是NSNotFound,而且通过该属性也不能设置选中MoreViewController。设置index超出viewControllers的范围,将会被忽略。
2、selectedViewController属性
通过该属性可以获取到当前显示的viewController,通过设置该属性可以设置当前选中的viewController,同时更新selectedIndex。可以通过给该属性赋值
tabBarController.moreNavigationController可以选中moreViewController。
3、viewControllers属性
设置viewControllers属性也会影响当前选中的viewController,设置该属性时UITabBarController首先会清空所有旧的viewController,然后部署新的viewController,接着尝试重新选中上一次显示的viewController,如果该viewController已经不存在的话,会接着尝试选中index和selectedIndex相同的viewController,如果该index无效的话,则默认选中第一个viewController。
七、UITabBarControllerDelegate
通过代理我们可以监测UITabBarController的当前选中viewController的变化,以及moreViewController中对编辑所有viewController的编辑。通过实现下面方法:
- (BOOL)tabBarController:(UITabBarController *)tabBarController shouldSelectViewController:(UIViewController *)viewController;
该方法用于控制TabBarItem能不能选中,返回NO,将禁止用户点击某一个TabBarItem被选中。但是程序内部还是可以通过直接setSelectedIndex选中该TabBarItem。
下面这三个方法主要用于监测对moreViewController中对view controller的edit操作
- (void)tabBarController:(UITabBarController *)tabBarController willBeginCustomizingViewControllers:(NSArray *)viewControllers; - (void)tabBarController:(UITabBarController *)tabBarController willEndCustomizingViewControllers:(NSArray *)viewControllers changed:(BOOL)changed; - (void)tabBarController:(UITabBarController *)tabBarController didEndCustomizingViewControllers:(NSArray *)viewControllers changed:(BOOL)changed;
七、附件UITabBarController测试程序源码
SvTabBarAppDelegate.h这个头文件,折叠后加进去,总是无法展开,望大家见谅!
// // SvTabBarAppDelegate.h // SvTabBarControllerSample // // Created by maple on 5/19/12. // Copyright (c) 2012 smileEvday. All rights reserved. // #import <UIKit/UIKit.h> @interface SvTabBarAppDelegate : UIResponder <UIApplicationDelegate, UITabBarControllerDelegate> @property (strong, nonatomic) UIWindow *window; @property (strong, nonatomic) UITabBarController *tabBarController; @end