MVVM Without XAML

In this talk, learn how to use the Model-View-ViewModel pattern to write testable user interfaces on platforms beyond XAML-based ones. With ReactiveUI, an MVVM Framework that is designed for cross-platform applications, you can see how to write ViewModels that run on iOS, Android, and Windows, while still creating native experiences on each platform.

Specifically, we’ll dive into Cocoa / AppKit, and see how to wire up ViewModels to Cocoa Views and ViewControllers, using the same syntax as in a WPF application, providing an amazing potential for code reuse in cross-platform environments.

Check out the code for this talk at https://github.com/reactiveui/rxui_qcon

Transcript

1. MVVM Without XAML
2. A Login Dialog is A Login Dialog is A Login Dialog Alternate Title:
3. How to write the same code and have it run everywhere Alternate Title:
4. @ xpaulbettsx
5. these look different
6. but they mostly act the same.
7. “The user can’t click Login until the user name and password is filled out.” “We need to try to log in with the credentials and pop up an error if it doesn’t work.” “We need to show a ‘working’ spinner while the login information is being checked.” “Once it succeeds, we need to navigate to the opening page of the application.”
8. We should be able to share that code everywhere
9. What this talk is not about.
10. MVVM
11. MVVM In A Nutshell UI Frameworks are untestable because they’re written by Apple and Windows Org at Microsoft, two groups who hate tests and live in the late 90s.
12. MVVM In A Nutshell ViewModels are Properties and Commands.
13. Testability is Rad Now, we can test UIs just by creating ViewModels, and be mostly sure that our UI will work.
14. You’re doing MVVM right if you write a UI without ever seeing the XAML Designer.
15. So...
16. If ViewModels don’t know about views...
17. ...then why can’t we reuse them?
18. What about Bindings?
19. ReactiveUI ReactiveUI is a cross-platform MVVM framework, built around the Reactive Extensions
20. ReactiveUI has its own bindings
21. ReactiveUI has its own bindings
22. ReactiveUI has its own bindings
23. ReactiveUI has its own bindings
24. So why not a MVVM WinForms app?
25. (demo)
26. A brief introduction to Xamarin.Mac
27. Cocoa in five minutes NIBs are like XAML files, the framework reads it on startup and creates some objects for you.
28. Cocoa in five minutes Instead of controls having events, they have an object that receives the events, called a delegate.
29. a brief introduction to Cocoa- style MVC and why it’s not great
30. Cocoa-style MVC “Controller objects are thus a conduit through which view objects learn about changes in model objects and vice versa."
31. Awesome!
32. Cocoa-style MVC "A controller object interprets user actions made in view objects and communicates new or changed data to the model layer. When model objects change, a controller object communicates that new model data to the view objects so that they can display it."
33. Totally Rad!
34. Cocoa-style MVC "Controllers directly reference UI controls through outlets to fiddle with their contents."
35. ಠ_ಠ
36. Cocoa-style MVC Because ViewControllers have outlets to actual UI controls, they’re not easy to test, treat the ‘C’ in MVC like you treat the XAML Code-Behind.
37. let’s apply MVVM to Cocoa
40. (demo)