Se ha denunciado esta presentación.
Utilizamos tu perfil de LinkedIn y tus datos de actividad para personalizar los anuncios y mostrarte publicidad más relevante. Puedes cambiar tus preferencias de publicidad en cualquier momento.

RxSwiftのデータバインディングだけ

1.959 visualizaciones

Publicado el

第3回RxSwift勉強会@Sansanの発表スライドです。

Publicado en: Ingeniería
  • Sé el primero en comentar

RxSwiftのデータバインディングだけ

  1. 1. RxSwiftの データバインディング だけ 2016/11/17 第3回RxSwift勉強会@Sansan @hironytic
  2. 2. 自己紹介 • 一宮 浩教 / ひろん • 徳島で働く
 iOS / Android / UWP エンジニア • https://twitter.com/hironytic • https://github.com/hironytic
  3. 3. MVVM View ViewModel Model 外観 プラットフォ ームの都合 UIの状態 UIのための ロジック ビジネス ロジック 呼び出し 通知 データ バイン ディング WPFなら XAML ここだけ RxSwift
  4. 4. 作戦 • ViewModel → View(出力) ➡ Observable • View → ViewModel(入力) ➡ Observer Variableで実現 メソッドに直結
  5. 5. override func viewDidLoad() { super.viewDidLoad() viewModel.number1Text .bindTo(number1Field.rx.text) .addDisposableTo(disposeBag) viewModel.number2Text .bindTo(number2Field.rx.text) .addDisposableTo(disposeBag) viewModel.calcEnabled .bindTo(calcButton.rx.isEnabled) .addDisposableTo(disposeBag) viewModel.answerText .bindTo(answerLabel.rx.text) .addDisposableTo(disposeBag) number1Field.rx.text .bindTo(viewModel.number1ChangedAction) .addDisposableTo(disposeBag) number2Field.rx.text .bindTo(viewModel.number2ChangedAction) .addDisposableTo(disposeBag) calcButton.rx.tap .bindTo(viewModel.calcAction) .addDisposableTo(disposeBag) } ViewController bind してます https://github.com/hironytic/RxSwiftBindingExample/blob/ec0b98e4e07b7add0813657b76963a1a0237fd94/ RxSwiftBindingExample/ViewController.swift
  6. 6. private func calc() { let n1 = Int(_number1Text.value) ?? 0 let n2 = Int(_number2Text.value) ?? 0 _answerText.value = String(n1 + n2) } private func number1Changed(_ value: String?) { _number1Text.value = value ?? "" updateCalcState() } private func number2Changed(_ value: String?) { _number2Text.value = value ?? "" updateCalcState() } private func updateCalcState() { _calcEnabled.value = !_number1Text.value.isEmpty && !_number2Text.value.isEmpty } ViewModel https://github.com/hironytic/RxSwiftBindingExample/blob/ec0b98e4e07b7add0813657b76963a1a0237fd94/ RxSwiftBindingExample/ViewModel.swift
  7. 7. private func calc() { let n1 = Int(_number1Text.value) ?? 0 let n2 = Int(_number2Text.value) ?? 0 _answerText.value = String(n1 + n2) } private func number1Changed(_ value: String?) { _number1Text.value = value ?? "" updateCalcState() } private func number2Changed(_ value: String?) { _number2Text.value = value ?? "" updateCalcState() } private func updateCalcState() { _calcEnabled.value = !_number1Text.value.isEmpty && !_number2Text.value.isEmpty } ViewModel https://github.com/hironytic/RxSwiftBindingExample/blob/ec0b98e4e07b7add0813657b76963a1a0237fd94/ RxSwiftBindingExample/ViewModel.swift on(_:)の.nextから直結
  8. 8. private func calc() { let n1 = Int(_number1Text.value) ?? 0 let n2 = Int(_number2Text.value) ?? 0 _answerText.value = String(n1 + n2) } private func number1Changed(_ value: String?) { _number1Text.value = value ?? "" updateCalcState() } private func number2Changed(_ value: String?) { _number2Text.value = value ?? "" updateCalcState() } private func updateCalcState() { _calcEnabled.value = !_number1Text.value.isEmpty && !_number2Text.value.isEmpty } ViewModel https://github.com/hironytic/RxSwiftBindingExample/blob/ec0b98e4e07b7add0813657b76963a1a0237fd94/ RxSwiftBindingExample/ViewModel.swift Variable
  9. 9. private func calc() { let n1 = Int(_number1Text.value) ?? 0 let n2 = Int(_number2Text.value) ?? 0 _answerText.value = String(n1 + n2) } private func number1Changed(_ value: String?) { _number1Text.value = value ?? "" updateCalcState() } private func number2Changed(_ value: String?) { _number2Text.value = value ?? "" updateCalcState() } private func updateCalcState() { _calcEnabled.value = !_number1Text.value.isEmpty && !_number2Text.value.isEmpty } ViewModel https://github.com/hironytic/RxSwiftBindingExample/blob/ec0b98e4e07b7add0813657b76963a1a0237fd94/ RxSwiftBindingExample/ViewModel.swift • 数値入力欄 ×2
 計算ボタン • 計算ボタンを押すと
入力された2つの数値を
足し算した結果を表示 • 数値入力欄が両方
埋まってないと
 計算ボタンは無効 • あまりに単純なので
 Modelは省略 😜
  10. 10. できた • Rxのoperatorの使用ゼロ!😳 • 従来のIBOutletとIBActionの世界のよう!😏
  11. 11. 🐣 なにがうれしいの?
  12. 12. うれしいこと 🎊「RxSwiftを使った」 🎉
  13. 13. うれしいこと • UIロジックのテスト • UIテストって面倒じゃないですか? - デザインの変更に弱いとか - Accessibility Identifierとか • ViewModelのテストでUIロジックはテストできる
  14. 14. 後日談 • 2016年の夏 • この方針で趣味プログラムを作り始めた • 現在(2016年11月) • 我慢できなくなって、ViewModel、Modelでも
 Rxのoperatorを使うようになっている
  15. 15. 👁 👁
 👄 データバインディングだけ データバインディングだけ データバインディングだけ…
  16. 16. まとめ データバインディングだけだからと
 軽い気持ちでRxSwiftに手を出すと、
 「そっち」側の世界へ引き込まれる ありがとうございました 📃ソースコード https://github.com/hironytic/RxSwiftBindingExample

×