MugenMvvmToolkit - cross-platform MVVM framework

Introduction

• Winforms
• WPF
• Silverlight 5
• Silverlight for WP7.1, WP8, WP8.1
• Xamarin.Android
• Xamarin.iOS
• Xamarin.Forms
• WinRT XAML framework for Windows 8 Store apps

Data binding

• Lack of extensibility. Perhaps the main drawback that gives rise to all the others. Perhaps Microsoft was in a hurry with the implementation of Binding, because All infrastructure classes have an internal access modifier, and if the class is public, all its virtual methods are marked with the internal modifier. The state of affairs is well illustrated by comments on the System.Windows.Expression: public class System.Windows.Expression:
  

   //“This type supports the Windows Presentation Foundation (WPF) infrastructure and is not intended to be used directly from your code”. 

• Syntax Redundancy. For example, you have declared a property of type bool and you want to use its negation in Binding. To do this, you need to write a converter class to invert the value, register it in the resources, and only then it will be available in the code. Binding in this case looks like this:
  {Binding HasErrors, Converter={StaticResource InverseBooleanConverter}}
  It would be quite logical and natural to use the familiar “!” Operator:
  {Binding !HasErrors}
  
• Lack of support for binding events. Probably many used some kind of auxiliary EventToCommand class for this purpose.
• Platform dependency. Binding capabilities are highly platform specific. For example, on Windows Phone there is no possibility to update the Binding on a property change ( UpdateSourceTrigger=PropertyChanged ). On the WinRT platform, this opportunity returned, but the ValidatesOnExceptions and ValidatesOnNotifyDataErrors properties that are responsible for validation disappeared, and the StringFormat property, which is responsible for formatting the result, disappeared.

• Extensibility When creating a Binding parser, it builds a syntax tree, and this makes it easy to expand without manipulating text. The structure is very similar to expression trees in C #.
• C # syntax support. Binding supports all basic operators ( ??, ?:, +, -, *, /, %, , ==, !=, <, >, <=, >=, &&(and), ||(or), |, &, !, ~ ), the priority of operations is taken into account in accordance with the C # language standard. Lambda expressions, output of generic types based on values, method call, extension method call, Linq are supported.
  Example syntax:
  TargetPath SourcePath, Mode=TwoWay, Validate=true
  
  • TargetPath - the path for the Binding of the control.
  • SourcePath - the path for the Binding from a data source or a C # language expression, you can use several paths.
  • Mode, Validate - advanced options for Binding, such as Mode, Fallback, Delay , etc.
  
  Keywords:
  
  • $self - returns the current control to which the Binding is installed, the {RelativeSource Self} equivalent.
  • $root - returns the current root element for which the Binding is set.
  • $context - returns the current DataContext for Binding, the equivalent of {RelativeSource Self, Path=DataContext} .
  • $args - returns the current parameter EventArgs , can be used only if the TargetPath indicates an event.
  
  
  Examples

   Text Property, Mode=TwoWay, Validate=True Text Items.First(x => x == Name).Value + Values.Select(x => x.Value).First(x => x == Name), Fallback='empty' Text $string.Format('{0} {1}', Prop1, Prop2), Delay=100 Text $string.Join($Environment.NewLine, $GetErrors()), TargetDelay=1000 Text Property.MyCustomMethod() Text Prop1 ?? Prop2 Text $CustomMethod(Prop1, Prop2, 'string value') Text Prop1 == 'test' ? Prop2 : 'value' 

  
  
  
  
• Binding support for control events with access to the EventArgs parameter using the $args keyword.
  
  Examples

   TextChanged EventMethod($args.UndoAction) TextChanged EventMethodMultiParams(Text, $args.UndoAction) 

  
  
  
  
• Validation support. Validation is provided by the standard INotifyDataErrorInfo interface. Each platform will display an error message.
  
  Examples

   Text Property, Mode=TwoWay, ValidatesOnNotifyDataErrors=True Text Property, Mode=TwoWay, ValidatesOnNotifyDataErrors=True, ValidatesOnExceptions=True Text Property, Mode=TwoWay, Validate=True // ValidatesOnNotifyDataErrors=True, ValidatesOnExceptions=True 

  
  
  
  
