文档章节

【译】Swift 2.0 下面向协议的MVVM架构实践

法斗斗
 法斗斗
发布于 2016/03/01 18:05
字数 1587
阅读 22
收藏 0

自从令人兴奋的[《面向协议的编程方法》]在Swift的WWDC大会上发布以来。我对协议的使用考虑了很多。但是在现实中,我并没有太多的顾及和使用这些功能。我还仍旧在消化到底面向协议的编程方法是什么,在代码的哪些地方应该使用,而不是使用我目前使用的`go-to`编程方法。


...所以,当我想起来要在哪里应用这些概念性的东西时,我非常激动,那就是MVVM !我已经在之前的博客中使用过MVVM架构,如果你想了解更多MVVM相关知识请参考[这里]。接下来我将讲解,如何添加面向协议。

我将会使用一个简单的例子。一个只有一个设置选项的设置页面,把应用设置为Minion模式,当然你也可以扩展为多个设置选项。

03.png

View Cell

一个极其普通的Cell,它包含一个Label和一个开关控件。你也可以在其他地方使用这个Cell,例如注册页面添加一个“记住我”的开关选项。所以,你应该保持这个页面通用性。

一个复杂的配置

通常,我在cell中使用一个设置方法,来监听所有对应用设置可能的变更,这看起来是这样的:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
class SwitchWithTextTableViewCell: UITableViewCell {
     
    @IBOutlet private weak var label: UILabel!
    @IBOutlet private weak var switchToggle: UISwitch!
     
    typealias onSwitchToggleHandlerType = (switchOn: Bool) -> Void
    private var onSwitchToggleHandler: onSwitchToggleHandlerType?
     
    override func awakeFromNib() {
        super.awakeFromNib()
    }
     
    func configure(withTitle title: String,
        switchOn: Bool,
        onSwitchToggleHandler: onSwitchToggleHandlerType? = nil)
    {
        label.text = title
        switchToggle.on = switchOn
         
        self.onSwitchToggleHandler = onSwitchToggleHandler
    }
     
    @IBAction func onSwitchToggle(sender: UISwitch) {
        onSwitchToggleHandler?(switchOn: sender.on)
    }
}

通过 Swift 的默认参数,可以添加其他的设置选项到这个设置方法,而不必改变代码中的其他地方,使用起来非常方便。例如,当设计师说开关按钮的颜色需应该各不相同,这时候我就可以添加一个默认参数。

1
2
3
4
5
6
7
8
9
10
11
12
    func configure(withTitle title: String,
        switchOn: Bool,
        switchColor: UIColor = .purpleColor(),
        onSwitchToggleHandler: onSwitchToggleHandlerType? = nil)
    {
        label.text = title
        switchToggle.on = switchOn
        // color option added!
        switchToggle.onTintColor = switchColor
         
        self.onSwitchToggleHandler = onSwitchToggleHandler
    }

虽然在这种情况下看起来并不是什么大问题,但是随着时间的增加,事实上这个方法将会变得非常冗长、复杂!是时候由面向协议的编程方法登场了。

面向协议的编程方法

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
protocol SwitchWithTextCellProtocol {
    var title: String { get }
    var switchOn: Bool { get }
     
    func onSwitchTogleOn(on: Bool)
}
  
class SwitchWithTextTableViewCell: UITableViewCell {
  
    @IBOutlet private weak var label: UILabel!
    @IBOutlet private weak var switchToggle: UISwitch!
  
    private var delegate: SwitchWithTextCellProtocol?
     
    override func awakeFromNib() {
        super.awakeFromNib()
    }
     
    func configure(withDelegate delegate: SwitchWithTextCellProtocol) {
        self.delegate = delegate
         
        label.text = delegate.title
        switchToggle.on = delegate.switchOn
    }
  
    @IBAction func onSwitchToggle(sender: UISwitch) {
        delegate?.onSwitchTogleOn(sender.on)
    }
}

当设计师说需要改变开关控件颜色的时候会发生什么?以下代码可以展现协议扩展的奇妙之处。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
extension SwitchWithTextCellProtocol {
     
    // set the default color here!
    func switchColor() -> UIColor {
        return .purpleColor()
    }
}
  
class SwitchWithTextTableViewCell: UITableViewCell {
     
    // truncated, see above 
  
    func configure(withDelegate delegate: SwitchWithTextCellProtocol) {
        self.delegate = delegate
         
        label.text = delegate.title
        switchToggle.on = delegate.switchOn
        // color option added!
        switchToggle.onTintColor = delegate.switchColor()
    }
}

