Building Multi-Platform Native Apps with MVVM and C#

Transcript

1. Building Multi-Platform Native Apps with MVVM and C# Greg Shackles Senior Software Engineer Olo @gshackles greg@gregshackles.com github.com/gshackles
2. gonemobile.io @GoneMobileCast
3. Google Apple RIM Microsoft Symbian 52.5% Android 41.4% Apple 3.3% Microsoft 2.5% RIM Source: comScore US Market Share: April 2014
4. Write Once, Run Anywhere
5. Write Once, Run Anywhere BUSTED
6. Xamarin: C# All The Things! * * and F# too!
7. Xamarin: C# All The Things! * * and F# too! •100% Native
8. Xamarin: C# All The Things! * * and F# too! •100% Native •Full access to platform SDKs
9. Xamarin: C# All The Things! * * and F# too! •100% Native •Full access to platform SDKs •BCL, Async, LINQ, etc
10. Xamarin: C# All The Things! * * and F# too! •100% Native •Full access to platform SDKs •BCL, Async, LINQ, etc •Improved API
11. Xamarin: C# All The Things! * * and F# too! •100% Native •Full access to platform SDKs •BCL, Async, LINQ, etc •Improved API •Shared code across platforms
12. Xamarin: C# All The Things! * * and F# too! •100% Native •Full access to platform SDKs •BCL, Async, LINQ, etc •Improved API •Shared code across platforms •Garbage collection
13. Xamarin: C# All The Things! * * and F# too! •100% Native •Full access to platform SDKs •BCL, Async, LINQ, etc •Improved API •Shared code across platforms •Garbage collection •Visual Studio / Xamarin Studio
14. Xamarin: C# All The Things! * * and F# too! •100% Native •Full access to platform SDKs •BCL, Async, LINQ, etc •Improved API •Shared code across platforms •Garbage collection •Visual Studio / Xamarin Studio •Frequent Releases
15. MVVM
16. MVVM View
17. MVVM View Model
18. MVVM View View Model Model
19. MVVM View Binder View Model Model
20. MVVM Click Me View Binder View Model Model
21. MVVM Click Me 1. action View Binder View Model Model
22. MVVM Click Me 1. action 2. event handling View Binder View Model Model
23. MVVM Click Me 1. action 2. event handling 3. command View Binder View Model Model
24. MVVM Click Me 1. action 2. event handling 3. command 4. access data View Binder View Model Model
25. MVVM Click Me 1. action 2. event handling 3. command 4. access data 5. notify change View Binder View Model Model
26. MVVM Click Me 1. action 2. event handling 3. command 4. access data 5. notify change 6. get changed data View Binder View Model Model
27. MVVM Click Me Hello World! 1. action 2. event handling 3. command 4. access data 5. notify change 6. get changed data 7. update UI View Binder View Model Model
28. MvvmCross
29. MvvmCross
30. MvvmCross: Highlights
31. • Shared behavior, not presentation MvvmCross: Highlights
32. • Shared behavior, not presentation • Bind all the platforms! MvvmCross: Highlights
33. • Shared behavior, not presentation • Bind all the platforms! • Powerful binding options MvvmCross: Highlights
34. • Shared behavior, not presentation • Bind all the platforms! • Powerful binding options • Convention over configuration MvvmCross: Highlights
35. • Shared behavior, not presentation • Bind all the platforms! • Powerful binding options • Convention over configuration • Pluggable architecture MvvmCross: Highlights
36. • Shared behavior, not presentation • Bind all the platforms! • Powerful binding options • Convention over configuration • Pluggable architecture • PCL MvvmCross: Highlights
37. • Shared behavior, not presentation • Bind all the platforms! • Powerful binding options • Convention over configuration • Pluggable architecture • PCL • Inversion of Control MvvmCross: Highlights
38. • Shared behavior, not presentation • Bind all the platforms! • Powerful binding options • Convention over configuration • Pluggable architecture • PCL • Inversion of Control • Testable MvvmCross: Highlights
39. MvvmCross: Resources
40. •Source: github.com/slodge/MvvmCross MvvmCross: Resources
41. •Source: github.com/slodge/MvvmCross •Stuart’s Blog: slodge.blogspot.com MvvmCross: Resources
42. •Source: github.com/slodge/MvvmCross •Stuart’s Blog: slodge.blogspot.com •N+1: mvvmcross.wordpress.com MvvmCross: Resources
43. •Source: github.com/slodge/MvvmCross •Stuart’s Blog: slodge.blogspot.com •N+1: mvvmcross.wordpress.com •Chat: jabbr.net/#/rooms/mvvmcross MvvmCross: Resources
44. Presenters
45. • Customize view presentation Presenters
46. • Customize view presentation • Platform-specific Presenters
47. • Customize view presentation • Platform-specific • Still retain View Model logic Presenters
48. • Customize view presentation • Platform-specific • Still retain View Model logic Presenters •Tabs / Panorama
49. • Customize view presentation • Platform-specific • Still retain View Model logic Presenters •Tabs / Panorama •Split View / Master-Detail
50. • Customize view presentation • Platform-specific • Still retain View Model logic Presenters •Tabs / Panorama •Split View / Master-Detail •Fragments
51. • Customize view presentation • Platform-specific • Still retain View Model logic Presenters •Tabs / Panorama •Split View / Master-Detail •Fragments •Modals
52. • Customize view presentation • Platform-specific • Still retain View Model logic Presenters •Tabs / Panorama •Split View / Master-Detail •Fragments •Modals •Hamburger menu
53. Presenters
54. Presenters
55. Presenters
56. Presenters
57. Plugins
58. Plugins • Accelerometer • Download Cache • Email • File • Json • Localization • Location • Messenger • Phone Call • Picture Chooser • SQLite • Visibility • Web Browser • Many More!
59. Xamarin.Forms Shared C# App Logic Shared C# User Interface Code
61. Pages Content MasterDetail Navigation Tabbed Carousel
62. Pages Layouts Content MasterDetail Navigation Tabbed Carousel Stack Absolute Relative Grid Content Scroll Frame
63. Controls
64. Controls • ActivityIndicator • BoxView • Button • DatePicker • Editor • EntryImage • Label • ListView • Map • OpenGLView • PickerProgressBar • SearchBar • SliderStepper • TableView • TimePicker • WebView • EntryCell • ImageCell • SwitchCell • TextCell • ViewCell