Swift, ReactiveCocoa第一个app

分享到:  QQ好友和群QQ好友和群 QQ空间QQ空间 腾讯微博腾讯微博 腾讯朋友腾讯朋友 微信微信
查看查看325 回复回复1 收藏收藏 分享淘帖 转播转播 分享分享 微信
查看: 325|回复: 1
收起左侧

Swift, ReactiveCocoa第一个app

[复制链接]
3rdev 发表于 2016-6-23 17:45:38 | 显示全部楼层 |阅读模式
快来登录
获取优质的苹果资讯内容
收藏热门的iOS等技术干货
拷贝下载Swift Demo源代码
订阅梳理好了的知识点专辑




0、引言

这篇文章将纪录用Swift语言配合ReactiveCocoa写一个伪搜索引擎app的历程。

大量参考了RayWenderlich.com上的文章(原文链接1原文链接2)。原文是针对Objective C的,但是现在Swift都已经更新到了3.0(虽然因为作者没有developer id,用的还是2.2),ReactiveCocoa也更新到了4.2,原来的大多数技术都已经不能直接使用了(ReactiveCocoa的开发者甚至说在未来的5.0版本中要移除Objective C的支持)。作者为此也走过不少弯路,参考了多方资料,最终完成了这个sample app,希望可以让别人少走一点弯路。

作者推荐新接触iOS的开发者在学完基础的swift之后直接使用ReactiveCocoa+Swift来写代码,这将节省大量的精力。




1、ReactiveCocoa简介

(翻译自RayWenderlich.com,有改动)

作为iOS开发者,我们写的每一行代码几乎都是在和“事件”打交道,例如用户点击了一个按钮,网络上发来一条信息,一个属性值的变化(Key Value Observation),或者是用户的位置改变了。但是,CocoaTouch把这些事件以不同的格式封装在了一起,例如target-action, delegate, KVO, 回调之类的。这就给开发带来了很大的麻烦,降低了代码的可读性,随之而来的就是更多的维护成本和更多的bug。ReactiveCocoa把这一切封装到了一个标准的接口中,这样它们就可以很容易地被组合、过滤。

ReactiveCocoa把函数式编程和响应式编程组合在了一起。(更多可以查看敏捷大拇指的《Swift的响应式编程革命 Reactive Revolution of Swift》)

  • 函数式编程:这种编程方式使用了高阶函数,也就是把其他函数作为参数的函数(作者认为RayWenderlich.com的解释不太好。作者认为函数式编程就是一个不同的计算机架构方式。它注重数学在计算机科学中发挥的作用,把函数理解成真正的数学上的函数。其核心就是没有Side Effect,也没有变量。这非常好的避免了并发编程中的很多问题,因而在这两年逐渐流行。Swift中有良好的函数式编程支持,其语法对著名而经常使用的Monad结构的支持甚至比经典的Haskell语言还好)
  • 响应式编程:这种编程方式注重数据流的传播和管道式的程序结构。这种结构也是为了复杂的并发程序而生的,先天具有简洁、安全的特点。


因为这个原因,ReactiveCocoa也被称为是一个函数响应式编程框架。

这里就不再在学术上深究了,打开Xcode吧!




2、程序结构设计

程序最终运行的效果如下:

Swift, ReactiveCocoa第一个app 1

Swift, ReactiveCocoa第一个app - 敏捷大拇指 - Swift, ReactiveCocoa第一个app 1


当用户在文本框中输入长度大于4的文本时,下方的列表就会显示和用户输入字符长度相同的“搜索结果”(为了保持简单,这里就直接生成了一些字符串,而不是去调用搜索引擎的API)。并且只有当用户的输入在0.5秒中没有变化时,动作才会被触发。由于非常简单,不考虑错误处理。由于真正的Web API需要访问网络,引发异步事件,这个程序如果使用普通的方法将具有相当的复杂性。

程序内部将采用管道式,数据流经过管道之后最终将被一个UITableView显示。由于Swift中变量绑定的问题,程序并未采用MVVM设计模式,代码中的ViewModel只是一个保存数据的容器。(未来将会改进为MVVM模式,更多MVVM模式的知识也可以在敏捷大拇指上查到。)




那么就 开始吧!



第一步

建立一个iOS工程,类型是Single View Application,设备选择iPhone(方便UI设计),语言选择swift。




3、安装ReactiveCocoa

ReactiveCocoa官方推荐使用Carthage安装。(当然CocoaPod用不了,原因你懂的)Carthage安装外部库的操作非常简单:

  • 打开终端,定位到工程的根目录下(即*.xcodeproj所在的地方),使用文本编辑器建立一个Cartfile

    在终端输入nano Cartfile 在新建立的文件中加入一行github "ReactiveCocoa/ReactiveCocoa" Control-O保存,Control-X离开 回到终端,输入命令carthage update 等待Carthage下载并编译框架 (如果尚未安装Carthage,可以到官网下载二进制文件,或者用Homebrew:brew install carthage)
  • 打开工程文件,在General选项卡下加入刚刚编译出的framework文件(注意到还有一个Result.framework):

    Swift, ReactiveCocoa第一个app 2

    Swift, ReactiveCocoa第一个app - 敏捷大拇指 - Swift, ReactiveCocoa第一个app 2

  • 在Build Phases选项卡下加入一个新的Run Script,并添加文件,最终看起来应该是这样(命令需要手工输入 如果不说Homebrew安装的Carthage,路径可能不一样):

    Swift, ReactiveCocoa第一个app 3

    Swift, ReactiveCocoa第一个app - 敏捷大拇指 - Swift, ReactiveCocoa第一个app 3

  • 现在框架已经引入完了,可以试验一下,到ViewController.swift中输入import R,Xcode的自动补全应当在这时给出ReactiveCocoa的提示,那就说明安装完成了





