数字相加
搭建UI
构建如下UI:
数字相加UI
绑定UI
// 绑定UI
Observable.combineLatest(number1.rx.text.orEmpty,
number2.rx.text.orEmpty,
number3.rx.text.orEmpty)
{ (value1, value2, value3) -> Int in
return (Int(value1) ?? 0) + (Int(value2) ?? 0) + (Int(value3) ?? 0)
}.map { $0.description }
.bind(to: result.rx.text)
.disposed(by: bag)
代码分析:
- 首先使用combineLatest操作符组合3个数字输入序列
- 数字输入序列使用orEmpty操作符去掉空值转化为
String
类型的序列 - 将3个
String
类型的元素转化为Int
类型并相加的结果作为新序列的元素 - 使用map操作符将计算的结果
Int
类型的元素转化为String
类型 - 最后绑定到结果控件并清理资源
有效验证
搭建UI
构建如下UI:
有效验证UI
初始化
定义如下两个常量用来限制用户名和密码的输入长度:
/// 用户名最小长度
private let minUsernameLength = 6
/// 密码最小长度
private let minPasswordLength = 6
初始化如下控件的显示:
// 初始化控件显示
usernameValid.text = "用户名至少\(minUsernameLength)个字符……"
passwordValid.text = "密码至少\(minUsernameLength)个字符……"
构建序列
// 构建序列
let usernameV = username.rx.text.orEmpty
.map { $0.count >= minUsernameLength }
.share(replay: 1)
let passwordV = password.rx.text.orEmpty
.map { $0.count >= minPasswordLength }
.share(replay: 1)
let buttonV = Observable.combineLatest(usernameV, passwordV) { $0 && $1 }
.share(replay: 1)
代码分析:
- 用户名和密码至少6位才有效,并使用share操作符共享元素
- 登录按钮使用combineLatest操作符组合用户名和密码是否有效的序列,来保证用户名和密码同时有效才是可用,并也使用share操作符共享元素
绑定UI
// 绑定UI
usernameV.bind(to: password.rx.isEnabled).disposed(by: bag)
usernameV.bind(to: usernameValid.rx.isHidden).disposed(by: bag)
passwordV.bind(to: passwordValid.rx.isHidden).disposed(by: bag)
buttonV.bind(to: button.rx.isEnabled).disposed(by: bag)
button.rx.tap.subscribe {[unowned self] (_) in
let alert = UIAlertController(title: "提示", message: "登录成功!", preferredStyle: .alert)
let ok = UIAlertAction(title: "OK", style: .default, handler: nil)
alert.addAction(ok)
self.present(alert, animated: true, completion: nil)
}.disposed(by: bag)
注意:绑定好UI要记得清理资源,避免出现内存泄露。
总结
这2个示例主要还是对UI的绑定,都相对比较简单,就不做过多的阐述,可以下载代码查看详细实现过程。
网友评论