MvvmCross Introduction    13th December 2012          @slodge
Presentation ModelRepresent the state and behavior of the presentation   independently of the GUI controls used in the    ...
In 2005…      Model/View/ViewModel is a variation ofModel/View/Controller that is tailored for modern UI   development pla...
Also in 2005…• 10 years of dev – C++, C, VB, Java, JavaScript,  LISP, SmallTalk, Delphi, …• A year off travelling  – from ...
MvvmCross Introduction   Evolving the dinosaur    13th December 2012          @slodge
What we’ll cover…•   MVVM Theory•   .Net MVVM•   A practical example – some code!•   Interface Driven Development    – Por...
What we’ll cover…•   MVVM Theory•   .Net MVVM•   A practical example – some code!•   Interface Driven Development    – Por...
M-V-VM
Detailed flow
What we’ll cover…•   MVVM Theory•   .Net MVVM•   A practical example – some code!•   Interface Driven Development    – Por...
ViewModels Public Propertiesprivate bool _isSearching;public bool IsSearching{     get { return _isSearching; }     set   ...
For ViewModel Changespublic interface INotifyPropertyChanged{     event PropertyChangedEventHandler PropertyChanged;}publi...
For Collectionspublic interface INotifyCollectionChanged{     event NotifyCollectionChangedEventHandler CollectionChanged;...
For Actionspublic interface ICommand{    event EventHandler CanExecuteChanged;    bool CanExecute(object parameter);    vo...
.Net Implementation     ICommand  Public Property Set   INotifyPropertyChanged  INotifyCollectionChanged     Public Proper...
Why?To Enable• Awesome UI and Data Development• Unit Testing of code• Large applications to have a common  architecture• D...
What we’ll cover…•   MVVM Theory•   .Net MVVM•   A practical example – some code!•   Interface Driven Development    – Por...
What is MvvmCross?      Code!
Code evolution I•   Single Mono for Android Project•   Good separation of UI from ‘Model’ code•   Simple – it works•   But...
Code Evolution 2• MvvmCross Library switched in  – PCL code  – Formal DI/IoC used• On UI:  – DataBinding arrived  – Code g...
Code Evolution 3• Cross Platform• All UIs MVVM• 100% shared application  logic• 100% shared test harness
Data-BindingWP/WinRT 99% Xaml   DroidMainly AxmlSome .Dialog  TouchSome .Dialog Some .XIB  Some C#
What we’ll cover…•   MVVM Theory•   .Net MVVM•   A practical example – some code!•   Interface Driven Development    – Por...
Portable Class Libraries
Unit Testing“I get paid for code that works, not for tests, so myphilosophy is to test as little as possible to reach agiv...
Plugin – Native abstractions1. Declare common functionality (an interface)   public interface IMvxComposeEmailTask   {    ...
Sphero – Plugin Magic• Plugin Magic• Each Plugin:   – 1 PCL   – 1 Assembly per platform
Why?To Enable• Awesome UI and Data Development• Unit Testing of code• Large applications to have a common  architecture• D...
What we’ll cover…•   MVVM Theory•   .Net MVVM•   A practical example – some code!•   Interface Driven Development    – Por...
MonoCross
A team in a galaxy far far away@imaji @mrlacey @sichy @slodge @touch4apps …
Redth in Canadahttps://github.com/Redth/WshLst/
Rune in Norwayhttps://github.com/runegri/CrossBox
Jason in UKhttp://www.aviva.co.uk/drive/
CheeseBaron in Denmarkhttp://blog.ostebaronen.dk/
Greg in NYChttp://bit.ly/mvxgshac
JSON.Net Downunder (?)
Olivier in Francehttp://www.e-naxos.com/UsIndex.html
Dan in Italyhttp://bit.ly/mvxDanA
Zoldeper in Hungary?https://github.com/Zoldeper/Blooor
Daniel in Redmondhttp://channel9.msdn.com/Events/Build/2012/3-004
What we’ve covered…•   MVVM Theory•   .Net MVVM•   A practical example – some code!•   Interface Driven Development    – P...
To join in…If you want to join in:   •   Tool up   •   Share   •   Reuse   •   Test   •   Architect
MS-PL on GitHubhttp://github.com/slodge/MvvmCross
Some other talks availablehttp://bit.ly/mvxTweetPic
C# - 1 Stack - Cloud to MobileData AccessBusiness LogicPresentationService Consumption         Local Data/ServicesBusiness...
Not as cool as dinosaursData AccessBusiness LogicPresentationService Consumption         Local Data/ServicesBusiness Logic...
Some creditsImages from Wikipedia Commons:•   http://en.wikipedia.org/wiki/File:Macronaria_scrubbed_enh.jpg•   http://en.w...
Thanks for listening…http://cirrious.comhttp://slodge.blogspot.comhttp://github.com/slodge/mvvmcrossme@slodge.com@slodgeSt...
Xamarin               SeminarPlease give us your feedback              http://bit.ly/xamfeedbackFollow us on Twitter      ...
Upcoming SlideShare
Loading in...5
×

MvvmCross Seminar

23,321

Published on

Video for this session: http://www.youtube.com/watch?v=jdiu_dH3z5k

Code for this session: https://github.com/xamarin/Seminars/tree/master/2012-12-13-MVVMCross/

An introduction to one approach for using dependency injection, unit testing and MVVM in cross-platform mobile C# development with Stuart Lodge

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

No Downloads
Views
Total Views
23,321
On Slideshare
0
From Embeds
0
Number of Embeds
15
Actions
Shares
0
Downloads
172
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

MvvmCross Seminar

  1. 1. MvvmCross Introduction 13th December 2012 @slodge
  2. 2. Presentation ModelRepresent the state and behavior of the presentation independently of the GUI controls used in the interface. http://martinfowler.com/eaaDev/PresentationModel.html
  3. 3. In 2005… Model/View/ViewModel is a variation ofModel/View/Controller that is tailored for modern UI development platforms where the View is the responsibility of a designer rather than a classic developer. Tales from the Smart Client, John Grossman http://blogs.msdn.com/b/johngossman/archive/2005/10/08/478683.aspx
  4. 4. Also in 2005…• 10 years of dev – C++, C, VB, Java, JavaScript, LISP, SmallTalk, Delphi, …• A year off travelling – from Argentina to Zambia• DeveloperDeveloperDeveloper• 1 conclusion:
  5. 5. MvvmCross Introduction Evolving the dinosaur 13th December 2012 @slodge
  6. 6. What we’ll cover…• MVVM Theory• .Net MVVM• A practical example – some code!• Interface Driven Development – Portable Class Libraries – Unit Testing – Plugins• Some examples
  7. 7. What we’ll cover…• MVVM Theory• .Net MVVM• A practical example – some code!• Interface Driven Development – Portable Class Libraries – Unit Testing – Plugins• Some examples
  8. 8. M-V-VM
  9. 9. Detailed flow
  10. 10. What we’ll cover…• MVVM Theory• .Net MVVM• A practical example – some code!• Interface Driven Development – Portable Class Libraries – Unit Testing – Plugins• Some examples
  11. 11. ViewModels Public Propertiesprivate bool _isSearching;public bool IsSearching{ get { return _isSearching; } set { _isSearching = value; RaisePropertyChanged("IsSearching"); }}
  12. 12. For ViewModel Changespublic interface INotifyPropertyChanged{ event PropertyChangedEventHandler PropertyChanged;}public class PropertyChangedEventArgs : EventArgs{ public string PropertyName { get; }}
  13. 13. For Collectionspublic interface INotifyCollectionChanged{ event NotifyCollectionChangedEventHandler CollectionChanged;}public enum NotifyCollectionChangedAction{ Add, Remove, Replace, Move, Reset,}public class NotifyCollectionChangedEventArgs : EventArg{ public NotifyCollectionChangedAction Action { get; } public IList NewItems { get; } public IList OldItems { get; } public int NewStartingIndex { get; } public int OldStartingIndex { get; }}
  14. 14. For Actionspublic interface ICommand{ event EventHandler CanExecuteChanged; bool CanExecute(object parameter); void Execute(object parameter);}
  15. 15. .Net Implementation ICommand Public Property Set INotifyPropertyChanged INotifyCollectionChanged Public Property Get
  16. 16. Why?To Enable• Awesome UI and Data Development• Unit Testing of code• Large applications to have a common architecture• Different platforms can share code
  17. 17. What we’ll cover…• MVVM Theory• .Net MVVM• A practical example – some code!• Interface Driven Development – Portable Class Libraries – Unit Testing – Plugins• Some examples
  18. 18. What is MvvmCross? Code!
  19. 19. Code evolution I• Single Mono for Android Project• Good separation of UI from ‘Model’ code• Simple – it works• But: – No testing – No testability – Portability by cut/paste
  20. 20. Code Evolution 2• MvvmCross Library switched in – PCL code – Formal DI/IoC used• On UI: – DataBinding arrived – Code got much thinner! – XML got bigger• Not all win: – External Dependencies got larger – Code overall increased in size
  21. 21. Code Evolution 3• Cross Platform• All UIs MVVM• 100% shared application logic• 100% shared test harness
  22. 22. Data-BindingWP/WinRT 99% Xaml DroidMainly AxmlSome .Dialog TouchSome .Dialog Some .XIB Some C#
  23. 23. What we’ll cover…• MVVM Theory• .Net MVVM• A practical example – some code!• Interface Driven Development – Portable Class Libraries – Unit Testing – Plugins• Some examples
  24. 24. Portable Class Libraries
  25. 25. Unit Testing“I get paid for code that works, not for tests, so myphilosophy is to test as little as possible to reach agiven level of confidence.…When coding on a team, I modify my strategy tocarefully test code that we, collectively, tend to getwrong.” Kent Beck http://stackoverflow.com/questions/153234/how-deep-are-your-unit-tests
  26. 26. Plugin – Native abstractions1. Declare common functionality (an interface) public interface IMvxComposeEmailTask { void ComposeEmail(string to, string cc, string subject, string body, bool isHtml); }2. Write platform specific implementations public class MvxComposeEmailTask : MvxWindowsPhoneTask, IMvxComposeEmailTask { public void ComposeEmail(string to, string cc, string subject, string body, bool isHtml) { var task = new EmailComposeTask() { To = to, Subject = subject, Cc = cc, Body = body }; DoWithInvalidOperationProtection(task.Show); } }3. In apps, use the interface and not the implementation protected void ComposeEmail(string to, string subject, string body) { Cirrious.MvvmCross.Plugins.Email.PluginLoader.Instance.EnsureLoaded(); var task = this.GetService<IMvxComposeEmailTask>(); task.ComposeEmail(to, null, subject, body, false); }
  27. 27. Sphero – Plugin Magic• Plugin Magic• Each Plugin: – 1 PCL – 1 Assembly per platform
  28. 28. Why?To Enable• Awesome UI and Data Development• Unit Testing of code• Large applications to have a common architecture• Different platforms can share code
  29. 29. What we’ll cover…• MVVM Theory• .Net MVVM• A practical example – some code!• Interface Driven Development – Portable Class Libraries – Unit Testing – Plugins• Some examples
  30. 30. MonoCross
  31. 31. A team in a galaxy far far away@imaji @mrlacey @sichy @slodge @touch4apps …
  32. 32. Redth in Canadahttps://github.com/Redth/WshLst/
  33. 33. Rune in Norwayhttps://github.com/runegri/CrossBox
  34. 34. Jason in UKhttp://www.aviva.co.uk/drive/
  35. 35. CheeseBaron in Denmarkhttp://blog.ostebaronen.dk/
  36. 36. Greg in NYChttp://bit.ly/mvxgshac
  37. 37. JSON.Net Downunder (?)
  38. 38. Olivier in Francehttp://www.e-naxos.com/UsIndex.html
  39. 39. Dan in Italyhttp://bit.ly/mvxDanA
  40. 40. Zoldeper in Hungary?https://github.com/Zoldeper/Blooor
  41. 41. Daniel in Redmondhttp://channel9.msdn.com/Events/Build/2012/3-004
  42. 42. What we’ve covered…• MVVM Theory• .Net MVVM• A practical example – some code!• Interface Driven Development – Portable Class Libraries – Unit Testing – Plugins• Some examples
  43. 43. To join in…If you want to join in: • Tool up • Share • Reuse • Test • Architect
  44. 44. MS-PL on GitHubhttp://github.com/slodge/MvvmCross
  45. 45. Some other talks availablehttp://bit.ly/mvxTweetPic
  46. 46. C# - 1 Stack - Cloud to MobileData AccessBusiness LogicPresentationService Consumption Local Data/ServicesBusiness LogicUI LogicWP7 iOS Droid Win8
  47. 47. Not as cool as dinosaursData AccessBusiness LogicPresentationService Consumption Local Data/ServicesBusiness LogicUI LogicWP7 iOS Droid Win8
  48. 48. Some creditsImages from Wikipedia Commons:• http://en.wikipedia.org/wiki/File:Macronaria_scrubbed_enh.jpg• http://en.wikipedia.org/wiki/File:Human- eoraptor_size_comparison%28v2%29.pngDiagrams from Java – ZK• http://books.zkoss.org/wiki/ZK_Developer%27s_Reference/MVVMSample projects as credited inline
  49. 49. Thanks for listening…http://cirrious.comhttp://slodge.blogspot.comhttp://github.com/slodge/mvvmcrossme@slodge.com@slodgeStuart Lodge,I’m a Dinosaur
  50. 50. Xamarin SeminarPlease give us your feedback http://bit.ly/xamfeedbackFollow us on Twitter @XamarinHQ13th December 2012
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×