4、设计UI,编写Table View的代码

UITableView是UIKit中操作较为复杂的一个,但这个特性也让它可以不需要绑定就直接使用ReactiveCocoa的特性,因此在这里选用它来做介绍。

不了解UITableView的操作并不影响接下去的阅读,因为所有操作都被说明了

首先打开Main.storyboard,向场景中拖入一个Text Field。设置AutoLayout:左20,右20,上0。再拖入一个Table View,放在Text Field下方,设置AutoLayout:左20,右20,下20,上8。再拖入一个Table View Cell放在Table View里面,拖入一个Label放在Cell里面,设置AutoLayout:竖直居中,左50。整个场景看上去应该像这样:

Swift, ReactiveCocoa第一个app 4

Swift, ReactiveCocoa第一个app - 敏捷大拇指 - Swift, ReactiveCocoa第一个app 4


之后,在StoryBoard中设置Cell的identifier为ResultCell。我们将在之后编写完Cell的代码之后改变这个Cell的其他属性。如图:

Swift, ReactiveCocoa第一个app 5

Swift, ReactiveCocoa第一个app - 敏捷大拇指 - Swift, ReactiveCocoa第一个app 5


接下来我们就来编写Table View的代码。

首先是Cell:

  • 新建一个swift文件,命名为TableViewCell.swift
  • 定义一个类:TableViewCell,声明为UITableViewCell的子类,并且用Interface Builder连接之前在storyboard里面创建的Cell中的Label。加入一个字符串常量,和之前输入的identifier一样。最终看起来应该是这样(作者使用了自己的类前缀LF):

    Swift, ReactiveCocoa第一个app 6

    Swift, ReactiveCocoa第一个app - 敏捷大拇指 - Swift, ReactiveCocoa第一个app 6

  • 在storyboard中更改Cell的类型:

    Swift, ReactiveCocoa第一个app 7

    Swift, ReactiveCocoa第一个app - 敏捷大拇指 - Swift, ReactiveCocoa第一个app 7



这样,Cell的就定义好了。这可以被很容易地改为更复杂的情形。

之后是Table View本身的代码。UITableView采用了Data Source - Update的模式。这种模式的实现需要一个Data Source。

在作者的实现中,需要先有一个ViewModel来封装数据。为此,建立一个swift文件,名为MainViewModel.swift,并加入以下代码:

[Swift] 纯文本查看 复制代码
struct MainViewModel {
    var resultCount: Int!
    var results: [String]!
    
    static func isValidSearchString(text text: String) -> Bool {
        return text.characters.count > 4
    }
    
    static func produceSearchResult(text text: String) -> [String] {
        return (1...text.characters.count).map {
            i in
            return "somebody \(i)"
        }
    }
}


这里定义了封装数据的格式,并提供了两个辅助函数。

在这个例子中这两个函数相当简单,但是随着代码变得复杂,把操作聚合起来是很有利的。

之后新建一个swift文件,命名为ResultViewController.swift,加入以下代码:

[Swift] 纯文本查看 复制代码
import UIKit

class LFResultViewController: NSObject, UITableViewDataSource {
    var viewModel = MainViewModel()
    
    @objc func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return viewModel.resultCount
    }
    
    func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
        var cellRetired = tableView.dequeueReusableCellWithIdentifier(LFTableViewCell.identifier) as? LFTableViewCell
        if cellRetired == nil {
            cellRetired = LFTableViewCell(style: .Default, reuseIdentifier: LFTableViewCell.identifier)
            cellRetired?.outputLabel = UILabel()
        }
        cellRetired?.outputLabel.text = self.viewModel.results[indexPath.row]
        return cellRetired!
    }
}


这里实现了Table View更新时需要的数据的方法。具体的关于UITableViewDataSource协议的内容可以查看Apple的官方文档。

这个模式看起来比较复杂,不像其他控件那样直截了当的就是赋值。但这种模式对响应式编程和MVVM模式特别有利,作者在未来可能会为整个UIKit开发这样的接口来避免使用keypath。




5、构建管道

这里先贴出ViewController.swift中其他部分代码:

[Swift] 纯文本查看 复制代码
import UIKit
import ReactiveCocoa

class ViewController: UIViewController {
    @IBOutlet weak var outputTableView: UITableView!

    @IBOutlet weak var searchTextInput: UITextField!
    
    var resultViewController = LFResultViewController()
    
    override func viewDidLoad() {
        super.viewDidLoad()

        self.resultViewController.viewModel.resultCount = 0
        self.resultViewController.viewModel.results = []
        self.outputTableView.dataSource = self.resultViewController
        self.outputTableView.reloadData()
    }

}


最关键的部分开始了!

RayWenderlich.com上的教程中使用了Signal,但是在swift中,ReactiveCocoa的开发者并没有提供泛型的Signal,而使用AnyObject来和Objective C兼容。但这个严重损伤了代码的可读性,也让bug有了遁身之处。因此在这里,我们将使用SignalProducer,这样可以使用swift的类型检查来杜绝bug。

在viewDidLoad中加入以下代码:

[Swift]