• Advanced Binding on commands. If the Binding is set to a command, you can determine how the control will react to the “availability” of the command, the command can make the control inactive ( Enabled = false ) if the command cannot be executed.
  
  Examples

   Click Command, ToggleEnabledState=false //    Click Command, ToggleEnabledState=true //   

  
  
  
  
• Extended validation support. The built-in $GetErrors() method will return validation errors of the entire form for all properties or errors for specific properties. The method is useful when there is a need to show the user errors on the form.
  
  Examples

   Text $GetErrors(Property).FirstOrDefault() Text $string.Join($Environment.NewLine, $GetErrors()) //        ,  . 

  
  
  
  
• Relative binding Binding can be installed on the current control or on any other within the visual control tree (analogous to the RelativeSource property for XAML platforms).
  Auxiliary methods:
  
  • $Element(ElementName) - searches for an element with the name ElementName.
  • $Relative(Type), $Relative(Type, 1) - searches among the parent control elements with the Type type and (if necessary) taking into account the level of the parent element (second parameter).
  • $self - returns the current element on which the Binding is set.
  
  
  Examples

   Text $Relative(Window).Title Text $self.ActualWidth Text $Element(NamedSlider).Value 

  
  
  
  
• Support for attached properties, events, and methods. Allows you to easily expand any type. For example, in WinForms, the DataGridView does not have a SelectedItem property, but we can easily add it using the attached property:
  
  Example

   var member = AttachedBindingMember.CreateMember<DataGridView, object>("SelectedItem", (info, view) => { var row = view.CurrentRow; if (row == null) return null; return row.DataBoundItem; }, (info, view, item) => { view.ClearSelection(); if (item == null) return; for (int i = 0; i < view.Rows.Count; i++) { if (Equals(view.Rows[i].DataBoundItem, item)) { var row = view.Rows[i]; row.Selected = true; } } }, "CurrentCellChanged"); //CurrentCellChanged -   DataGridView,     . //  BindingServiceProvider.MemberProvider.Register(member); 

  
  
  
  
• Support dynamic resources. You can add any object to the resources, and then access it through a binding. Using dynamic resources, it is easy to implement cross-platform application localization.
  
  Example

   //   MyResourceObject   i18n BindingServiceProvider.ResourceResolver.AddObject("i18n", new BindingResourceObject(new MyResourceObject())); // Binding     Text $i18n.MyResourceString 

  
  
  
  
• Fluent syntax support.
  
  Example

   var textBox = new TextBox(); var set = new BindingSet<TextBox, MainViewModel>(textBox); set.Bind(window => window.Text).To(vm => vm.Property).TwoWay(); set.Apply(); 

  
  
  
  
• Cross platform All necessary interfaces and classes are collected in a portable class library. Any platform will work with the same code, with the same capabilities.
• Performance. On platforms where there is a standard implementation of Binding, MugenMvvmToolkit Binding runs faster than the standard implementation, while providing much more features.

MVVM implementation features

• One or two classes that implement the INotifyPropertyChanged interface.
• A class that implements the ICommand interface.
• Messenger class that allows you to exchange messages between classes.
• Several helper methods to synchronize UI threads.

• Navigation between ViewModel regardless of platform.
• Creating a ViewModel , via a constructor with dependencies and parameters.
• Dynamic binding of ViewModel and View .
• ViewModel state management depending on the View life cycle.
• Saving / restoring ViewModel state depending on the platform.

The main features of MugenMvvmToolkit:

