Building Multi-Platform Native Apps with MVVM and C#

279b474d14f72e4daa1fc76e6f3c929f?s=47 Greg Shackles
June 21, 2014
Technology
1
330

Building Multi-Platform Native Apps with MVVM and C#

279b474d14f72e4daa1fc76e6f3c929f?s=128

Greg Shackles

June 21, 2014
Tweet

More Decks by Greg Shackles

See All by Greg Shackles
279b474d14f72e4daa1fc76e6f3c929f?s=48 gshackles
0
83
279b474d14f72e4daa1fc76e6f3c929f?s=48 gshackles
1
180
279b474d14f72e4daa1fc76e6f3c929f?s=48 gshackles
1
63
279b474d14f72e4daa1fc76e6f3c929f?s=48 gshackles
0
410
279b474d14f72e4daa1fc76e6f3c929f?s=48 gshackles
0
51
279b474d14f72e4daa1fc76e6f3c929f?s=48 gshackles
0
71
279b474d14f72e4daa1fc76e6f3c929f?s=48 gshackles
0
130
279b474d14f72e4daa1fc76e6f3c929f?s=48 gshackles
0
65
279b474d14f72e4daa1fc76e6f3c929f?s=48 gshackles
0
4.2k

Other Decks in Technology

See All in Technology
6f8838b2708a87ccf1015030f16880ef?s=48 godel
0
160
394576121c6b861048493988254160dd?s=48 tarappo
2
110
B0efb6defa622f75aaaf56e5ee439a59?s=48 firebasethailand
1
110
D4b3dfc68675b3564c58e75cef7c9689?s=48 ryoichi_obara
0
490
25b30e875da37bab1edc8fbc2fe23df7?s=48 _mossann_t
0
180
8dea1f82c78ad28481eebe3bcd345504?s=48 shishamous
0
160
53850955f15249a1a9dc49df6113e400?s=48 line_developers
1
390
8a9e3e40a5fed444715dc95ee1ca45aa?s=48 tosiooooooo
0
550
8a84268593355816432ceaf78777d585?s=48 dena_tech
0
430
098ad475722e3697ec2fba28c8654f9f?s=48 yuhta28
0
450
6fe6b19f7204487ab25ceb3b3a70204e?s=48 takegue
0
380
C674863ab039e10ecc16d79f9f7328b6?s=48 diatonic_codes
0
120

Featured

See All Featured
D09fad3e36ae6841f54820be0e907f7a?s=48 rocio
155
11k
95d9f37115fbb0d13135d0f77132f856?s=48 morganepeng
11
680
E4f5d494ebdc9e7cce1aecf3ce3e8bc1?s=48 shpigford
366
42k
7559f6cff1f5efc2d210965febd4d71c?s=48 bermonpainter
339
26k
245cee81a9c424266e5e401d844ea881?s=48 lara
169
9.3k
1177e050db6bafe62885362edf6e3537?s=48 lauravandoore
8
1.1k
B6a8f005f39d23ffc930508ac9da68b9?s=48 vanstee
115
4.7k
C86443373fbfe92996aa882d0d7a59f8?s=48 imathis
478
150k
465724d73fe3a92c0879fdfb43a3a6f3?s=48 philhawksworth
190
17k
C9b18d9dff88a9dd2393364c2b3b21bd?s=48 colly
65
2.9k
D8fc2580cfaca035f666d9e4ee79a7f7?s=48 mongodb
23
3.7k
C4de88ea47538e4594750e3861a341c8?s=48 brettharned
91
2.8k

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

  60. None

  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
  65. None