Streamlining MVVM in .NET MAUI with Relay Commands

Thomas McDonnell - Oct 11 - - Dev Community

Understanding Relay Commands in .NET MAUI

.NET MAUI simplifies the development of cross-platform apps with a modern, consistent API. One of the features that enhances the Model-View-ViewModel (MVVM) pattern in .NET MAUI is the use of relay commands. These commands help to bind user actions on the view to methods defined in the ViewModel.

What are Relay Commands?

Relay commands are a type of ICommand implementation that allows you to bind the UI events to commands in your ViewModel, eliminating the need for event handlers and making your code cleaner and more maintainable. They are particularly useful in MVVM applications where you want to keep a strict separation of concerns between the view and the ViewModel.

How Relay Commands Work

The RelayCommand attribute can be used to annotate methods in a partial class, which will automatically generate the necessary command properties. For example:

C#

[RelayCommand]
private void GreetUser()
{
    Console.WriteLine("Hello!");
}
Enter fullscreen mode Exit fullscreen mode

This will generate a command property in your ViewModel that you can bind to from your view.

Command Parameters and Asynchronous Commands

Relay commands can also work with parameters and asynchronous methods. When a method has a parameter, the generated command will be of type IRelayCommand<T>, where T is the type of the parameter1For asynchronous methods, the command will implement IAsyncRelayCommand or IAsyncRelayCommand<T> if it has a parameter.

The Prism Approach

Prism is a well-known framework for building loosely coupled, maintainable, and testable applications in WPF, Xamarin Forms, and now in .NET MAUI. It provides developers with a robust set of tools to implement the MVVM pattern, including DelegateCommand and CompositeCommand for handling commands within the ViewModel. However, this approach often requires a considerable amount of boilerplate code, which can be cumbersome and increase the complexity of the application.

How .NET MAUI’s MVVM Toolkit Reduces Code

The .NET MAUI MVVM approach, powered by the Microsoft MVVM Toolkit, simplifies command implementation through the use of relay commands. This reduces the need for the verbose code that is typically associated with the Prism approach. Here’s how:

  • Less Boilerplate: Relay commands require less boilerplate code than Prism’s DelegateCommand, as they don’t need explicit implementation of CanExecute and Execute methods.
  • No Event Handlers: Relay commands eliminate the need for event handlers in the code-behind, which are often required in Prism to invoke commands.
  • Simplified Command Execution: The execution of commands is more straightforward with relay commands, as they allow direct method calls within the ViewModel.

Example: Simplified Command Implementation

Here’s a side-by-side comparison of a command implementation using Prism and .NET MAUI’s relay commands:

C#

// Prism approach
public class MyViewModel : BindableBase
{
    private DelegateCommand _myCommand;
    public DelegateCommand MyCommand =>
        _myCommand ?? (_myCommand = new DelegateCommand(ExecuteCommand, CanExecuteCommand));

    private void ExecuteCommand() { /* Command logic */ }
    private bool CanExecuteCommand() { /* CanExecute logic */ }
}

// .NET MAUI's relay command approach
public partial class MyViewModel
{
    [RelayCommand]
    private void MyCommand()
    {
        // Command logic here
    }
}
Enter fullscreen mode Exit fullscreen mode

As demonstrated, the .NET MAUI approach results in a more concise and readable ViewModel.

The Microsoft MVVM Toolkit Framework

The Microsoft MVVM Toolkit framework is a set of tools that simplifies the implementation of the MVVM pattern in .NET applications. It provides developers with a robust foundation for building responsive, maintainable, and testable applicationsThe toolkit includes features like ObservableObjectRelayCommand, and AsyncRelayCommand, which are essential for creating a clean and efficient ViewModel.

How .NET MAUI Adopts the MVVM Toolkit

.NET MAUI’s MVVM approach is heavily influenced by the Microsoft MVVM Toolkit framework. It leverages the toolkit’s features to streamline the development process and reduce the boilerplate code typically associated with MVVM applications. This allows developers to focus more on the business logic rather than the intricacies of the MVVM implementation.

For example, the RelayCommand attribute in .NET MAUI is a direct adoption from the MVVM Toolkit. It automatically generates command properties, thus removing the need for manual implementation of ICommand properties and the associated CanExecute and Execute methods.

Benefits of Using the MVVM Toolkit in .NET MAUI

By incorporating the Microsoft MVVM Toolkit framework, .NET MAUI offers several advantages:

  • Simplified ViewModel: The use of source generators and attributes provided by the MVVM Toolkit reduces the complexity of the ViewModel.
  • Enhanced Maintainability: With less code to manage, the ViewModel becomes easier to maintain and evolve over time.
  • Improved Testability: The separation of concerns is more pronounced, making it easier to write unit tests for the ViewModel and Model.
  • Streamlined Development: Developers can quickly scaffold new features without worrying about the underlying command infrastructure.

Conclusion

The adoption of the Microsoft MVVM Toolkit’s relay commands in .NET MAUI has taken the complexity out of the MVVM pattern. By reducing the amount of code required for command implementation, developers can enjoy a more streamlined development experience, allowing them to focus on creating feature-rich and responsive applications.

. . . . .