• Cross platform At the moment, all major platforms are supported on which you can use the C # language. All necessary interfaces and classes are collected in a portable class library. Any platform will work with the same code, with the same capabilities.
• Single ViewModel code for different platforms.
• Integration with DI-containers. MugenMvvmToolkit is not tied to a specific DI container, the IIocContainer interface is used for interaction. Currently, there are implementations for the three DI containers MugenInjection , Autofac , Ninject . The list can be expanded by adding the IIocContainer interface IIocContainer for any other container.
• The presence of several base classes ViewModel , for different situations.
  
  • ViewModelBase - the base class for all ViewModel , contains methods for creating other ViewModel , methods for exchanging messages, methods and properties IsBusy , BusyMessage for managing the state of asynchronous operations.
  • CloseableViewModel - inherited from ViewModelBase , implements the ICloseableViewModel interface, which allows you to manage the process of closing the ViewModel .
  • ValidatableViewModel - ValidatableViewModel from CloseableViewModel , contains methods and properties for validation, implements the INotifyDataErrorInfo interface for notifying Binding about errors.
  • EditableViewModel<T> - inherits from ValidatableViewModel , allows you to edit and validate the data model, monitors the state of the object, and allows you to undo the changes.
  • WorkspaceViewModel, WorkspaceViewModel<TView> - inherits from CloseableViewModel , contains the properties IsSelected and DisplayName - for convenient display of the ViewModel in the interface. Implements the IViewAwareViewModel<TView> interface, which allows access to the View via the IView interface. Implements the INavigableViewModel interface, which allows you to track the navigation process for the ViewModel , OnNavigatedFrom , OnNavigatingFrom , OnNavigatedTo .
  • GridViewModel - inherited from ViewModelBase , allows you to work with collections of various objects.
  • MultiViewModel - inherited from CloseableViewModel , allows you to work with the collections of other ViewModel , well suited for binding to TabControl .
  
  
