Home Arrow Icon Knowledge base Arrow Icon Global Arrow Icon How does MvvmCross support ViewModel to ViewModel navigation


How does MvvmCross support ViewModel to ViewModel navigation


MvvmCross supports ViewModel to ViewModel navigation through its ViewModel-first navigation approach. This means that navigation occurs between ViewModels rather than between Views. Here's how it works:

Overview of MvvmCross Navigation

MvvmCross uses the `IMvxNavigationService` interface to manage navigation between ViewModels. When a ViewModel requests navigation to another ViewModel, MvvmCross automatically locates the corresponding View for the target ViewModel, creates an instance of that View, and sets the target ViewModel as its `DataContext`[1][3].

Key Components and Methods

- `IMvxNavigationService`: This is the core interface for navigating between ViewModels. It provides methods like `Navigate()` and `Navigate(TParameter parameter)` to navigate to different ViewModels with or without parameters[3][5].

- `ShowViewModel()`: This method is used to navigate to a specific ViewModel. It is similar to `Navigate()` but is more commonly used in older versions of MvvmCross[3].

- `Close(this)`: This method is used to close the current ViewModel and return to the previous one in the navigation stack[3].

Navigation with Parameters

MvvmCross allows passing complex parameters between ViewModels using the `Navigate(TParameter parameter)` method. The receiving ViewModel must implement `IMvxViewModel` or inherit from `MvxViewModel` to handle these parameters. Parameters are serialized using JSON, so you need to have the MvvmCross Json plugin installed or register your own `IMvxJsonConverter` for custom types[3].

Lifecycle Methods

MvvmCross provides lifecycle methods for ViewModels, such as `ViewAppearing()`, `ViewAppeared()`, `ViewDisappearing()`, and `ViewDisappeared()`, which are called in response to View lifecycle events. These methods can be used to perform actions when the View is about to appear or disappear[7][8].

Customization

MvvmCross allows customization of the navigation process. For example, you can override the default ViewModel location and construction by implementing a custom `IMvxViewModelLocator` in your App object[10].

Example of Navigation

Here's an example of how to navigate from one ViewModel to another using MvvmCross:

csharp
public class FirstViewModel : MvxViewModel
{
    private readonly IMvxNavigationService _navigationService;

    public FirstViewModel(IMvxNavigationService navigationService)
    {
        _navigationService = navigationService;
    }

    public IMvxAsyncCommand NavigateCommand => new MvxAsyncCommand(() => _navigationService.Navigate());
}

In this example, when the `NavigateCommand` is executed, it navigates to `SecondViewModel` using the `IMvxNavigationService`. MvvmCross will automatically locate the corresponding View for `SecondViewModel`, create it, and set `SecondViewModel` as its `DataContext`[1].

Citations:
[1] https://www.mvvmcross.com/documentation/tutorials/tipcalc/the-tip-calc-navigation
[2] https://www.mvvmcross.com/documentation/advanced/mvxinteraction
[3] https://www.mvvmcross.com/documentation/fundamentals/navigation
[4] https://nicksnettravels.builttoroam.com/post-2019-03-24-viewmodel-to-viewmodel-navigation-in-a-xamarinforms-application-with-prism-and-mvvmcross-aspx/
[5] https://visualstudiomagazine.com/articles/2018/05/08/build-a-xamarin.forms-application.aspx
[6] https://stackoverflow.com/questions/40911640/mvvmcross-navigate-to-viewmodel-from-tabbed
[7] https://www.mvvmcross.com/documentation/fundamentals/viewmodel-lifecycle
[8] https://www.mvvmcross.com/mvvmcross-5-release/
[9] https://stackoverflow.com/questions/51474717/mvvmcross-navigation-through-multiple-view-models
[10] https://www.mvvmcross.com/documentation/advanced/customizing-using-App-and-Setup