RxSwift之UI控件UISwitch与UISegmentedControl扩展的使用

一、UISwitch(开关按钮)

  • 实现当 switch 开关状态改变时,输出当前值:

在这里插入图片描述
在这里插入图片描述

  • 示例代码:
switch1.rx.isOn.asObservable()
    .subscribe(onNext: {
    
    
        print("当前开关状态:\($0)")
    })
    .disposed(by: disposeBag)
  • 当切换 switch 开关时,button 会在可用和不可用的状态间切换:

在这里插入图片描述
在这里插入图片描述

  • 示例代码:
switch1.rx.isOn
    .bind(to: button1.rx.isEnabled)
    .disposed(by: disposeBag)

二、UISegmentedControl(分段选择控件)

  • 实现当 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)
    }
}

猜你喜欢

转载自blog.csdn.net/Forever_wj/article/details/121089484