How to add busy page in .NET MAUI

In this article, I will share with you guys how to implement a busy page when fetching data from APIs.

1. Install Nuget Package: <PackageReference Include="Mopups" Version="1.0.4" />

2. Create a folder named "Busy" or whatever you want.

3. Create a Content page named "BusyPage" in that folder, then add following code below

4. Create a ServiceHelper class that helps to get instance of a service.

5. Create a class named "BusyUI.cs" to display the busy page in the app. This class has 2 methods SetBusy and ClearBusy, that helps you set or clear busy page easily.

6. Register Mopup Nuget: builder.Services.AddSingleton(MopupService.Instance)

7. Usage: you can use BusyUI.SetBusy() and BusyUI.ClearBusy() wherever such as ViewModel, Content Page, etc,... in the .NET MAUI app.

Hence, use this way to prevent users from thinking the app is frozen or avoid them getting frustrated or confused when the app seems unresponsive during processing.

See the result below: