Three20 模组架构简介(下)
整体架构图
在开始之前,我们先复习一下Three20的阶层架构,我们在先前的文章中介绍了Three20Core、Three20UICommon和 Three20Network这三个底层framework,而这一次我们将转到上面三个比较高阶、与UI相关的framework ,也是Three20 让人感到最惊奇、最强大的部份。
------------------------------------------
| UI |
------------------------------------------
| UINavigator | | Style |
|--------------| |------------|
| UICommon | | Network |
------------------------------------------
| Core |
------------------------------------------
Three20UINavigator
在Three20中一个很重要的创新突破便是URL-based navigation,透过这个机制我们可以将程式中原本切换画面(Push、ModalView、TabBar)的繁琐程式码,简化为开启URL的动作。这个概念对Web开发者而言应该相当熟悉,诚如我们在Three20介绍文章中提到过,Three20的诞生起源于Facebook的iPhone版应用程式,所以我们很容易在Three20这个framework中看到许多关于Web framework的概念。在Three20UINavigator中我们可以看到以下类别:
* TTBaseNavigator – 负责开启URL的工作,只有部份功能、完整的TTNavigator则包含在Three20UI中
* TTURLAction – 除了要开启的URL位置外,也有一些其他的Property可以设定、作为开启URL的选项
* TTURLMap – 负责URL与View Controllers之间的转换、Mapping
除此之外,Three20UINavigator也有提供一些取得Frame、Bounds以及状态列高度的方法,有兴趣的读者可以参考TTGlobalNavigatorMetrics.h这只档案中的内容。 URL-Based Navigation的内容较多,笔者会在未来另外撰文解释、说明。
Three20Style
除了上述提到的URL-based Navigation外,Three20也引入了一个在Web开发上相当常见的Stylesheet概念。一般而言,我们若是在iPhone上面设计使用者介面时,必须针对每一个UI元件手动设定样式,像是文字的字体、大小,或者是工具列的颜色等等。然而透过TTStyle和TTStyleSheet的设定,就可以免除我们每次重复设定UI元件样式的麻烦。此外,也有TTStyleLayout、TTStyleText等相关的类别,和一些UIKit的新增方法,像是:
* UIImage
o - (UIImage*)transformWidth:(CGFloat)width height:(CGFloat)height rotate:(BOOL)rotate; – 转换图片大小、旋转图片
o - (void)drawInRect:(CGRect)rect radius:(CGFloat)radius; – 画出有圆角的图案
* UIColor
o - (UIColor*)highlight; – 回传一个比现有颜色在更亮的颜色
o - (UIColor*)shadow; – 同上,不过相反地回传一个较暗的颜色
o - (UIColor*)copyWithAlpha:(CGFloat)newAlpha; – 回传一个同样的颜色,但alpha不同
关于Style的部份的内容笔者也同样会另外撰文介绍,敬请期待。
Three20UI
在先前framework的层层堆叠后,总算是到了最上层、也是最重要的Three20UI了。 Three20UI这个framework中包含了相当多的类别,大概可以分成三类:
* UIKit内建类别的新增方法
* Three20新增的View Controllers
* Three20新增的UI元件
以UIKit的新方法而言, 以下几个是比较有趣、值得注意的:
* UINavigationController
o - (void)pushViewController:(UIViewController*)controller animatedWithTransition:(UIViewAnimationTransition)transition; – 加入新的Controller、但是使用非预设的动画效果
o - (UIViewController*)popViewControllerAnimatedWithTransition:(UIViewAnimationTransition)transition; – 同上、但是是移除Controller
* UITabBarController
o - (void)setTabURLs:(NSArray*)URLs; – 传入一组URL作为tabs
* UITableView
o - (void)scrollToTop:(BOOL)animated; – 将Table卷动到最上方
o - (void)scrollFirstResponderIntoView; – 卷动到目前开启虚拟键盘的元件
* UIView
o - (void)removeAllSubviews; – 移除全部subviews
* UIWebView
o - (CGRect)frameOfElement:(NSString*)query; – 回传某DOM物件的frame,传入值为一JavaScript expression
而Three20UI中所提供的额外View Controllers也是相当的丰富,像是:
* TTViewController – Three20所使用的View Controller基础类别
* TTWebViewController – 一个功能完整的网页浏览Controller
* TTActionSheetController – 将UIActionSheet包装成Controller的形式,传入URL作为按钮
* TTAlertController – 同上,将UIAlertView包装成Controller方便使用
另外还有许多View Controller,有兴趣的读者可以参考先前介绍文章中的萤幕截图、还有TTCatlog这个范例程式。
结论
在这两篇文章中我们针对了Three20的各个模组做了一个概要性的简介,在下一篇文章中我们将谈谈Three20中的额外扩充framework,也就是JSON/XML framework,还请各位读者多多指教。