Upgrade to Pro — share decks privately, control downloads, hide ads and more …

So You Want To Be A Reactive Programming Beginner?

06609d73ad2165c4aafcf65a1ddb9563?s=47 Greg Heo
February 01, 2017

So You Want To Be A Reactive Programming Beginner?

RxSwift basics @ NSMeetup, February 1, 2017.

Blog post and some notes here: https://gregheo.com/blog/nsmeetup-rx/

06609d73ad2165c4aafcf65a1ddb9563?s=128

Greg Heo

February 01, 2017
Tweet

More Decks by Greg Heo

Other Decks in Technology

Transcript

  1. @gregheo So You Want To Be A Reactive Programming Beginner?

  2. @gregheo Data flows Propagation of change

  3. @gregheo

  4. @gregheo Slider 1 Slider 2 action method action method Text

    label Triangle
  5. @gregheo Subscription Observable Slider 1 Text label 60° Subscription Draw

    triangle 58° 59° 62° 68° …
  6. @gregheo Create Combine Listen Streams }

  7. @gregheo Observable Slider 1 Observable Slider 2 Observable merge()

  8. @gregheo Observable map bind map bind subscribe

  9. @gregheo let angleSliderObservable = angleSlider.rx.value .map({ (angle: Float) in return

    RightTriangle(angle: Int(angle)) }) let oppositeAngleSliderObservable = oppositeAngleSlider.rx.value .map({ (angle: Float) in return RightTriangle(oppositeAngle: Int(angle)) }) let combinedObservable = Observable.of(angleSliderObservable, oppositeAngleSliderObservable).merge()
  10. @gregheo let angleSliderObservable = angleSlider.rx.value .map({ (angle: Float) in return

    RightTriangle(angle: Int(angle)) }) let oppositeAngleSliderObservable = oppositeAngleSlider.rx.value .map({ (angle: Float) in return RightTriangle(oppositeAngle: Int(angle)) }) let combinedObservable = Observable.of(angleSliderObservable, oppositeAngleSliderObservable).merge() combinedObservable .subscribe(onNext: { (triangle: RightTriangle) in self.angleSlider.value = Float(triangle.angle) self.triangleView.triangle = triangle }) .addDisposableTo(disposeBag) combinedObservable .map({ "Angle: \($0.angle)°\nOpposite angle: \($0.oppositeAngle)°" }) .bindTo(label.rx.text) .addDisposableTo(disposeBag)
  11. @gregheo let angleSliderObservable = angleSlider.rx.value .map({ (angle: Float) in return

    RightTriangle(angle: Int(angle)) }) let oppositeAngleSliderObservable = oppositeAngleSlider.rx.value .map({ (angle: Float) in return RightTriangle(oppositeAngle: Int(angle)) }) let combinedObservable = Observable.of(angleSliderObservable, oppositeAngleSliderObservable).merge() combinedObservable .subscribe(onNext: { (triangle: RightTriangle) in self.angleSlider.value = Float(triangle.angle) self.triangleView.triangle = triangle }) .addDisposableTo(disposeBag) combinedObservable .map({ "Angle: \($0.angle)°\nOpposite angle: \($0.oppositeAngle)°" }) .bindTo(label.rx.text) .addDisposableTo(disposeBag) Reactive Extensions input output
  12. @gregheo Separation of Concerns

  13. @gregheo Declarative

  14. @gregheo Small Pieces of Logic

  15. feedback @gregheo