Introducing TinyMvvm 2.0

TinyMvvm is a library that I created a couple of years ago. The idea was to build a small (tiny) MVVM library that made me more productive. I first released TinyNavigationHelper that helped med to abstract the Xamarin.Forms navigation, because I do not want my ViewModels to have references to Xamarin.Forms.

Last time I updated TinyMvvm was about one and a half year ago, the reason I have not updated it since then is that it has been stable and worked very well for me in multiple apps I have worked with for multiple clients.

When Xamarin.Forms Shell was released I started to work with some improvements to make TinyMvvm work with Xamarin.Forms Shell. But I never finished them, because the current version worked very well together with Shell. The only thing not supported was URL navigation.

But in the current app, I work with I had a use case where URL navigation would be very nice to use. Of course, I could have used it without using the navigation in TinyMvmm. But there are some great features of TinyMvvm that I missed then. For example to get navigation parameters in the ViewModel without having to pass them manually from the view and if I wanted to navigate from the ViewModel I had to add references to Xamarin.Forms inside of them.

New features

There is a couple of new stuff added to TinyMvvm in this release.

ShellNavigationHelper

If you want to use URL navigation together with TinyMvvm you have to use the ShellNavigtionHelper. ShellNavigationHelper is a subclass of FormsNavigationHelper.

var navigationHelper = new TinyNavigationHelper.Forms.ShellNavigationHelper();
navigationHelper.RegisterViewsInAssembly(appAssembly);
navigationHelper.RegisterView("MainView", typeof(MainView));

The method that is supporting URL navigation is the NavigateTo(string key) method. All other methods of INavigationHelper will use traditional Xamarin.Forms NavigationService. To NavigateTo you can either specify a URL or a key to a view. If it got a key that you have registered as in the code about it will use the traditional NavigationService, otherwise, it will use Shell navigation with URL.

await NavigationHelper.Current.NavigateTo("//home/messages?id=1");

If you are in a ViewModel with ViewModelBase as parent you can use the Navigation property of of the ViewModelBase,

await Navigation.NavigateTo("//home/messages?id=1");

QueryParameters in ViewModelBase

With URL navigation you can pass query parameters. With TinyMvvm you can access them from the ViewModel via the QueryParameters property of ViewModelBase. QueryParameters is of type Dictionary<string, string>.

public override async Task Initialize()
{
    await base.Initialize();

    var id = QueryParameters["id"];
}

Optimization

In TinyMvvm 1.x there was a dependency on TinyNavigationHelper, in 2.0 is TinyNavigationHelper added as a submodule and compiled into the same assembly as TinyMvvm. This reduces the amount of referenced assemblies that Xamarin.Forms have to search for custom renderers in.

Breaking changes

The constructor to FormsNavigationHelper has changed. You can not pass an instance of Xamarin.Forms.Application anymore, the reason is that it not is necessary to provide the navigation helper with it.

Obsolete fetures

The BeginInvokeOnMainThread future of ViewModelBase has been marked as obsolete, the recommendation is to use Xamarin.Essentials.MainThread.BeginInvokeOnMainThread instead.

TinyMvvm basics

Here are some of the basics of TinyMvvm, you will find the full docs and a sample project here, https://github.com/TinyStuff/TinyMvvm.

Initiation

TinyMvvm.Forms.TinyMvvm.Initialize();

ViewBase<T>

Features (or drawbacks) of the ViewBase

  • It creates the ViewModel for you if you inherit the ViewModel from ViewModelBase

The view should inherit from ViewBase<T> where T is the ViewModel. The ViewModel can be any class that has ViewModelBase as the base class.

ViewBase<T> itself inherits from Xamarin.Forms.ContentPage and can be treated by Xamarin Forms as any page.

If you decide to use ViewModelBase as the base class for your view model and at the same time have the IoC resolver enabled, the view will automatically create the view model for you when the view is created. Hence no need to inject the view model in the constructor and assign it manually. Feature or not, you decide.

An example of a typical page in TinyMvvm would look like this:

<tinymvvm:ViewBase x:TypeArguments="viewmodels:MainViewModel" 
    xmlns="http://xamarin.com/schemas/2014/forms" 
    xmlns:viewmodels="clr-namespace:TinyMvvm.Forms.Sample.ViewModels;assembly=TinyMvvm.Forms.Samples"
    xmlns:tinymvvm="clr-namespace:TinyMvvm.Forms;assembly=TinyMvvm.Forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
    x:Class="TinyMvvm.Forms.Sample.Views.MainView">

</tinymvvm:ViewBase>

What you need to do is:

  • Define two namespaces (viewmodels and tinymvvm)
  • Change the view base type to tinymvvm:ViewBase
  • Add a type argument pointing to your ViewModel

### ViewModelBase

TinyMvvm also defines a base class for the view model called `ViewModelBase`.

Features of the ViewModelBase

* Wraps navigation for you through the INavigation interface (Implemented in TinyNavigation)
* Implements INotifyPropertyChanged for you
* Propagates life cycle events to the view (Initialize, OnAppearing, OnDisapparing)

### IoC
Tiny Mvvm is not bound to any specific IoC provider. There is a provider for Autofac that you can install with the "TinyMvvm.Autofac" package.

Install-Package TinyMvvm.Autofac

TinyMvvm has a Resolver in its core project. To use it you need to add on a provider to it that implements the IResolver interface, for example, our Autofac provider.