在以上代码中协议的扩展实现了默认的switchColor选项,所以,任何已经实现了这个协议或者并不关心设置开关颜色的人,不用关注这个扩展。只有一个具有不同颜色的新的开关控件可以实现。

ViewModel

所以现在剩下的事情将会非常简单。我将会为MinionMode的设置cell写一个ViewModel。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
import UIKit
  
struct MinionModeViewModel: SwitchWithTextCellProtocol {
    var title = "Minion Mode!!!"
    var switchOn = true
     
    func onSwitchTogleOn(on: Bool) {
        if on {
            print("The Minions are here to stay!")
        } else {
            print("The Minions went out to play!")
        }
    }
     
    func switchColor() -> UIColor {
        return .yellowColor()
    }
}

ViewController

最后一步就是在ViewController中设置cell的时候将ViewModel传给cell。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
import UIKit
  
class SettingsViewController: UITableViewController {
  
    enum Setting: Int {
        case MinionMode
        // other settings here
    }
     
    override func viewDidLoad() {
        super.viewDidLoad()
    }
  
    // MARK: - Table view data source
  
    override func tableView(tableView: UITableView,
        numberOfRowsInSection section: Int) -> Int
    {
        return 1
    }
  
    override func tableView(tableView: UITableView,
        cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell
    {
        if let setting = Setting(rawValue: indexPath.row) {
            switch setting {
            case .MinionMode:
                let cell = tableView.dequeueReusableCellWithIdentifier("SwitchWithTextTableViewCell", forIndexPath: indexPath) as! SwitchWithTextTableViewCell
                 
                // this is where the magic happens!
                cell.configure(withDelegate: MinionModeViewModel())
                return cell
            }
        }
         
        return tableView.dequeueReusableCellWithIdentifier("defaultCell", forIndexPath: indexPath)
    }
  
}

通过使用协议的扩展,是面向协议的编程方法有了很大的意义,并且我在寻找更多的使用场景。以上代码的全部内容放在[github]上。

更新:将数据源和代理分开

在评论中,Marc Baldwin 建议分开cell的数据源和代理方法到两个协议中,就像UITableView中的那样。我很赞成这个意见,以下是我修改后的代码。

View Cell

Cell将拥有两个协议,并且任何一个协议都可以设置这个cell。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
import UIKit
  
protocol SwitchWithTextCellDataSource {
    var title: String { get }
    var switchOn: Bool { get }
}
  
protocol SwitchWithTextCellDelegate {
    func onSwitchTogleOn(on: Bool)
     
    var switchColor: UIColor { get }
    var textColor: UIColor { get }
    var font: UIFont { get }
}
  
extension SwitchWithTextCellDelegate {
     
    var switchColor: UIColor {
        return .purpleColor()
    }
     
    var textColor: UIColor {
        return .blackColor()
    }
     
    var font: UIFont {
        return .systemFontOfSize(17)
    }
}
  
class SwitchWithTextTableViewCell: UITableViewCell {
  
    @IBOutlet private weak var label: UILabel!
    @IBOutlet private weak var switchToggle: UISwitch!
  
    private var dataSource: SwitchWithTextCellDataSource?
    private var delegate: SwitchWithTextCellDelegate?
     
    override func awakeFromNib() {
        super.awakeFromNib()
    }
     
    func configure(withDataSource dataSource: SwitchWithTextCellDataSource, delegate: SwitchWithTextCellDelegate?) {
        self.dataSource = dataSource
        self.delegate = delegate
         
        label.text = dataSource.title
        switchToggle.on = dataSource.switchOn
        // color option added!
        switchToggle.onTintColor = delegate?.switchColor
    }
  
    @IBAction func onSwitchToggle(sender: UISwitch) {
        delegate?.onSwitchTogleOn(sender.on)
    }
}

ViewModel

你现在可以在扩展里把数据源和delegate逻辑分开了:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
import UIKit
  
struct MinionModeViewModel: SwitchWithTextCellDataSource {
    var title = "Minion Mode!!!"
    var switchOn = true
}
  
extension MinionModeViewModel: SwitchWithTextCellDelegate {
     
    func onSwitchTogleOn(on: Bool) {
        if on {
            print("The Minions are here to stay!")
        } else {
            print("The Minions went out to play!")
        }
    }
     
