RxSwift基础UI绑定实战总结

image

项目案列

案例是用户反馈界面，当用户点击推荐列表的btn或者在输入框输入内容的时候，提交反馈的按钮的isEnabled状态实时更新，使用Swift3代码

gif

实时更新被点中的数组状态

初始化listCount变量，该变量代表了当前推荐列表的btn数量是否大于0，初始化checkedList，代表被选中的btn数量

let listCount: Variable<Bool> = Variable(false)
var checkedList: [DriverFeedbackModel] = [DriverFeedbackModel]()

实现点击btn的方法，通过判断btn的isSelected状态，checkedList增删btn代表的model数据，listCount的值根据checkedList的数量进行赋值

checkedList.append(list[sender.tag])
checkedList = checkedList.filter({$0 !== list[sender.tag]})//实现数组的remove效果

func clickRecommandBtn(_ sender: UIButton) {
    if sender.isSelected == false {
        sender.layer.borderColor = AppConfig.XXT_Green.cgColor
        sender.isSelected = true
        
        if let list = listData {
            checkedList.append(list[sender.tag])
        }
    }
    else {
        sender.layer.borderColor = AppConfig.XXT_LightGray.cgColor
        sender.isSelected = false
        if let list = listData {
            checkedList = checkedList.filter({$0 !== list[sender.tag]})//实现数组的remove效果
        }
    }
    
    listCount.value = !checkedList.isEmpty
}

listCount的值根据选中的btn数量实时变化

listCount.value = !checkedList.isEmpty

联合textView.rx.text信号和listCount信号，绑定到提交按钮的isEnabled状态

在方法体内返回bool值

{ ($0 == true || !$1.isEmpty) && $1.characters.count < 151 }

绑定到submitBtn的rx.isEnabled，根据方法体内返回bool值实时修改isEnabled值

bind(to: submitBtn.rx.isEnabled)

  Observable.combineLatest(listCount.asObservable(), textView.rx.text.orEmpty.asObservable()){ ($0 == true || !$1.isEmpty) && $1.characters.count < 151 }.bind(to: submitBtn.rx.isEnabled).addDisposableTo(disposeBag)

对textview的非法字符进行过滤

把textview.rx.text转换成Observable，监听map方法，bind to textview

textView.rx.text.orEmpty.asObservable().distinctUntilChanged().map({
        $0.trimmingCharacters(in: CharacterSet(charactersIn: "[\"'<>%;]"))
    }).bind(to: textView.rx.text).addDisposableTo(disposeBag)

完结

这里有代码片段，可以作为参考