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使用详解

UITabBarController是IOS中很常用的一个viewController，例如系统的闹钟程序，ipod程序等。UITabBarController通常作为整个程序的rootViewController，而且不能添加到别的container viewController中。 

　　首先我们看一下它的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

 

 

标签: IOS开发, UI高级

绿色通道： 好文要顶 关注我 收藏该文与我联系