    var switchColor: UIColor {
        return .yellowColor()
    }
}

ViewController

这一部分是我不十分确定,ViewController不能传递ViewModel两次:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
override func tableView(tableView: UITableView,
        cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell
    {
        if let setting = Setting(rawValue: indexPath.row) {
            switch setting {
            case .MinionMode:
                let cell = tableView.dequeueReusableCellWithIdentifier("SwitchWithTextTableViewCell", forIndexPath: indexPath) as! SwitchWithTextTableViewCell
                 
                // this is where the magic happens!
                let viewModel = MinionModeViewModel()
                cell.configure(withDataSource: viewModel, delegate: viewModel)
                return cell
            }
        }
         
        return tableView.dequeueReusableCellWithIdentifier("defaultCell", forIndexPath: indexPath)
    }

代码已经上传[GitHub]

本文转载自:

共有 人打赏支持
法斗斗
粉丝 21
博文 367
码字总数 17774
作品 0
杨浦
程序员
私信 提问
Swift2编程之道:POP+MVVM

Swift2.0中引入了协议扩展的特性,并且建议开发者一切从协议(Protocol)出发,经过几个月的学习探索,博主发现Swift作为一门面向协议编程(POP)的语言非常适合时下火热的MVVM架构。MVVM已经...

cg1991130
2016/03/01
0
0
fir.im Weekly - 揭秘 iOS 面向协议编程

本期 fir.im Weekly 重点推荐关于 iOS 面向协议编程相关文章,还有 iOS 多线程安全、Swift 进阶、Android MVVM 应用框架、Android 蓝牙实践等技术文章分享和工具源码分享~ 『iOS / Android...

风起云飞fir_im
2016/12/05
7
0
Swift黑科技:还在争论MVC和MVVM?博主独创幽灵架构MV!

本人原创,长文慎入,但此文可能会改写你的编程风格。我认为数据和模型交互的关键问题是如何处理数据源和视图源本身的异构性。通过面向协议编程的不断实践,总结他人的理论经验,我发现了使用...

cg1991130
2016/04/11
0
0
基于MVVM 的IOS开发框架--EasyIOS

Swift版本最新发布: https://github.com/EasyIOS/EasyIOS-Swift 全新基于MVVM(Model-View-ViewModel)编程模式架构,开启EasyIOS开发函数式编程新篇章。 EasyIOS 2.0类似AngularJs,最为核心...

墨水
2014/07/18
16.6K
5
fir.im Weekly - 论个人技术影响力是如何炼成的

每个圈子都有一群能力强且懂得经营自己的人,技术圈也是如此。本期 fir.im Weekly 一如往期精选了一些实用的 iOS,Android 开发工具和源码分享,还有一些关于程序员的成长 Tips 和活动分享~...

风起云飞fir_im
2016/04/11
401
0

没有更多内容

加载失败,请刷新页面

加载更多

EOS docker开发环境

使用eos docker镜像是部署本地EOS开发环境的最轻松愉快的方法。使用官方提供的eos docker镜像,你可以快速建立一个eos开发环境,可以迅速启动开发节点和钱包服务器、创建账户、编写智能合约....

汇智网教程
今天
7
0
《唐史原来超有趣》的读后感优秀范文3700字

《唐史原来超有趣》的读后感优秀范文3700字: 作者:花若离。我今天分享的内容《唐史原来超有趣》这本书的读后感,我将这本书看了一遍之后就束之高阁了,不过里面的内容一直在在脑海中回放,...

原创小博客
今天
12
0
IC-CAD Methodology知识图谱

CAD (Computer Aided Design),计算机辅助设计,指利用计算机及其图形设备帮助设计人员进行设计工作,这个定义同样可以用来近似描述IC公司CAD工程师这个岗位的工作。 早期IC公司的CAD岗位最初...

李艳青1987
今天
14
0
CompletableFuture get方法一直阻塞或抛出TimeoutException

问题描述 最近刚刚上线的服务突然抛出大量的TimeoutException,查询后发现是使用了CompletableFuture,并且在执行future.get(5, TimeUnit.SECONDS);时抛出了TimeoutException异常,导致接口响...

xiaolyuh
今天
8
0
dubbo 搭建与使用

官网:http://dubbo.apache.org/en-us/ 一,安装监控中心(可以不安装) admin管理控制台,monitor监控中心 下载 bubbo ops 这个是新版的,需要node.js环境,我没有就用老版的了...

小兵胖胖
今天
15
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部