Programando interfaces reativas com Xamarin e Reactive UI
-
Upload
mahmoud-ali-neto -
Category
Software
-
view
351 -
download
0
Transcript of Programando interfaces reativas com Xamarin e Reactive UI
![Page 1: Programando interfaces reativas com Xamarin e Reactive UI](https://reader031.fdocuments.net/reader031/viewer/2022021419/58ab607e1a28abbc2a8b5809/html5/thumbnails/1.jpg)
Programando interfaces reativas com Xamarin e
ReactiveUI
Mahmoud Ali
Desenvolvedor @ Lambda3
@akamud | [email protected]
![Page 2: Programando interfaces reativas com Xamarin e Reactive UI](https://reader031.fdocuments.net/reader031/viewer/2022021419/58ab607e1a28abbc2a8b5809/html5/thumbnails/2.jpg)
Interfaces reativas
Usuários esperam interfaces reativas e respostas em milisegundos e 100% de disponibilidade
Seu sistema precisa ser resistente a falhas
http://www.reactivemanifesto.org/pt-BR
![Page 3: Programando interfaces reativas com Xamarin e Reactive UI](https://reader031.fdocuments.net/reader031/viewer/2022021419/58ab607e1a28abbc2a8b5809/html5/thumbnails/3.jpg)
Reactive Extensions (Rx)
Reactive Extensions é uma biblioteca para compor programas assíncronos e orientados a eventos utilizando observables e operadores LINQ-style.
![Page 4: Programando interfaces reativas com Xamarin e Reactive UI](https://reader031.fdocuments.net/reader031/viewer/2022021419/58ab607e1a28abbc2a8b5809/html5/thumbnails/4.jpg)
Reactive Extensions
• Criado pela Microsoft pelo mesmo time de desenvolvedores do LINQ
• “LINQ para eventos”
• Conceitos de paradigma funcional
• Utiliza o design pattern: Observer
• Portada para várias linguagens: Javascript, Java, Ruby, Python...
![Page 5: Programando interfaces reativas com Xamarin e Reactive UI](https://reader031.fdocuments.net/reader031/viewer/2022021419/58ab607e1a28abbc2a8b5809/html5/thumbnails/5.jpg)
Streams
• Funciona como uma esteira de produção
• É uma sequência de eventos ordenados por tempo
• É a base do Rx (IObservable<T> no .NET)
• É assíncrono e push-based
• Podem ser transformados de diversas maneiras
![Page 6: Programando interfaces reativas com Xamarin e Reactive UI](https://reader031.fdocuments.net/reader031/viewer/2022021419/58ab607e1a28abbc2a8b5809/html5/thumbnails/6.jpg)
Streams
• Quem quiser tratar o conteúdo que está passando pela esteira precisa dar um subscribe
• No padrão Observer: o stream (IObservable) é o subject, o subscriber é o observer
• Emite três estados: OnNext, OnError e OnCompleted
• São disposables
https://gist.github.com/staltz/868e7e9bc2a7b8c1f754
![Page 7: Programando interfaces reativas com Xamarin e Reactive UI](https://reader031.fdocuments.net/reader031/viewer/2022021419/58ab607e1a28abbc2a8b5809/html5/thumbnails/7.jpg)
Streams
Tudo pode ser transformado em um stream:
• Cliques de mouse
• Teclas digitadas
• Tasks assíncronas
• Timers
• Inclusive streams
![Page 8: Programando interfaces reativas com Xamarin e Reactive UI](https://reader031.fdocuments.net/reader031/viewer/2022021419/58ab607e1a28abbc2a8b5809/html5/thumbnails/8.jpg)
Streams
https://gist.github.com/staltz/868e7e9bc2a7b8c1f754
![Page 9: Programando interfaces reativas com Xamarin e Reactive UI](https://reader031.fdocuments.net/reader031/viewer/2022021419/58ab607e1a28abbc2a8b5809/html5/thumbnails/9.jpg)
Onde usar?
• Eventos que dependem de infraestrutura (filewatcher)
• Eventos real-time
• Eventos de UI
• Streams (ex.: rede)
![Page 10: Programando interfaces reativas com Xamarin e Reactive UI](https://reader031.fdocuments.net/reader031/viewer/2022021419/58ab607e1a28abbc2a8b5809/html5/thumbnails/10.jpg)
Quem está usando
![Page 11: Programando interfaces reativas com Xamarin e Reactive UI](https://reader031.fdocuments.net/reader031/viewer/2022021419/58ab607e1a28abbc2a8b5809/html5/thumbnails/11.jpg)
Demo: Rx
![Page 12: Programando interfaces reativas com Xamarin e Reactive UI](https://reader031.fdocuments.net/reader031/viewer/2022021419/58ab607e1a28abbc2a8b5809/html5/thumbnails/12.jpg)
Observable.Range
![Page 16: Programando interfaces reativas com Xamarin e Reactive UI](https://reader031.fdocuments.net/reader031/viewer/2022021419/58ab607e1a28abbc2a8b5809/html5/thumbnails/16.jpg)
Buffer
![Page 20: Programando interfaces reativas com Xamarin e Reactive UI](https://reader031.fdocuments.net/reader031/viewer/2022021419/58ab607e1a28abbc2a8b5809/html5/thumbnails/20.jpg)
ReactiveUI (RxUI)
Framework open source para facilitar a utilização de Rx na criação de interfaces reativas em qualquer plataforma, reaproveitando código
![Page 21: Programando interfaces reativas com Xamarin e Reactive UI](https://reader031.fdocuments.net/reader031/viewer/2022021419/58ab607e1a28abbc2a8b5809/html5/thumbnails/21.jpg)
ReactiveUI
Também é um framework MVVM
![Page 22: Programando interfaces reativas com Xamarin e Reactive UI](https://reader031.fdocuments.net/reader031/viewer/2022021419/58ab607e1a28abbc2a8b5809/html5/thumbnails/22.jpg)
ReactiveUI
Disponibiliza uma série de helpers para facilitar a criação das interfaces:
• Bind
• ObservableAsPropertyHelper
• ReactiveCommands
• ReactiveAdapters
![Page 23: Programando interfaces reativas com Xamarin e Reactive UI](https://reader031.fdocuments.net/reader031/viewer/2022021419/58ab607e1a28abbc2a8b5809/html5/thumbnails/23.jpg)
Demo: ReactiveUI
![Page 24: Programando interfaces reativas com Xamarin e Reactive UI](https://reader031.fdocuments.net/reader031/viewer/2022021419/58ab607e1a28abbc2a8b5809/html5/thumbnails/24.jpg)
DistinctUntilChanged
![Page 25: Programando interfaces reativas com Xamarin e Reactive UI](https://reader031.fdocuments.net/reader031/viewer/2022021419/58ab607e1a28abbc2a8b5809/html5/thumbnails/25.jpg)
Switch
![Page 26: Programando interfaces reativas com Xamarin e Reactive UI](https://reader031.fdocuments.net/reader031/viewer/2022021419/58ab607e1a28abbc2a8b5809/html5/thumbnails/26.jpg)
Referências
• The introduction to Reactive Programming you've been missing
• http://rxmarbles.com/
• http://www.introtorx.com/
• https://reactivex.slack.com/
• http://reactiveui.net/
• http://bit.ly/rxui-xamarin
• https://github.com/akamud/HackDaysRxUI (Este código)
![Page 27: Programando interfaces reativas com Xamarin e Reactive UI](https://reader031.fdocuments.net/reader031/viewer/2022021419/58ab607e1a28abbc2a8b5809/html5/thumbnails/27.jpg)
Obrigado!@akamud