主页 > Q生活店 >CS193P第七堂课摘要及心得笔记 >

CS193P第七堂课摘要及心得笔记

发布时间:2020-06-06   来源:Q生活店    

上次的笔记中我们提到了 View Controller 的基础,以及如何建立自己的 View Controller。在这一次的课程内容中,我们将学习到如何使用 UIKit 所提供的 View Controllers 来帮助我们建立程式的导览。

第七次的课堂中,主要涵盖了一下几个主题:

  1. Navigation Controller
  2. Controller 间的资料传递
  3. 自订导览列
  4. Tab Bar Controller
  5. 结合两种形式
Navigation Controller

在上一次的 iPhone 开发课程笔记 中我们谈到了 View Controller 的建立方法以及概念,概括而言,View Controller 在 iPhone 程式当中扮演着主干的角色,负责衔接 View 和 Model。

而在上回笔记中的后段,我们也曾经谈过我们可以透过 UIKit 中所提供的 View Controller 来衔结我们自己的 View Controller,建立出整个程式的动线。而 Navigation Controller 就是常用的一种。很多 iPhone 的程式中都有 Navigation Controller,像是当我们在专辑列表中选择了某一张专辑,随集会从萤幕左边带入歌曲的列表,我们也可以点左上角的返回按钮回到专辑列表,这样的导览模式就是 Navigation Controller。

而 Navigation Controller 的画面就如下所示,在中间显示了目前在 Stack 最上端的 Controller 的 View,在上面则是这个 Controller 的 title,左上角的上一页按钮则是前一个 Controller 的 title。

CS193P第七堂课摘要及心得笔记

就实做上来说,Navigation Controller 下面包含了许多需要显示的 View Controllers,用 Stack 的方式集合在一起。当我们需要换页的时候,我们只需要 push 一个 View Controller 进去,而需要回到上一页则是透过 pop 一个 View Controller 来达成。

- pushViewController:viewController animated:animated; // 换到新的 Controller - popViewControllerAnimated:animated; // 回到上一个 Controller - setViewControllers:viewControllers animated:animated; // 整组换掉,在 iPhone OS 3.0 后加入

上面这几个方法中,animated 这个参数决定了换页时是否会有动画的效果。在大多数的情况下,我们当然想要显示换页的效果,但是当程式刚启动、初始化时,在加入第一个 VIew Controller 的时,我们就不需要动画的效果。

值得一提的是,我们一般很少会直接呼叫 pop 方法,因为在使用者按下左上角的退回按钮时就会自动呼叫这个方法了。

在投影片的第 19 页和 22 有分别介绍如何初始化一个 Navigation Controller 以及如何加入新的 Controller,有兴趣的读者还请参考。比较需要注意的是,当我们初始化完 NavigationController 之后,要记得把 NavigationController 的 view 加入到 window 的 subview 中,否则画面上不会显示。

Controller 间的资料传递

在程式的进行中,会有很多 Controller 被建立或是移除,那我们要怎幺让这些 Controller 能够互相沟通呢?用下图的例子作为举例,List Controller 包含了所有资料的列表,而 Detail Controller 则是会显示被选取道的资料内容。

CS193P第七堂课摘要及心得笔记

由 List Controller 传递资料到 Detail Controller 的方法相当简单,由于后者的初始化会由前者进行,所以只要定义好初始化的参数就没问题了。然而,要从后者传递给前者,我们会使用 Delegate 的方式,也就是建立一组 protocol,让 List Controller 去实做,当 Detail Controller 需要传递讯息时则呼叫 List Controller 的对应方法就行了。

自订导览列

Navigation Controller 所产生的萤幕画面最上方有条导览列,包含了标题还有一些按钮,我们可以透过修改 UINavigationItem 来达成我们想要的效果。每个 View Controller 都包含一个 UINavigationItem,然而只有在 Navigation Controller 的 Stack 最上方的才会被显示。

CS193P第七堂课摘要及心得笔记

如果我们修改标题的话,并不需要修改 UINavigationItem,因为 View Controller 中就有一个 title 的 property,UINavigationItem 会自动继承这个 property 来显示。

至于按钮的部份,UIKit 提供了三种不同的按钮,分别是字串的显示、图片的显示和系统内建的按钮。而这些按钮就如同一般按钮一样,用的是 target-action 的概念,在投影片的第 50 到 59 页中有範例的程式码,读者可以直接複製使用。

CS193P第七堂课摘要及心得笔记

此外,我们也可以在原本 title 的地方显示一个 View 而非单纯的字串,只要将 self.navigationItem.titleView 指定为想要显示的 View 即可。

CS193P第七堂课摘要及心得笔记

最后,因为退回按钮是直接使用 NavigationController 中 Stack 的前一项 Controller 的 title,有时候会出现文字过长的情形,请参考投影片的第 66 页的作法,另行设定一个按钮替换,就可以解决这个问题了。

CS193P第七堂课摘要及心得笔记
Tab bar Controller

谈完了 NavgationController,我们当然也没有忘记 TabBarController。TabBarController 就是我们在各个 App 中看到下方有一排按钮,每个按钮分别会切换到不同的 View Controller。

CS193P第七堂课摘要及心得笔记

在投影片 78 页中可以看到,建立 TabBarController 的作法跟 NavigationController 相同,一样要记得加入到 window 的 subviews 当中,才会在萤幕上显示。

如同 UINavigationItem 一样,每个 View Controller 也包含了一个 UITabBarItem 物件,由文字及图案组成,而 UIKit 也提供了一些系统内建的按钮可以使用。建立按钮的程式码在投影片的第 84 和 87 页,大家还多多参考。要注意的是,除了用程式建立 UITabBarItem 之外,我们也可以透过 Interface Builder 来建立,相对是比较容易、简单。

结合两种形式

最后,我们也可以结合以上两种形式,由 Tab Bar Controller 作为基础,加入 Navigation Controller 或是其他自订的 View Controller,这样一来就形成了一般常见的 iPhone 应用程式架构了。

CS193P第七堂课摘要及心得笔记
结论

在这次的课程中,我们学习到了两种导览用的 View Controlles 的使用方法。在下一次的内容中,我们将看到如何透过 Table View Controller 来显示大量资料,并且处理捲动的效果,还请各位读者敬请期待!

参考资源

上一篇: 下一篇: