Reactive UI
Mike Bluestein
Developer Evangelist Xamarin
mike.bluestein@xamarin.com
@mikebluestein
!
!
!
!
CT Code Camp
5/1...
Agenda
• Reactive Extensions for .NET
• ReactiveUI
Reactive Programming
Push instead of Pull
Reactive Extensions (Rx)
–Erik Meijer
“Rx is a library for composing asynchronous
and event-based programs using observable
collections.”
Reactive UI
Cross-Platform MVVM built on Rx
Rx Basics
Duality
• IObserveable/
IObserver
• dual to IEnumerable/
IEnumerator
• represent a data
source and a listener,
respectively
Observable
• IObservable<T> - async data stream that can be
observed
• Subscribe - similar to registering an event handler
Observer
• IObserver<T> - observe an IObservable<T>
• OnNext, OnCompleted, OnError
Observable vs. Events
• Declare, Publish, Subscribe
• Subject, OnNext, Subscribe
• Subscribe can take delegates for IObser...
Queries
• LINQ methods added to IObservable
Queries
myObservable.Throttle(…)

.Select(x => …)

.Where(x => …)

.Subscribe(…)
Observable Composition
Dragging event composed of mouse button and mouse move events:
!
IObservable<Event<MouseEventArgs>>...
Reactive UI
–Paul Betts
“ReactiveUI is a cross-platform MVVM
framework, built around the Reactive
Extensions”
MVVM on Rx
• ViewModel
• Command
• Binding
• Property Change Notification
ReactiveObject
• Base class for view models
• Observables for property change notifications
Bindings
• IViewFor<T> - routing and binding on views
• Bind ( … )
• OneWayBind ( … )
ReactiveCommand
• Registers async method to be called when
command is executed
Demo
ReactiveTableViewController
Resources
• Rx on MSDN
• http://msdn.microsoft.com/en-us/data/gg577609
• Rx source on Codeplex
• https://rx.codeplex.com
•...
Upcoming SlideShare
Loading in …5
×

Reative UI

1,168 views

Published on

Published in: Technology, Sports
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
1,168
On SlideShare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
17
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide

Reative UI

  1. 1. Reactive UI Mike Bluestein Developer Evangelist Xamarin mike.bluestein@xamarin.com @mikebluestein ! ! ! ! CT Code Camp 5/17/2014
  2. 2. Agenda • Reactive Extensions for .NET • ReactiveUI
  3. 3. Reactive Programming Push instead of Pull
  4. 4. Reactive Extensions (Rx)
  5. 5. –Erik Meijer “Rx is a library for composing asynchronous and event-based programs using observable collections.”
  6. 6. Reactive UI Cross-Platform MVVM built on Rx
  7. 7. Rx Basics
  8. 8. Duality • IObserveable/ IObserver • dual to IEnumerable/ IEnumerator • represent a data source and a listener, respectively
  9. 9. Observable • IObservable<T> - async data stream that can be observed • Subscribe - similar to registering an event handler
  10. 10. Observer • IObserver<T> - observe an IObservable<T> • OnNext, OnCompleted, OnError
  11. 11. Observable vs. Events • Declare, Publish, Subscribe • Subject, OnNext, Subscribe • Subscribe can take delegates for IObserver methods • Observable.FromEventPattern<T> • Returns IEvent objects containing the sender and event arguments
  12. 12. Queries • LINQ methods added to IObservable
  13. 13. Queries myObservable.Throttle(…)
 .Select(x => …)
 .Where(x => …)
 .Subscribe(…)
  14. 14. Observable Composition Dragging event composed of mouse button and mouse move events: ! IObservable<Event<MouseEventArgs>> draggingEvent =      from mouseLeftDownEvent in control.GetMouseLeftDown()      from mouseMoveEvent in control.GetMouseMove().Until(control.GetMouseLeftUp())      select mouseMoveEvent; from http://www.hanselman.com/blog/ReactiveExtensionsRxIsNowOpenSource.aspx
  15. 15. Reactive UI
  16. 16. –Paul Betts “ReactiveUI is a cross-platform MVVM framework, built around the Reactive Extensions”
  17. 17. MVVM on Rx • ViewModel • Command • Binding • Property Change Notification
  18. 18. ReactiveObject • Base class for view models • Observables for property change notifications
  19. 19. Bindings • IViewFor<T> - routing and binding on views • Bind ( … ) • OneWayBind ( … )
  20. 20. ReactiveCommand • Registers async method to be called when command is executed
  21. 21. Demo ReactiveTableViewController
  22. 22. Resources • Rx on MSDN • http://msdn.microsoft.com/en-us/data/gg577609 • Rx source on Codeplex • https://rx.codeplex.com • ReactiveUI source on Github • https://github.com/reactiveui/ReactiveUI

×