MvvmCross Introduction 13th December 2012 @slodge

Presentation Model Represent the state and behavior of the presentation independently of the GUI controls used in the interface. http://martinfowler.com/eaaDev/PresentationModel.html

In 2005… Model/View/ViewModel is a variation of Model/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

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:

MvvmCross Introduction 13th December 2012 @slodge Evolving the dinosaur

What we’ll cover… • MVVM Theory • .Net MVVM • A practical example – some code! • Interface Driven Development – Portable Class Libraries – Unit Testing – Plugins • Some examples

What we’ll cover… • MVVM Theory • .Net MVVM • A practical example – some code! • Interface Driven Development – Portable Class Libraries – Unit Testing – Plugins • Some examples

M-V-VM

Detailed flow

What we’ll cover… • MVVM Theory • .Net MVVM • A practical example – some code! • Interface Driven Development – Portable Class Libraries – Unit Testing – Plugins • Some examples

ViewModels Public Properties private bool _isSearching; public bool IsSearching { get { return _isSearching; } set { _isSearching = value; RaisePropertyChanged("IsSearching"); } }

For ViewModel Changes public interface INotifyPropertyChanged { event PropertyChangedEventHandler PropertyChanged; } public class PropertyChangedEventArgs : EventArgs { public string PropertyName { get; } }

For Collections public 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; } }

For Actions public interface ICommand { event EventHandler CanExecuteChanged; bool CanExecute(object parameter); void Execute(object parameter); }

.Net Implementation ICommand Public Property Set INotifyPropertyChanged INotifyCollectionChanged Public Property Get

Why? To Enable • Awesome UI and Data Development • Unit Testing of code • Large applications to have a common architecture • Different platforms can share code

What we’ll cover… • MVVM Theory • .Net MVVM • A practical example – some code! • Interface Driven Development – Portable Class Libraries – Unit Testing – Plugins • Some examples

What is MvvmCross? Code!

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

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

Code Evolution 3 • Cross Platform • All UIs MVVM • 100% shared application logic • 100% shared test harness

Data-Binding WP/WinRT 99% Xaml Droid Mainly Axml Some .Dialog Touch Some .Dialog Some .XIB Some C#

What we’ll cover… • MVVM Theory • .Net MVVM • A practical example – some code! • Interface Driven Development – Portable Class Libraries – Unit Testing – Plugins • Some examples

Portable Class Libraries

Unit Testing “I get paid for code that works, not for tests, so my philosophy is to test as little as possible to reach a given level of confidence. … When coding on a team, I modify my strategy to carefully test code that we, collectively, tend to get wrong.” Kent Beck http://stackoverflow.com/questions/153234/how-deep-are-your-unit-tests

Plugin – Native abstractions public interface IMvxComposeEmailTask { void ComposeEmail(string to, string cc, string subject, string body, bool isHtml); } protected void ComposeEmail(string to, string subject, string body) { Cirrious.MvvmCross.Plugins.Email.PluginLoader.Instance.EnsureLoaded(); var task = this.GetService(); task.ComposeEmail(to, null, subject, body, false); } 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); } } 1. Declare common functionality (an interface) 2. Write platform specific implementations 3. In apps, use the interface and not the implementation

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 • Different platforms can share code

What we’ll cover… • MVVM Theory • .Net MVVM • A practical example – some code! • Interface Driven Development – Portable Class Libraries – Unit Testing – Plugins • Some examples

MonoCross

A team in a galaxy far far away @imaji @mrlacey @sichy @slodge @touch4apps …

Redth in Canada https://github.com/Redth/WshLst/

Rune in Norway https://github.com/runegri/CrossBox

Jason in UK http://www.aviva.co.uk/drive/

CheeseBaron in Denmark http://blog.ostebaronen.dk/

Greg in NYC http://bit.ly/mvxgshac

JSON.Net Downunder (?)

Olivier in France http://www.e-naxos.com/UsIndex.html

Dan in Italy http://bit.ly/mvxDanA

Zoldeper in Hungary? https://github.com/Zoldeper/Blooor

Daniel in Redmond http://channel9.msdn.com/Events/Build/2012/3-004

What we’ve covered… • MVVM Theory • .Net MVVM • A practical example – some code! • Interface Driven Development – Portable Class Libraries – Unit Testing – Plugins • Some examples

To join in… • Tool up • Share • Reuse • Test • Architect If you want to join in:

MS-PL on GitHub http://github.com/slodge/MvvmCross

Some other talks available http://bit.ly/mvxTweetPic

C# - 1 Stack - Cloud to Mobile WP7 iOS Droid Win8 Data Access Business Logic Presentation Service Consumption Business Logic Local Data/Services UI Logic

Not as cool as dinosaurs WP7 iOS Droid Win8 Data Access Business Logic Presentation Service Consumption Business Logic Local Data/Services UI Logic

Some credits Images 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.png Diagrams from Java – ZK • http://books.zkoss.org/wiki/ZK_Developer%27s_Reference/MVVM Sample projects as credited inline

Thanks for listening… http://cirrious.com http://slodge.blogspot.com http://github.com/slodge/mvvmcross me@slodge.com @slodge Stuart Lodge, I’m a Dinosaur

Xamarin Seminar 13th December 2012 Please give us your feedback Follow us on Twitter http://bit.ly/xamfeedback @XamarinHQ