Kickstarter-iOS源码地址 >>
用 Storyboard / Xib 创建 UI
以前，我们经常看到开发者们在争论：对于 UI 的创建，纯代码手写好还是用 Storyboard / Xib 好？这里就不对这个话题展开了，这么久过去了，相信各位开发者在自己的心里已经有了答案。下面我们看看 Kickstarter 是如何使用 Storyboard / Xib 来创建 UI 的。
首先告诉大家，Kickstarter的 UI 几乎都是用 Storyboard / Xib 来完成的。打开 Kickstarter-iOS/Views/Storyboards 文件夹，这里存储了应用的全部 .storyboard 和 .xib 文件。
使用 Storyboard 创建 UI，最怕的就是一个 .storyboard 文件包含了太多的 ViewController。所以 Kickstarter 为每一个小模块的功能单独创建了一个 Storyboard，并且当你点开每一个 Storyboard，你会发现大部分 Storyboard 只有一个 ViewController。这也很好解决了多人同时编辑一个 Storyboard 时导致的代码冲突问题，因为我们一般不会多人同时去开发一个小模块，把 Storyboard 分得很细之后，就不会出现多人同时编辑一个 Storyboard 的情况。
另外，Kickstarter 还定义了 Storyboard 和 Nib 枚举，列举了所有的 Storyboard 和 xib 文件，方便 ViewController 和 View 的初始化，这是一个非常漂亮的处理（以下代码省略了方法的具体实现）：
import UIKit
public enum Storyboard: String {
case Activity
case Backing
case BackerDashboard
// ...
public func instantiate<VC: UIViewController>(_ viewController: VC.Type,
inBundle bundle: Bundle = .framework) -> VC
}
import UIKit
public enum Nib: String {
case BackerDashboardEmptyStateCell
case BackerDashboardProjectCell
case CreditCardCell
// ...
}
extension UITableView {
public func register(nib: Nib, inBundle bundle: Bundle = .framework)
public func registerHeaderFooter(nib: Nib, inBundle bundle: Bundle = .framework)
}
protocol NibLoading {
associatedtype CustomNibType
static func fromNib(nib: Nib) -> CustomNibType?
}
extension NibLoading {
static func fromNib(nib: Nib) -> Self?
func view(fromNib nib: Nib) -> UIView?
}
PDF 格式的图标
在过去的 iOS 项目中，一般都使用 png 格式的图标。而在 Kickstarter 中，使用的是 pdf 格式的图标。我们先来看下 pdf 格式的图标有什么优点？
PDF 的全称是 Portable Document Format，是用于正确显示文档和图形的图像格式。PDF文件具有强大的矢量图形基础，可以用来保矢量图像。矢量图像本质上是巨大的数学方程，每个点、线和形状都由自己的方程表示。每一个“方程式”都可以被指定一种颜色、笔画或厚度来将形状变成艺术。与光栅图像不同，矢量图像与分辨率无关。当你缩小或放大一个矢量图像时，你的形状会变大，但你不会丢失任何细节或得到任何像素。因为您的图像将始终以相同的方式呈现，无论大小如何，都不存在有损或无损矢量图像类型。矢量图像通常用于logo、图标、排版和数字插图。
从上面我们可以了解到 pdf 格式的图标最大的优点是可以无损放大。还有，只需要一个 pdf 文件就可以代表一个图标，而png 图片一般至少需要两个（2x和 3x, 1x 一般不需要了）。除了这两个优点之外，我还发现 Kickstarter 中的 pdf 文件的大小只有 5k左右；而我们现有的项目中一个 png 图片就有 15k左右，两个 png 就 30k了，所以，使用 pdf 图片还可以一定程度上减少应用的大小。
颜色的管理
Kickstarter 项目中用到的颜色，是通过 ColorScript 脚本去生成的，这个我在之前的文章有讲到，具体可以查看 【Kickstarter-iOS 源码分析】02 - 项目相关 中的 ColorScript 部分。
完
想及时看到我的新文章的，可以关注我。同时也欢迎加入我管理的Swift开发群：536353151。
网友评论