```csharp
var container = builder.Build();
var resolver = new AutofacResolver(container);
Resolver.SetResolver(resolver);
var navigationHelper = Resolver.Resolve();

TinyCommand

TinyMvvm has its own implementation of ICommand that not has any references to Xamarin.Forms so you can use it in a library without reference Xamarin.Forms.

public ICommand WithParameter
{
      get
      {
                return new TinyCommand(async() =>
                {
                   //Do stuff
                });
      }
}

TinyNavigationHelper for Xamarin.Forms

TinyNavigationHelper is a helper that I created together with Johan Karlsson for a project where I don't want to install a separate MVVM framework, but I still wanted to have an abstraction for the Navigation so that I could handle navigation in my ViewModels without having a reference to Xamarin.Forms in the ViewModels. The reason for that is that I want to have my ViewModels clean from platform specific libraries so I can use them for other platforms as well, for example, if I want to extend my application with support for WPF.

You will find the source code on GitHub and you're more than welcome to contribute and give feedback.
https://github.com/dhindrik/TinyNavigationHelper. You will also find the complete documentation on GitHub.

Installation
The easiest way to install it is via NuGet:
Install-Package TinyNavigationHelper.Forms

And for projects that not reference Xamarin.Forms:
Install-Package TinyNavigationHelper.Abstraction

Configure TinyNavigationHelper
There are three ways to configure the navigation, the two first is to register the type of the view together with a key that you define. The third way is to register all views in an assembly. What the method will do that it searching throw the assembly for classes that inherit from Page.

// Option 1: Register single views
var navigationHelper = new FormsNavigationHelper(this);
navigationHelper.RegisterView("MainView");
 
// Option 2: Register single views
var navigationHelper = new FormsNavigationHelper(this);
navigationHelper.RegisterView("MainView", typeof(MainView));
 
// Option 3: Register all views (pages) that is inherited from Page
// The class name will be the key. To use this, you need to add using System.Reflection;
var asm = typeof(App).GetTypeInfo().Assembly;
navigationHelper.RegisterViewsInAssembly(asm);

If you want to use it with dependency injection you can register FormsNavigationHelper with the INavigationHelper interface.

Use TinyNavigationHelper
You can always get the current instance of TinyNavigationHelper via the static Current property on from the NavigationHelper class.

var navigationHelper = NavigationHelper.Current;

To navigate to a view, use the NavigateToAsync method.

await navigationHelper.NavigateToAsync("MainView");
 
//With parameter
await navigationHelper.NavigateToAsync("MainView", "Parameter");

The parameter will be sent to the constructor of the view.

public class MainView
{
     public MainView(object parameter)
     {
          var data = parameter as string;
     }
}

To go back, use the BackAsync method.

await navigationHelper.BackAsync();

You can also open a modal with the OpenModalAsync method.

await navigationHelper.OpenModalAsync("MainView");
 
//open a modal with an own navigation page
await navigationHelper.OpenModalAsync("MainView", true);
 
//with parameter
await navigationHelper.OpenModalAsync("MainView", "parameter", true);

You will close the modal with the CloseModalAsync method.

await navigationHelper.CloseModalAsync();

If you want to reset the navgation stack, you can use the SetRootView method.

//without parameter and navigation stack
navigationHelper.SetRootView("MainView");
 
//with parameter, but without navigation stack
navigationHelper.SetRootView("MainView", "parameter");
 
//without parameter, but with navigation stack
navigationHelper.SetRootView("MainView", true);
 
//with parameter and navigation stack
navigationHelper.SetRootView("MainView", "parameter", true);

Xamarin.Forms – MVVM BaseView and BaseViewModel

In this post, I will describe how I have created base classes for my views and ViewModels in my latest projects. It will probably break some of the MVVM rules, but I think this is a productive way to work. Please leave a comment about your thoughts about in a comment below.

First of all, I'm creating the base ViewModel. I'm adding three virtual methods, Init, OnAppearing and OnDisappering. I'm making the methods virtual so I can override them in the view models if I want.

My idea is that Init() will run after the ViewModel has been created. OnAppearing when a view appearing on the screen and disappearing when the view is disappearing. To place them in the base class for the view models makes it possible to call them from a base class for my views so I don't have to write code for calling them in every view I'm creating.

If I using an MVVM framework (I'm used to using MvvmLight) my base ViewModel will inherit the base ViewModel from the framework I'm using. But this example will show how it will be without any framework.

public abstract class BaseViewModel : INotifyPropertyChanged
{
     public event PropertyChangedEventArgs PropertyChanged;
 
     public async virtual Task Init()
     {
     }
 
     public async virtual Task OnAppearing()
     {
     }
 
     public async virtual Task OnDisappearing()
     {
     }
}

My base view will be generic to define what ViewModel I will use for the current view. I will also say the generic type has to inherit from BaseViewModel so it not can be used with other types of object. This also makes it possible for me to call the methods I created in the BaseViewModel. In the constructor, I will use my IoC to create an instance of the ViewModel.

public abstract class BaseView<T> : ContentPage where T : BaseViewModel
{
 
     private BaseViewModel _viewModel;
 
     public BaseView()
     {
         //IoCHelper is an own defined class for resolving types that are defined in an IoC container
         _viewModel = IoCHelper.Resolve<T>();
 
         BindingContext = _viewModel;
 
         viewModel.Init();       
     }
 
     public async override void OnAppearing()
     {
           base.OnAppearing();
 
          await _viewModel.OnAppearing();
     }
 
     public async override void OnDisappearing()
     {
          base.OnDisappering();
 
          await _viewModel.OnDisappering();
     }
}

To define what ViewModel that should be used for the view in XAML you can do that by using x:TypeArguments like in the example below. This means that you don't have to write any code in the code-behind. Don't forget to remove that the view inherits from ContentPage in the code-behind of the view.

<local:BaseView xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:MyApp.Views;"
             xmlns:vm="clr-namespace:MyAPp.ViewModels;"
             x:TypeArguments="vm:MainViewModel"
             x:Class="MyApp.Views.MainView">