• MugenMvvmToolkit does not use the ViewModelLocator to create a ViewModel . All ViewModel are created using the DI container, the IViewModelProvider interface is responsible for creating the ViewModel .
  
  ViewModel Creation and Interaction Example

    public class ItemViewModel : ViewModelBase { public ItemViewModel(ISomeService service) { } public void InitializeValue() { } } public class MainViewModel : ViewModelBase { public void CreateViewModelMethod() { // ViewModel var viewModel = GetViewModel<ItemViewModel>(); //  , ,   .. viewModel.InitializeValue(); } } 

  
  
  
  
• Comparison of View with ViewModel occurs dynamically. The IViewMappingProvider interface is responsible for IViewMappingProvider , and the default naming convention is used. The following endings are removed for the ViewModel :
  "ViewModel", "Vm" ,
  and for View :
  "ActivityView", "FragmentView", "WindowView", "PageView", "FormView", "Form", "View", "V", "Activity", "Fragment", "Page", "Window"
  (you can expand these lists) and if after that the names match, it is considered that the View corresponds to the ViewModel .
  Matching example:
  MainViewModel, MainVm -> MainActivityView, MainFragmentView, MainWindowView ..
  If you want to explicitly set the View for the ViewModel , you can use the ViewModelAttribute (in this case, the naming convention is ignored):
  

   [ViewModel (typeof(MainViewModel))] public partial class MainWindow : Window 

  
  You can also set a name for the View and then use it when creating / displaying the ViewModel :
  
  Example

   [ViewModel (typeof(ItemViewModel), “ViewName”)] public partial class ItemView : Window // ViewModel     View //   ViewModel    View   ViewName var viewModel = GetViewModel<ItemViewModel>(parameters: NavigationConstants.ViewName.ToValue("ViewName")); // ViewModel var viewModel = GetViewModel<ItemViewModel>(); // ,    ViewModel   View   ViewName viewModel.ShowAsync(NavigationConstants.ViewName.ToValue("ViewName")); 

  
  
  
  
• Powerful validation system, asynchronous validation support, easy integration with existing validation frameworks.
• Support for saving / restoring ViewModel state. If the ViewModel has a state to save, it must implement the IHasState interface, which has two methods LoadState and SaveState . The system will automatically call these methods depending on the life cycle of the application and the current platform.
  
  Example

   private static readonly DataConstant<string> StringState = DataConstant.Create(() => StringState, true); public void LoadState(IDataContext state) { //      state.AddOrUpdate(StringState, "Constant key"); //        state.AddOrUpdate("Test", "String key"); } public void SaveState(IDataContext state) { string data = state.GetData(StringState); var s = state.GetData<string>("Test"); } 

  
  
  
  

Navigation

 //         var mainWindow = new MainWindow(); //         . mainWindow.Init(args); if (!mainWindow.ShowDialog().GetValueOrDefault()) return; //      ,      . 

 //     Activity,    ,     . var page2 = new Intent (this, typeof(Page2)); //      page2.PutExtra ("arg1", arg) StartActivity (page2); //  ,  ,    Activity 

 //       Android. NavigationService.Navigate(typeof(Page2), arg); 

 ShowViewModel<DetailViewModel>(new DetailParameters() { Index = 2 }); 

 public void Init(DetailParameters parameters) { // use the parameters here } 

 public class Vm2 : ViewModelBase { public void InitFromVm1() { } public object GetResult() { return null; } } public class Vm1 : ViewModelBase { public async void Open() { var vm2 = GetViewModel<Vm2>(); //     ,     . vm2.InitFromVm1(); //   IAsyncOperation, //         Vm2 IAsyncOperation<bool> asyncOperation = vm2.ShowAsync(Vm2CloseCallback); //     asyncOperation.ContinueWith(Vm2CloseCallback); //      await await asyncOperation; //      Vm2 //    var result = vm2.GetResult(); } private void Vm2CloseCallback(IOperationResult<bool> operationResult) { //    var result = ((Vm2)operationResult.Source).GetResult(); } private void Vm2CloseCallback(Vm2 vm2, IOperationResult<bool> operationResult) { //    var result = vm2.GetResult(); } } 

WPF and SL

• Navigation support using dialogs / windows for WPF. If you map the Window to any ViewModel , then when you call the ShowAsync method, a dialog box will be shown.
• Navigation support using the ChildWindow class for SL. If you associate ChildWindow with any ViewModel , then when you call the ShowAsync method, a dialog box will be shown.
• Support for page navigation, for WPF - NavigationWindow , for SL - Frame .
• Validation support using the standard System.Windows.Controls.Validation.Errors property.

 <TextBlock Text="{DataBinding 'Text.ExtensionMethod(Text.Count())'}" /> <TextBlock Text="{DataBinding '$string.IsNullOrEmpty(Text) ? \'String is empty\' : \'String is not empty\''}"/> <TextBlock View.Bind="Text Text.ExtensionMethod(Text.Count())"/> <TextBlock View.Bind="Text $string.IsNullOrEmpty(Text) ? 'String is empty' : 'String is not empty'"/> <Button Click="{DataBinding Path=Command, ToggleEnabledState=False}" /> <Button View.Bind="Click Command, ToggleEnabledState=False" /> <TextBox TextChanged="{DataBinding 'EventMethodMultiParams($self.Text, $args.UndoAction)'}" /> <TextBox View.Bind="TextChanged EventMethodMultiParams($self.Text, $args.UndoAction)" /> 

WinRT and Windows phone

• Page navigation support using the Page class. If you match Page with any ViewModel , then when you call the ShowAsync method, a new page will be shown.
• Validation support using the standard System.Windows.Controls.Validation.Errors property.

 xmlns:markupExtensions="clr-namespace:MugenMvvmToolkit.MarkupExtensions;assembly=MugenMvvmToolkit.WinPhone" xmlns:markupExtensions="using:MugenMvvmToolkit.MarkupExtensions" 

 <TextBlock markupExtensions:View.Bind="Text Text.ExtensionMethod(Text.Count())"/> <TextBlock markupExtensions:View.Bind="Text $string.IsNullOrEmpty(Text) ? 'String is empty' : 'String is not empty'"/> <Button markupExtensions:View.Bind="Click Command, ToggleEnabledState=False" /> <TextBox markupExtensions:View.Bind="TextChanged EventMethodMultiParams($self.Text, $args.UndoAction)" /> 

Winforms

• MugenMvvmToolkit provides a convenient xml editor for Binding.
• DataTemplateSelector for Binding support, analog DataTemplateSelector for Xaml platforms.
• Navigation support using the Form class. If you map a Form to any ViewModel , then when you call the ShowAsync method, a dialog box will be shown.
• Support for validation using the standard System.Windows.Forms.ErrorProvider class.

1. Create a class that inherits from the Binder class:
   

    public class ViewBinder : Binder { public ViewBinder() { } public ViewBinder(IContainer container) : base(container) { } } 

   
   
2. Compile the project, open the designer with the desired form, go to the Toolbox tab, the ViewBinder class should appear ViewBinder
3. Add it to the form, then you can add Binding using the Bindings property.

 <Bindings> <addToolStripButton Click="AddNodeCommand" /> <removeToolStripButton Click="RemoveNodeCommand" /> <treeView ItemsSource="Nodes" CollectionViewManager="$treeNodeCollectionViewManager" ItemTemplate="$treeNodeTemplate" SelectedNode.DataContext="SelectedNode, Mode=OneWayToSource" /> <nameTextBox Text="SelectedNode.Name, Mode=TwoWay, Fallback='Nothing selected'" /> <validCheckBox Checked="SelectedNode.IsValid, Mode=TwoWay" /> </Bindings> 

Xamarin.Android

• Support for working with Activity, for all standard Activitythere is an implementation with the prefix Mvvm, to work you need to inherit not from the standard Activity, but with the prefix Mvvm. If you compare Activitywith any ViewModel, then when you call the method ShowAsync, you will be navigated to a new Activitytype.
• Support for working with Fragment, for all standard Fragmentthere is an implementation with the prefix Mvvm, to work you need to inherit not from the standard Fragment, but with the prefix Mvvm. If you compare MvvmDialogFragmentwith any ViewModel, then when the method is called ShowAsync, a dialog box will be displayed.
• Activity Fragment . Activity Fragment , / ViewModel .
• back stack fragment .
• Binding layout (xml-). Binding Android xmlns:pkg="http://schemas.android.com/apk/res-auto" , Binding Bind
  
  Example

   <ListView android:layout_width="fill_parent" android:layout_height="wrap_content" pkg:ItemTemplate="@layout/_itemlistviewtemplate" pkg:Bind="ItemsSource Items"/> 

  
  
  
  
• Binding ActionBar , Toolbar , PopupMenu OptionsMenu .
• DataTemplateSelector Binding, DataTemplateSelector Xaml .
• TextView.Error .

 <TextView android:layout_width="fill_parent" android:layout_height="fill_parent" pkg:Bind="Text $Format('Name: {0}, Id: {1}', Name, Id)" /> <Button android:layout_width="fill_parent" android:layout_height="wrap_content" pkg:Bind="Click Command" /> 

Xamarin.iOS

• UIViewController , UIViewController Mvvm, UIViewController , Mvvm. UIViewController - ViewModel , ShowAsync , UIViewController .
• UIViewController .
• UIViewController . UIViewController , / ViewModel .
• DataTemplateSelector Binding, DataTemplateSelector Xaml .
• MonoTouch.Dialog .

Xamarin.Forms

• Page . Page - ViewModel , ShowAsync , .
• Page .
• Binding Xaml-. MugenMvvmToolkit DataBindingExtension attached property View.Bind , Binding. Binding Xaml- xmlns:mugen="clr-namespace:MugenMvvmToolkit.MarkupExtensions;assembly=MugenMvvmToolkit.Xamarin.Forms"

 <Entry Text="{mugen:DataBinding Name, Mode=TwoWay, Validate=True}" /> <Button Command="{mugen:DataBinding $Relative(ListView).DataContext.ShowCommand}" Text="{mugen:DataBinding Item1}" CommandParameter="{mugen:DataBinding Item2}" /> 

Conclusion

References:

• Examples
• Fody
• Nuget