RxSwift:UI控件扩展
Rxswift基本使用之 UI控件扩展
RxSwift
是一个用于与Swift
语言交互的框架,但它只是基础,并不能用来进行用户交互、网络请求等。 而RxCocoa
是让Cocoa APIs
更容易使用响应式编程的一个框架。RxCocoa
能够让我们方便地进行响应式网络请求、响应式的用户交互、绑定数据模型到 UI 控件等等。而且大多数的 UIKit 控件都有响应式扩展,它们都是通过 rx 属性进行使用。
资料下载:下载地址
1. UILabel rx 扩展
1.2 将数据绑定到 text 属性上(普通文本)
实例1.2
import UIKit import RxSwift import RxCocoa class ViewController: UIViewController { let disposeBag = DisposeBag() override func viewDidLoad() { //创建文本标签 let label = UILabel(frame:CGRect(x:20, y:40, width:300, height:100)) self.view.addSubview(label) //创建一个计时器(每0.1秒发送一个索引数) let timer = Observable<Int>.interval(0.1, scheduler: MainScheduler.instance) //将已过去的时间格式化成想要的字符串,并绑定到label上 timer.map{ String(format: "%0.2d:%0.2d.%0.1d", arguments: [($0 / 600) % 600, ($0 % 600 ) / 10, $0 % 10]) } .bind(to: label.rx.text) .disposed(by: disposeBag) } }复制代码
1.3 将数据绑定到 attributedText 属性上(富文本)
实例1.3
import UIKit import RxSwift import RxCocoa class ViewController: UIViewController { let disposeBag = DisposeBag() override func viewDidLoad() { //创建文本标签 let label = UILabel(frame:CGRect(x:20, y:40, width:300, height:100)) self.view.addSubview(label) //创建一个计时器(每0.1秒发送一个索引数) let timer = Observable<Int>.interval(0.1, scheduler: MainScheduler.instance) //将已过去的时间格式化成想要的字符串,并绑定到label上 timer.map(formatTimeInterval) .bind(to: label.rx.attributedText) .disposed(by: disposeBag) } //将数字转成对应的富文本 func formatTimeInterval(ms: NSInteger) -> NSMutableAttributedString { let string = String(format: "%0.2d:%0.2d.%0.1d", arguments: [(ms / 600) % 600, (ms % 600 ) / 10, ms % 10]) //富文本设置 let attributeString = NSMutableAttributedString(string: string) //从文本0开始6个字符字体HelveticaNeue-Bold,16号 attributeString.addAttribute(NSAttributedStringKey.font, value: UIFont(name: "HelveticaNeue-Bold", size: 16)!, range: NSMakeRange(0, 5)) //设置字体颜色 attributeString.addAttribute(NSAttributedStringKey.foregroundColor, value: UIColor.white, range: NSMakeRange(0, 5)) //设置文字背景颜色 attributeString.addAttribute(NSAttributedStringKey.backgroundColor, value: UIColor.orange, range: NSMakeRange(0, 5)) return attributeString } }复制代码
2. UITextField,UITextView Rx扩展
2.1 监听单个 textField 内容的变化(textView 同理)
实例2.1 :将 textField 里输入的内容实时地显示到控制台中
注意:.orEmpty 可以将 String? 类型的 ControlProperty 转成 String,省得我们再去解包。
import UIKit import RxSwift import RxCocoa class ViewController: UIViewController { let disposeBag = DisposeBag() override func viewDidLoad() { //创建文本输入框 let textField = UITextField(frame: CGRect(x:10, y:80, width:200, height:30)) textField.borderStyle = UITextBorderStyle.roundedRect self.view.addSubview(textField) //当文本框内容改变时,将内容输出到控制台上 textField.rx.text.orEmpty.asObservable() .subscribe(onNext: { print("您输入的是:\($0)") }) .disposed(by: disposeBag) } }复制代码
当然我们直接使用 change 事件效果也是一样的。
//当文本框内容改变时,将内容输出到控制台上 textField.rx.text.orEmpty.changed .subscribe(onNext: { print("您输入的是:\($0)") }) .disposed(by: disposeBag)复制代码
2.2 将内容绑定到其他控件上
实例2.12
Throttling 的作用:
Throttling 是 RxSwift 的一个特性。因为有时当一些东西改变时,通常会做大量的逻辑操作。而使用 Throttling 特性,不会产生大量的逻辑操作,而是以一个小的合理的幅度去执行。比如做一些实时搜索功能时,这个特性很有用。
import UIKit import RxSwift import RxCocoa class ViewController: UIViewController { let disposeBag = DisposeBag() override func viewDidLoad() { //创建文本输入框 let inputField = UITextField(frame: CGRect(x:10, y:80, width:200, height:30)) inputField.borderStyle = UITextBorderStyle.roundedRect self.view.addSubview(inputField) //创建文本输出框 let outputField = UITextField(frame: CGRect(x:10, y:150, width:200, height:30)) outputField.borderStyle = UITextBorderStyle.roundedRect self.view.addSubview(outputField) //创建文本标签 let label = UILabel(frame:CGRect(x:20, y:190, width:300, height:30)) self.view.addSubview(label) //创建按钮 let button:UIButton = UIButton(type:.system) button.frame = CGRect(x:20, y:230, width:40, height:30) button.setTitle("提交", for:.normal) self.view.addSubview(button) //当文本框内容改变 let input = inputField.rx.text.orEmpty.asDriver() // 将普通序列转换为 Driver .throttle(0.3) //在主线程中操作,0.3秒内值若多次改变,取最后一次 //内容绑定到另一个输入框中 input.drive(outputField.rx.text) .disposed(by: disposeBag) //内容绑定到文本标签中 input.map{ "当前字数:\($0.count)" } .drive(label.rx.text) .disposed(by: disposeBag) //根据内容字数决定按钮是否可用 input.map{ $0.count > 5 } .drive(button.rx.isEnabled) .disposed(by: disposeBag) } }复制代码
2.3 同时监听多个 textField 内容的变化(textView 同理)
实例2.3
import UIKit import RxSwift import RxCocoa class ViewController: UIViewController { let disposeBag = DisposeBag() @IBOutlet weak var textField1: UITextField! @IBOutlet weak var textField2: UITextField! @IBOutlet weak var label: UILabel! override func viewDidLoad() { Observable.combineLatest(textField1.rx.text.orEmpty, textField2.rx.text.orEmpty) { textValue1, textValue2 -> String in return "你输入的号码是:\(textValue1)-\(textValue2)" } .map { $0 } .bind(to: label.rx.text) .disposed(by: disposeBag) } }复制代码
2.4 事件监听
(1)通过 rx.controlEvent 可以监听输入框的各种事件,且多个事件状态可以自由组合。除了各种 UI 控件都有的 touch 事件外,输入框还有如下几个独有的事件:
editingDidBegin
:开始编辑(开始输入内容)editingChanged
:输入内容发生改变editingDidEnd
:结束编辑editingDidEndOnExit
:按下 return 键结束编辑allEditingEvents
:包含前面的所有编辑相关事件
(2)下面代码监听输入框开始编辑事件(获取到焦点)并做相应的响应。\
实例2.4.1
textField.rx.controlEvent([.editingDidBegin]) //状态可以组合 .asObservable() .subscribe(onNext: { _ in print("开始编辑内容!") }).disposed(by: disposeBag)复制代码
(3)下面代码我们在界面上添加两个输入框分别用于输入用户名和密码:
如果当前焦点在用户名输入框时,按下 return 键时焦点自动转移到密码输入框上。
如果当前焦点在密码输入框时,按下 return 键时自动移除焦点。
实例2.4.2
import UIKit import RxSwift import RxCocoa class ViewController: UIViewController { //用户名输入框 @IBOutlet weak var username: UITextField! //密码输入框 @IBOutlet weak var password: UITextField! let disposeBag = DisposeBag() override func viewDidLoad() { super.viewDidLoad() //在用户名输入框中按下 return 键 username.rx.controlEvent(.editingDidEndOnExit).subscribe(onNext: { [weak self] (_) in self?.password.becomeFirstResponder() }).disposed(by: disposeBag) //在密码输入框中按下 return 键 password.rx.controlEvent(.editingDidEndOnExit).subscribe(onNext: { [weak self] (_) in self?.password.resignFirstResponder() }).disposed(by: disposeBag) } }复制代码
2.5 UITextView 独有的方法
UITextView 还封装了如下几个委托回调方法:
didBeginEditing
:开始编辑didEndEditing
:结束编辑didChange
:编辑内容发生改变didChangeSelection
:选中部分发生变化
实例2.5
import UIKit import RxSwift import RxCocoa class ViewController: UIViewController { let disposeBag = DisposeBag() @IBOutlet weak var textView: UITextView! override func viewDidLoad() { //开始编辑响应 textView.rx.didBeginEditing .subscribe(onNext: { print("开始编辑") }) .disposed(by: disposeBag) //结束编辑响应 textView.rx.didEndEditing .subscribe(onNext: { print("结束编辑") }) .disposed(by: disposeBag) //内容发生变化响应 textView.rx.didChange .subscribe(onNext: { print("内容发生改变") }) .disposed(by: disposeBag) //选中部分变化响应 textView.rx.didChangeSelection .subscribe(onNext: { print("选中部分发生变化") }) .disposed(by: disposeBag) } }复制代码
3. UIButton 与 UIBarButtonItem 的Rx扩展
3.1 按钮点击响应
实例3.1
import UIKit import RxSwift import RxCocoa class ViewController: UIViewController { let disposeBag = DisposeBag() @IBOutlet weak var button: UIButton! override func viewDidLoad() { //按钮点击响应 button.rx.tap .subscribe(onNext: { [weak self] in self?.showMessage("按钮被点击") }) .disposed(by: disposeBag) } //显示消息提示框 func showMessage(_ text: String) { let alertController = UIAlertController(title: text, message: nil, preferredStyle: .alert) let cancelAction = UIAlertAction(title: "确定", style: .cancel, handler: nil) alertController.addAction(cancelAction) self.present(alertController, animated: true, completion: nil) } }复制代码
或者这样实现点击事件订阅
//按钮点击响应 button.rx.tap .bind { [weak self] in self?.showMessage("按钮被点击") } .disposed(by: disposeBag)复制代码
3.2 按钮标题(title)的绑定
实例3.2
//创建一个计时器(每1秒发送一个索引数) let timer = Observable<Int>.interval(1, scheduler: MainScheduler.instance) //根据索引数拼接最新的标题,并绑定到button上 timer.map{"计数\($0)"} .bind(to: button.rx.title(for: .normal))// rx.title 为 setTitle(_:for:) 的封装。 .disposed(by: disposeBag)复制代码
3.3 按钮富文本标题(attributedTitle)的绑定
实例3.3
import UIKit import RxSwift import RxCocoa class ViewController: UIViewController { let disposeBag = DisposeBag() @IBOutlet weak var button: UIButton! override func viewDidLoad() { //创建一个计时器(每1秒发送一个索引数) let timer = Observable<Int>.interval(1, scheduler: MainScheduler.instance) //将已过去的时间格式化成想要的字符串,并绑定到button上 timer.map(formatTimeInterval) .bind(to: button.rx.attributedTitle()) //rx.attributedTitle 为 setAttributedTitle(_:controlState:) 的封装。 .disposed(by: disposeBag) } //将数字转成对应的富文本 func formatTimeInterval(ms: NSInteger) -> NSMutableAttributedString { let string = String(format: "%0.2d:%0.2d.%0.1d", arguments: [(ms / 600) % 600, (ms % 600 ) / 10, ms % 10]) //富文本设置 let attributeString = NSMutableAttributedString(string: string) //从文本0开始6个字符字体HelveticaNeue-Bold,16号 attributeString.addAttribute(NSAttributedStringKey.font, value: UIFont(name: "HelveticaNeue-Bold", size: 16)!, range: NSMakeRange(0, 5)) //设置字体颜色 attributeString.addAttribute(NSAttributedStringKey.foregroundColor, value: UIColor.white, range: NSMakeRange(0, 5)) //设置文字背景颜色 attributeString.addAttribute(NSAttributedStringKey.backgroundColor, value: UIColor.orange, range: NSMakeRange(0, 5)) return attributeString } }复制代码
3.4 按钮图标(image)的绑定
实例3.4
//创建一个计时器(每1秒发送一个索引数) let timer = Observable<Int>.interval(1, scheduler: MainScheduler.instance) //根据索引数选择对应的按钮图标,并绑定到button上 timer.map({ let name = $0%2 == 0 ? "back" : "forward" return UIImage(named: name)! }) .bind(to: button.rx.image())// rx.image 为 setImage(_:for:) 的封装。 .disposed(by: disposeBag)复制代码
3.5 按钮背景图片(backgroundImage)的绑定
实例3.5
//创建一个计时器(每1秒发送一个索引数) let timer = Observable<Int>.interval(1, scheduler: MainScheduler.instance) //根据索引数选择对应的按钮背景图,并绑定到button上 timer.map{ UIImage(named: "\($0%2)")! } .bind(to: button.rx.backgroundImage()) //rx.backgroundImage 为 setBackgroundImage(_:for:) 的封装。 .disposed(by: disposeBag)复制代码
3.6 按钮是否可用(isEnabled)的绑定
实例3.6
switch1.rx.isOn .bind(to: button1.rx.isEnabled) .disposed(by: disposeBag)复制代码
3.7 按钮是否选中(isSelected)的绑定
实例3.7
import UIKit import RxSwift import RxCocoa class ViewController: UIViewController { let disposeBag = DisposeBag() @IBOutlet weak var button1: UIButton! @IBOutlet weak var button2: UIButton! @IBOutlet weak var button3: UIButton! override func viewDidLoad() { //默认选中第一个按钮 button1.isSelected = true //强制解包,避免后面还需要处理可选类型 let buttons = [button1, button2, button3].map { $0! } //创建一个可观察序列,它可以发送最后一次点击的按钮(也就是我们需要选中的按钮) let selectedButton = Observable.from( buttons.map { button in button.rx.tap.map { button } } ).merge() //对于每一个按钮都对selectedButton进行订阅,根据它是否是当前选中的按钮绑定isSelected属性 for button in buttons { selectedButton.map { $0 == button } .bind(to: button.rx.isSelected) .disposed(by: disposeBag) } } }复制代码
4. UISwitch、UISegmentedControl 的Rx扩展
4.1 UISwitch
实例4.1
实现当 switch 开关状态改变时,输出当前值。
switch1.rx.isOn.asObservable() .subscribe(onNext: { print("当前开关状态:\($0)") }) .disposed(by: disposeBag)复制代码
switch1.rx.isOn .bind(to: button1.rx.isEnabled) .disposed(by: disposeBag)复制代码
4.2 UISegmentedControl
实例4.2
实现当 UISegmentedControl 选中项改变时,输出当前选中项索引值。
segmented.rx.selectedSegmentIndex.asObservable() .subscribe(onNext: { print("当前项:\($0)") }) .disposed(by: disposeBag)复制代码
当 segmentedControl 选项改变时,imageView 会自动显示相应的图片。
import UIKit import RxSwift import RxCocoa class ViewController: UIViewController { //分段选择控件 @IBOutlet weak var segmented: UISegmentedControl! //图片显示控件 @IBOutlet weak var imageView: UIImageView! let disposeBag = DisposeBag() override func viewDidLoad() { //创建一个当前需要显示的图片的可观察序列 let showImageObservable: Observable<UIImage> = segmented.rx.selectedSegmentIndex.asObservable().map { let images = ["js.png", "php.png", "react.png"] return UIImage(named: images[$0])! } //把需要显示的图片绑定到 imageView 上 showImageObservable.bind(to: imageView.rx.image) .disposed(by: disposeBag) } }复制代码
5. UIActivityIndicatorView、UIApplication 的Rx扩展
5.1 UIActivityIndicatorView
实例5.1
通过开关我们可以控制活动指示器是否显示旋转
mySwitch.rx.value .bind(to: activityIndicator.rx.isAnimating) .disposed(by: disposeBag)复制代码
5.2 UIApplication
实例5.2
当开关打开时,顶部状态栏上会有个菊花状的联网指示器。
当开关关闭时,联网指示器消失。
mySwitch.rx.value .bind(to: UIApplication.shared.rx.isNetworkActivityIndicatorVisible) .disposed(by: disposeBag)复制代码
6. UISlider、UIStepper 的Rx扩展
6.1 UISlider
实例6.1
拖动滑块时,在控制台中实时输出 slider 当前值
import UIKit import RxSwift import RxCocoa class ViewController: UIViewController { @IBOutlet weak var slider: UISlider! let disposeBag = DisposeBag() override func viewDidLoad() { slider.rx.value.asObservable() .subscribe(onNext: { print("当前值为:\($0)") }) .disposed(by: disposeBag) } }复制代码
6.2 UIStepper
实例6.2
当 stepper 值改变时,在控制台中实时输出当前值。
stepper.rx.value.asObservable() .subscribe(onNext: { print("当前值为:\($0)") }) .disposed(by: disposeBag)复制代码
使用滑块(slider)来控制 stepper 的步长。
slider.rx.value .map{ Double($0) } //由于slider值为Float类型,而stepper的stepValue为Double类型,因此需要转换 .bind(to: stepper.rx.stepValue) .disposed(by: disposeBag)复制代码
7. 双向绑定:<->
前面讲到的UI使用,基本所有的绑定都是单向的。但有时候我们需要实现双向绑定。比如将控件的某个属性值与
ViewModel
里的某个Subject
属性进行双向绑定:
这样当 ViewModel 里的值发生改变时,可以同步反映到控件上。
而如果对控件值做修改,ViewModel 那边值同时也会发生变化。
7.1 简单的双向绑定
实例7.1
(1)页面上方是一个文本输入框,用于填写用户名。它与 VM 里的 username 属性做双向绑定。
(2)下方的文本标签会根据用户名显示对应的用户信息。(只有 hangge 显示管理员,其它都是访客)
(1)首先定义一个 VM,代码如下:
import RxSwift struct UserViewModel { //用户名 let username = Variable("guest") //用户信息 lazy var userinfo = { return self.username.asObservable() .map{ $0 == "hangge" ? "您是管理员" : "您是普通访客" } .share(replay: 1) }() }复制代码
(2)页面代码如下(高亮部分为 textfield 与 VM 的双向绑定):
import UIKit import RxSwift import RxCocoa class ViewController: UIViewController { @IBOutlet weak var textField: UITextField! @IBOutlet weak var label: UILabel! var userVM = UserViewModel() let disposeBag = DisposeBag() override func viewDidLoad() { //将用户名与textField做双向绑定 userVM.username.asObservable().bind(to: textField.rx.text).disposed(by: disposeBag) textField.rx.text.orEmpty.bind(to: userVM.username).disposed(by: disposeBag) //将用户信息绑定到label上 userVM.userinfo.bind(to: label.rx.text).disposed(by: disposeBag) } }复制代码
7.2 自定义双向绑定操作符(operator)
RxSwift 自带的双向绑定操作符
(1)如果经常进行双向绑定的话,最好还是自定义一个
operator
方便使用。
(2)好在RxSwift
项目文件夹中已经有个现成的(Operators.swift
),我们将它复制到我们项目中即可使用。当然如我们想自己写一些其它的双向绑定operator
也可以参考它。
实例7.2
双向绑定操作符是:<->。我们修改上面实例7.1,可以发现代码精简了许多
import UIKit import RxSwift import RxCocoa class ViewController: UIViewController { @IBOutlet weak var textField: UITextField! @IBOutlet weak var label: UILabel! var userVM = UserViewModel() let disposeBag = DisposeBag() override func viewDidLoad() { //将用户名与textField做双向绑定 _ = self.textField.rx.textInput <-> self.userVM.username //将用户信息绑定到label上 userVM.userinfo.bind(to: label.rx.text).disposed(by: disposeBag) } }复制代码
8. UIGestureRecognizer
实例8.1
当手指在界面上向上滑动时,弹出提示框,并显示出滑动起点的坐标。
(1)第一种响应回调的写法
import UIKit import RxSwift import RxCocoa class ViewController: UIViewController { let disposeBag = DisposeBag() override func viewDidLoad() { super.viewDidLoad() //添加一个上滑手势 let swipe = UISwipeGestureRecognizer() swipe.direction = .up self.view.addGestureRecognizer(swipe) //手势响应 swipe.rx.event .subscribe(onNext: { [weak self] recognizer in //这个点是滑动的起点 let point = recognizer.location(in: recognizer.view) self?.showAlert(title: "向上划动", message: "\(point.x) \(point.y)") }) .disposed(by: disposeBag) } //显示消息提示框 func showAlert(title: String, message: String) { let alert = UIAlertController(title: title, message: message, preferredStyle: .alert) alert.addAction(UIAlertAction(title: "确定", style: .cancel)) self.present(alert, animated: true) } }复制代码
(2)第二种响应回调的写法
import UIKit import RxSwift import RxCocoa class ViewController: UIViewController { let disposeBag = DisposeBag() override func viewDidLoad() { super.viewDidLoad() //添加一个上滑手势 let swipe = UISwipeGestureRecognizer() swipe.direction = .up self.view.addGestureRecognizer(swipe) //手势响应 swipe.rx.event .bind { [weak self] recognizer in //这个点是滑动的起点 let point = recognizer.location(in: recognizer.view) self?.showAlert(title: "向上划动", message: "\(point.x) \(point.y)") } .disposed(by: disposeBag) } //显示消息提示框 func showAlert(title: String, message: String) { let alert = UIAlertController(title: title, message: message, preferredStyle: .alert) alert.addAction(UIAlertAction(title: "确定", style: .cancel)) self.present(alert, animated: true) } }复制代码
实例8.2
实现点击页面任意位置,输入框便失去焦点
import UIKit import RxSwift import RxCocoa class ViewController: UIViewController { let disposeBag = DisposeBag() override func viewDidLoad() { super.viewDidLoad() //添加一个点击手势 let tapBackground = UITapGestureRecognizer() view.addGestureRecognizer(tapBackground) //页面上任意处点击,输入框便失去焦点 tapBackground.rx.event .subscribe(onNext: { [weak self] _ in self?.view.endEditing(true) }) .disposed(by: disposeBag) } } 复制代码
9. UIDatePicker
9.1 日期选择响应
实例9.1
当日期选择器里面的时间改变后,将时间格式化显示到 label 中
import UIKit import RxSwift import RxCocoa class ViewController: UIViewController { @IBOutlet weak var datePicker: UIDatePicker! @IBOutlet weak var label: UILabel! //日期格式化器 lazy var dateFormatter: DateFormatter = { let formatter = DateFormatter() formatter.dateFormat = "yyyy年MM月dd日 HH:mm" return formatter }() let disposeBag = DisposeBag() override func viewDidLoad() { datePicker.rx.date .map { [weak self] in "当前选择时间: " + self!.dateFormatter.string(from: $0) } .bind(to: label.rx.text) .disposed(by: disposeBag) } }复制代码
9.2 倒计时功能
实例9.2\
通过上方的 datepicker 选择需要倒计时的时间后,点击“开始”按钮即可开始倒计时。
倒计时过程中,datepicker 和按钮都不可用。且按钮标题变成显示倒计时剩余时间。
import UIKit import RxSwift import RxCocoa class ViewController: UIViewController { //倒计时时间选择控件 var ctimer:UIDatePicker! //开始按钮 var btnstart:UIButton! //剩余时间(必须为 60 的整数倍,比如设置为100,值自动变为 60) let leftTime = Variable(TimeInterval(180)) //当前倒计时是否结束 let countDownStopped = Variable(true) let disposeBag = DisposeBag() override func viewDidLoad() { super.viewDidLoad() //初始化datepicker ctimer = UIDatePicker(frame:CGRect(x:0, y:80, width:320, height:200)) ctimer.datePickerMode = UIDatePickerMode.countDownTimer self.view.addSubview(ctimer) //初始化button btnstart = UIButton(type: .system) btnstart.frame = CGRect(x:0, y:300, width:320, height:30); btnstart.setTitleColor(UIColor.red, for: .normal) btnstart.setTitleColor(UIColor.darkGray, for:.disabled) self.view.addSubview(btnstart) //剩余时间与datepicker做双向绑定 DispatchQueue.main.async{//加 DispatchQueue.main.async 是为了解决第一次拨动表盘不触发值改变事件的问题 _ = self.ctimer.rx.countDownDuration <-> self.leftTime //<-> 是自定义的双向绑定符号 } //绑定button标题 Observable.combineLatest(leftTime.asObservable(), countDownStopped.asObservable()) { leftTimeValue, countDownStoppedValue in //根据当前的状态设置按钮的标题 if countDownStoppedValue { return "开始" }else{ return "倒计时开始,还有 \(Int(leftTimeValue)) 秒..." } }.bind(to: btnstart.rx.title()) .disposed(by: disposeBag) //绑定button和datepicker状态(在倒计过程中,按钮和时间选择组件不可用) countDownStopped.asDriver().drive(ctimer.rx.isEnabled).disposed(by: disposeBag) countDownStopped.asDriver().drive(btnstart.rx.isEnabled).disposed(by: disposeBag) //按钮点击响应 btnstart.rx.tap .bind { [weak self] in self?.startClicked() } .disposed(by: disposeBag) } //开始倒计时 func startClicked() { //开始倒计时 self.countDownStopped.value = false //创建一个计时器 Observable<Int>.interval(1, scheduler: MainScheduler.instance) .takeUntil(countDownStopped.asObservable().filter{ $0 }) //倒计时结束时停止计时器 .subscribe { event in //每次剩余时间减1 self.leftTime.value -= 1 // 如果剩余时间小于等于0 if(self.leftTime.value == 0) { print("倒计时结束!") //结束倒计时 self.countDownStopped.value = true //重制时间 self.leftTime.value = 180 } }.disposed(by: disposeBag) } }
作者:iOS沐橙君
链接:https://juejin.cn/post/7021848624879370247