DEV Community

Cover image for Learn How to Use Dependency Injection in .NET MAUI
Suresh Mohan for Syncfusion, Inc.

Posted on • Originally published at syncfusion.com on

Learn How to Use Dependency Injection in .NET MAUI

As you know, .NET MAUI evolved from Xamarin.Forms with a better developer experience and better performance. Like adding a gem to a crown, .NET MAUI allows the use of dependency injection way easier than Xamarin.Forms.

In this blog, we’ll see how easy it is to use dependency injection in a .NET MAUI application.

What is dependency injection?

Dependency injection is just a way that an object (client) receives other objects (services) that it depends on. Here, injector means the method or code that passes the service object to the client object. Dependency injection is a version of the inversion of control pattern. Here, the service class will inject dependencies into an object at runtime.

Advantages

The main advantage of dependency injection is it reduces coupling between classes and their dependencies.

Our code will become more reusable, testable, and maintainable since we don’t need to know and maintain how the dependencies are implemented.

This makes it more flexible to access the service and client objects.

Using dependency injections in a .NET MAUI app

I have a .NET MAUI app with a MainPage containing a Label and a ViewModel with the LabelText property. Refer to the following code example.

MainPage.xaml

<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="DependencyInjectionInMAUI.MainPage"><Label VerticalTextAlignment="Center" HorizontalTextAlignment="Center" Text="{Binding LabelText}"/>
</ContentPage>
Enter fullscreen mode Exit fullscreen mode

ViewModel.cs

namespace DependencyInjectionInMAUI
{
public class ViewModel
{
public string LabelText { get; set; } = "Hello World";
}
}
Enter fullscreen mode Exit fullscreen mode

Let’s bind the LabelText property to the Label text using dependency injection by following these steps:

Step 1: Open the MauiProgram.cs file. Then, add a Microsoft.Extensions.DependencyInjection reference in it to access the service’s extension methods.

MauiProgram.cs

using Microsoft.Maui;
using Microsoft.Maui.Hosting;
using Microsoft.Maui.Controls.Compatibility;
using Microsoft.Maui.Controls.Hosting;
using Microsoft.Extensions.DependencyInjection;namespace DependencyInjectionInMAUI
{
public static class MauiProgram
{
public static MauiApp CreateMauiApp()
{
var builder = MauiApp.CreateBuilder();
builder
.UseMauiApp<App>()
.ConfigureFonts(fonts =>
{
fonts.AddFont("OpenSans-Regular.ttf", "OpenSansRegular");
});return builder.Build();
}
}
}
Enter fullscreen mode Exit fullscreen mode

Step 2: Then, add the dependency injection singleton service for the MainPage and View model.

MauiProgram.cs

using Microsoft.Maui;
using Microsoft.Maui.Hosting;
using Microsoft.Maui.Controls.Compatibility;
using Microsoft.Maui.Controls.Hosting;
using Microsoft.Extensions.DependencyInjection;namespace DependencyInjectionInMAUI
{
public static class MauiProgram
{
public static MauiApp CreateMauiApp()
{
var builder = MauiApp.CreateBuilder();
builder
.UseMauiApp<App>()
.ConfigureFonts(fonts =>
{
fonts.AddFont("OpenSans-Regular.ttf", "OpenSansRegular");
});builder.Services.AddSingleton<MainPage>();builder.Services.AddSingleton<ViewModel>();
return builder.Build();
}
}
}
Enter fullscreen mode Exit fullscreen mode

Step 3: After successfully adding the necessary services as stated in step 2, you can directly access those objects in your desired class constructors. Therefore, access the MainPage and ViewModel service objects in the App.xaml.cs and MainPage.xaml.cs files respectively by adding arguments in the constructors of these classes.

Appxaml.cs

namespace DependencyInjectionInMAUI
{
public partial class App : Application
{
public App(MainPage mainPage)
{
InitializeComponent();MainPage = new MainPage();
}
}
}
Enter fullscreen mode Exit fullscreen mode

MainPage.xaml.cs

namespace DependencyInjectionInMAUI
{
public partial class MainPage : ContentPage
{
public MainPage( ViewModel viewModel)
{
InitializeComponent();
}}
}
Enter fullscreen mode Exit fullscreen mode

Step 4: Now, get the service objects from the constructor argument and assign them to the client objects like in the following code.

Appxaml.cs

namespace DependencyInjectionInMAUI
{
public partial class App : Application
{
public App(MainPage mainPage)
{
InitializeComponent();MainPage = mainPage;
}
}
}
Enter fullscreen mode Exit fullscreen mode

MainPage.xaml.cs

namespace DependencyInjectionInMAUI
{
public partial class MainPage : ContentPage
{
public MainPage( ViewModel viewModel)
{
InitializeComponent();this.BindingContext = viewModel;
}}
}
Enter fullscreen mode Exit fullscreen mode

That’s it. Now, run the program and see the result.

Object binding using Dependency Injection

Object Binding Using Dependency Injection

GitHub reference

For more details, refer to the complete example for dependency injection in a .NET MAUI application on GitHub.

Conclusion

Thanks for reading! We hope you have learned how easy it is to work on a .NET MAUI app with the dependency injection technique. This makes our code easily reusable, testable, and maintainable. You can also use dependency injection in .NET MAUI apps that contain Syncfusion .NET MAUI controls. Every quarter we deliver more .NET MAUI controls to replace our existing Xamarin.Forms controls, so you can use them once you migrate to .NET MAUI projects.

If you have any feedback, special requirements, or controls that you’d like to see in our .NET MAUI suite, please mention them in the comments section below.

You can also contact us through our support forum, support portal, or feedback portal. We are always happy to assist you!

Related blogs

Top comments (0)