doproio / practice-of-ios

practice-of-ios
24 stars 4 forks source link

【第六章学习笔记】分栏控制器的基本概念和用法 #8

Open hkz404 opened 10 years ago

hkz404 commented 10 years ago

UITabBarController 的基本概念

UINavigationController 和 UITabBarController(分栏控制器)一样是用来管理视图控制器的。前者管理视图控制器之间的导航,后者管理固定的几个视图控制器,子控制器是并列的,可以任意切换显示。

注意:UINavigationController 采用栈的方式来管理视图控制器,但 UITabBarController 在切换不同视图控制器的时候,是不会销毁视图的,除非内存告警,但是该视图的视图控制器依旧存在。

UITabBarController 的样式

qq20141025-1 2x

示例代码

/* 先声明和初始化视图控制器 */
UIViewController * vc1 = [[UIViewController alloc] init];
vc1.title = @"主页";

UIViewController * vc2 = [[UIViewController alloc] init];
vc2.view.backgroundColor = [UIColor redColor];
vc2.title = @"消息";

UIViewController * vc3 = [[UIViewController alloc] init];
vc3.view.backgroundColor = [UIColor grayColor];
vc3.title = @"搜索";

UIViewController * vc4 = [[UIViewController alloc] init];
vc4.view.backgroundColor = [UIColor brownColor];
vc4.title = @"设置";

NSArray * vcs = [NSArray arrayWithObjects: vc1, vc2, vc3, vc4, nil];
NSArray * vcs = @[vc1, vc2, vc3, vc4]; /* 更简洁的写法 */

UITabBarController * tc = [[UITabBarController alloc] init];
tc.viewControllers = vcs;

[self.window setRootViewController: tc];

UITabBarController 的结构

qq20141025-2 2x

与 UINavigationController 不同,UITabBarController 使用数组管理子视图控制器,并且子视图控制器之间是平等关系。

UITabBarController 类图分析

qq20141025-3 2x

我们已经知道一个 UITabBarController 控制着若干个由数组管理的视图控制器,一般最多显示 5 个,如果超过 5 个,则会出现一个 More 的按钮。

一个 UITabBarController 只有一个 UITabBar 视图,用于显示 UITabItem 视图,正如一个 UINavigationController 只有一个 UINavigationBar 视图,用于显示 UINavigationItem 视图。

如果子视图控制器想要设置 UITabBar 的话,就需要通过 UITabBarItem 来设置,它是每个子视图控制器都拥有的。正如 UINavigationController 中子视图控制器想要管理 UINavigationBar 的话,需要通过 UINavigationBarItem 来设置。

注意:UITabItem 不能拥有自定义视图,也就是无法自定义样式。使用的图片都会被转换成单色图。

UITabBarController 代理方法

/* 视图控制器将被选择 */
- (BOOL)tabBarController:(UITabBarController *)tabBarController shouldSelectViewController:(UIViewController *)viewController;

/* 视图控制器已被选择 */
- (void)tabBarController:(UITabBarController *)tabBarController didSelectViewController:(UIViewController *)viewController;

UITabBarController 与 UINavigationController 的结合

一般是 UINavigationController 作为一个子视图控制器放在 UITabBarController 下。

qq20141025-4 2x

UITabBar 视图的组成

另外,通过 badgeValue 可以设置红色标记:

self.tabBarItem.badgeValue = @"New";

qq20141025-5 2x

也可以给程序图标设置:

[UIApplication sharedApplication].applicationIconBadgeNumber = 8;

qq20141025-6 2x

定制 UITabBar

隐藏 UITabBarController 的 UITabBar,然后创建一个 View 视图代替,在此 View 上添加 UIButton 代替 Tab 标签。

iOS 5.x 提供了新方法用于定义用户自己的 UITabBar:

@property(nonatomic, retain) UIImage * backgroundImage; /* 设置 UITabBar 背景图片 */
@property(nonatomic, retain) UIImage * selectionIndicatorImage; /* 设置选中图片 */

隐藏 UITabBar

self.hidesBottomBarWhenPushed = YES; /* UINavigationController 的子视图控制器中调用,必须在 init 方法中调用才能生效,而且隐藏后无法复原 */
hkz404 commented 10 years ago

作业

知识点一(4分):UITabBarController 创建一个包含五个 tabItem 的分栏控制器,点击后分别显示不同背景颜色的视图控制器(图标可随意使用系统自带的)。

知识点二(6分):在第二个视图控制器中添加一个按钮,点击之后会在第二个 tabItem 中增加一个未读小圆点,数字随按钮点击次数递增。

知识点三(10分):UITabBarController 与 UINavigationController 结合 在 tab1 中使用 UINavigationController,点击按钮可以跳转到另外一个界面,并有一个返回的按钮,同时隐藏 TabBar。

知识点四(16分):自定义 TabBar 自定义 TabBar ,手动实现背景高亮、TabBar 隐藏、模拟 TabBar 点击切换子视图控制器。

参考:https://modao.io/app/zQ99r8k6L19G2DagHIh5