MVVM frameworks - MvvmCross MvvmCross is an MVVM framework that is maintained by Stuart Lodge and Martijn van Dijk. It allows developers to write C# code using the MVVM pattern that can be shared across platforms like iOS, Android, and UWP. MvvmCross has features like data binding, commands, and navigation that make the MVVM pattern easier to implement. It also includes many plugins for common tasks so developers have to write less platform-specific code. The presentation demonstrated how to use MvvmCross for data binding, commands, and navigation in both C# and XAML/XML.

1. MVVM frameworks - MvvmCross
Flavius-Radu DEMIAN

2. A bit about me
• General Manager@Deventure
• Timisoara .Net Meetup organizer
• Mobile and Web developer
• Xamarin and Umbraco enthusiast
• In love with technology
flavius.demian@deventure.co @flaviusdemian

3. Agenda
Xamarin’s Unique Approach
What is MVVM?
Why MVVM?
The MvvmCross magic
Data-Binding, Commands, Navigation
Advantages
Disadvantages

4. Expectations
I wish to have an interactive presentation.
Please feel free to ask questions any time.
My ultimate goal is to make you
curios.
Go home and try it yourself!

5. Xamarin’s Unique Approach

6. Xamarin’s Unique Approach

7. Xamarin’s Unique Approach
• native user interface
• native performance
• shared code across platforms
• usage of C# & .NET framework
• full API coverage
• fewer developers

8. The Xamarin Magic
Write Everything in C#

9. The Xamarin Magic
Xamarin takes the C# code and it compiles it down to native on iOS
and Android.
The magic is that you can also use it on the Windows platform.
(Almost) everything you can do in Objective-C, Swift or Java can be
also done in C# with Xamarin.
Check the limitations on www.xamarin.com .
Since you use C# on all the platforms, code reuse varies from 60% to
90%.

10. Xamarin Architecture Guide

11. What is MVVM?

12. Model View ViewModel

13. MVVM Technical Details
It is derived from the Model View Controller Pattern.
• properties
• data binding
• INotifyPropertyChanged
• INotifyCollectionChanged
• IValueConverter
• ICommand
• UI thread

14. Why MVVM?

15. MVVM Pros and Cons
There is a reason why it’s called a pattern.
Pros:
• separation of concerns
• decoupling
• code reuse
• testability
Cons:
• MVVM is "overkill" for simple UI operations

16. The MvvmCross Magic

17. The MvvmCross Magic
It’s an open-source framework maintained by Stuart Lodge, Martijn
van Dijk & Co.
It has Dependency Injection built-in -> Interface Driven Design.
It has a lot of plugins already written such as location, emails, gallery,
network, SQLite, secure storage, phone calls etc.
#IF plugins -> less work for the developer, but also less control.

18. The MvvmCross Magic

19. The MvvmCross Magic
MvvmCross has support for:
• Xamarin.iOS
• Mac
• Xamarin.Android
• Windows Presentation Foundation
• Windows Phone
• Windows 8
• Universal Windows Platform

20. The MvvmCross Magic
It has huge popularity and the community is very active.
https://jabbr.net/#/rooms/mvvmcross
https://xamarinchat.slack.com/messages/mvvmcross/
https://github.com/MvvmCross/MvvmCross

21. Data Binding, Commands, Navigation

22. Data Binding - Properties
No C#, just XAML
<TextBox Text="{Binding Password, Mode=TwoWay}" />

23. Data Binding - Properties
No C#, just XML
xmlns:local="http://schemas.android.com/apk/res-auto"
<EditText local:MvxBind="Text Password"

24. Data Binding - Properties
Just C#
var set = this.CreateBindingSet<LoginViewController, LoginViewModel>();
set.Bind(textField_Password).To(vm => vm.Password);

25. Data Binding - Listviews
No C#, just XAML
<ListBox
ItemsSource="{Binding MyCollection}"
<ListBox.ItemTemplate>
<DataTemplate> …..
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>

26. Data Binding - Listviews
No C#, just XML
<Mvx.MvxListView local:MvxBind="ItemsSource MyCollection;
ItemClick ViewDetailsCommand"
local:MvxItemTemplate="@layout/item_template_row" />

27. Data Binding - Listviews
Just C#
var set = this.CreateBindingSet<XViewController, XViewModel>();
set.Bind(source).To(x => x.MyCollection);
set.Apply();

28. ViewModel Commands
No C#, just XAML
xmlns:i="clr-namespace:System.Windows.Interactivity;
assembly=System.Windows.Interactivity"
xmlns:commandbinding="clr-namespace:Cirrious.MvvmCross.WindowsPhone.Commands;
assembly=Cirrious.MvvmCross.WindowsPhone"
<TextBlock Text="{Binding Name}">
<i:Interaction.Triggers>
<i:EventTrigger EventName="Tap">
<commandbinding:MvxEventToCommand Command="{Binding
MyCommand}" />
</i:EventTrigger>
</i:Interaction.Triggers>
</TextBlock>

29. ViewModel Commands
No C#, just XML
xmlns:local="http://schemas.android.com/apk/res-auto"
<Button local:MvxBind="Click LoginCommand" />

30. ViewModel Commands
Just C#
var set = this.CreateBindingSet<LoginViewController, LoginViewModel>();
set.Bind(btn_Login).To(x => x.LoginCommand);
set.Apply();

31. Navigation
Go forward:
CurrentViewModelInstance.ShowViewModel<NewViewModel>();

32. Navigation
Go back:
CurrentViewModelInstance.Close(this);

33. MvvmCross App Architecture

34. App Architecture
The project should be split in 2:
Common core which contains:
• models
• viewmodels
• business logic
• data access layer
UI-project per platform:
• each platform views

35. Small Demo Time

36. MvvmCross Pros & Cons
Pros:
• interchangeable code module
• supports Test Driven Development (TDD)
• it follows the Core pattern
• it has data binding

37. MvvmCross Pros & Cons
Cons:
• it is a non-native pattern for iOS -MVC- and Android -aprox MVC-
• core 3rd party dependency
• lot’s of glue code for custom bindings

38. Thank you very much.