Home Arrow Icon Knowledge base Arrow Icon Global Arrow Icon How do I navigate to a new ViewModel without specifying the View in MvvmCross


How do I navigate to a new ViewModel without specifying the View in MvvmCross


Navigating to a new ViewModel without specifying the View in MvvmCross is straightforward due to its ViewModel-first navigation approach. This means you navigate from one ViewModel to another, and MvvmCross automatically locates and creates the corresponding View. Here's how you can achieve this:

Understanding ViewModel-First Navigation

In MvvmCross, navigation is handled by the `IMvxNavigationService`. This service allows you to navigate between ViewModels without directly interacting with Views. The framework uses a convention to link ViewModels to Views based on their names. For example, a `TipViewModel` will be linked to a `TipView` by default[2].

Navigating to a New ViewModel

To navigate to a new ViewModel, you can use the `ShowViewModel` method or the `Navigate` method provided by the `IMvxNavigationService`. Here's how you can do it:

1. Using `ShowViewModel` Method:**

You can call `ShowViewModel` from within another ViewModel to navigate to a new ViewModel. This method is part of the `MvxViewModel` class and allows you to pass parameters if needed.

csharp
   public class MyViewModel : MvxViewModel
   {
       public void NavigateToDetailViewModel()
       {
           ShowViewModel();
       }
   }
   

If you need to pass parameters to the new ViewModel, you can do so by using a generic version of `ShowViewModel` that accepts a parameter type:

csharp
   public class MyViewModel : MvxViewModel
   {
       public void NavigateToDetailViewModelWithParams()
       {
           var parameter = new MyParameterModel { First = "Hello", Second = "World" };
           ShowViewModel(parameter);
       }
   }
   

The receiving ViewModel should implement `IMvxViewModel` or inherit from `MvxViewModel` to handle the parameter:

csharp
   public class DetailViewModel : MvxViewModel
   {
       protected override Task Init(MyParameterModel parameter)
       {
           // Use the parameters here
           return Task.CompletedTask;
       }
   }
   

2. Using `IMvxNavigationService`:**

Alternatively, you can inject `IMvxNavigationService` into your ViewModel and use its `Navigate` method to move to another ViewModel:

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

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

       public async Task NavigateToDetailViewModel()
       {
           await _navigationService.Navigate();
       }
   }
   

Handling Navigation Events

If you need to intercept or react to navigation events (e.g., before or after navigating), you can hook into the events provided by the `IMvxNavigationService`:

csharp
_navigationService.BeforeNavigate += (sender, e) =>
{
    // Handle before navigation event
};

_navigationService.AfterNavigate += (sender, e) =>
{
    // Handle after navigation event
};

Removing Views from Back Stack

Sometimes, you might want to prevent the user from navigating back to a previous View. While MvvmCross doesn't directly support removing Views from the back stack, you can achieve similar behavior by using custom navigation logic or by implementing a custom `ViewPresenter` to manage the navigation stack[5].

Conclusion

MvvmCross simplifies navigation by focusing on ViewModel-to-ViewModel transitions, allowing you to manage your app's flow without directly interacting with Views. This approach enables platform-agnostic navigation logic, making it easier to maintain and extend your application across different platforms.

Citations:
[1] https://www.mvvmcross.com/documentation/fundamentals/navigation
[2] https://www.mvvmcross.com/documentation/tutorials/tipcalc/a-note-about-views-and-viewmodels
[3] https://www.mvvmcross.com/documentation/fundamentals/data-binding
[4] https://www.mvvmcross.com/documentation/tutorials/tipcalc/the-tip-calc-navigation
[5] https://www.damirscorner.com/blog/posts/20140721-RemovingAViewFromBackStackInMvvmCrossForWindowsStoreApps.html
[6] https://www.mvvmcross.com/documentation/advanced/customizing-using-App-and-Setup
[7] https://www.mvvmcross.com/documentation/fundamentals/viewmodel-lifecycle
[8] https://stackoverflow.com/questions/10684174/navigate-to-a-view-without-viewmodel-in-mvvmcross
[9] https://nicksnettravels.builttoroam.com/post-2019-03-24-viewmodel-to-viewmodel-navigation-in-a-xamarinforms-application-with-prism-and-mvvmcross-aspx/
[10] https://www.reddit.com/r/dotnetMAUI/comments/wvdpj2/navigation_mvvm_and_maui/
[11] https://stackoverflow.com/questions/45019264/open-view-without-navigation-in-mvvmcross-xamarin-forms-app/45040352