My team is working on a Maui application which ideally should not perform any activities asynchronously (mainly because we don't want users modifying settings and at the same time running other screens that depend on those settings).

Sometimes we need to show messages or get user input via popups/alerts, this forces us to declare such methods as async since we don't know of any way to show such messages to users synchronously in Maui. As a result we've had multiple scenarios where users click one button and are still able to touch other buttons because the UI is not blocked by the first action.

Any ideas on how to go around this problem?

My team is working on a Maui application which ideally should not perform any activities asynchronously (mainly because we don't want users modifying settings and at the same time running other screens that depend on those settings).

Sometimes we need to show messages or get user input via popups/alerts, this forces us to declare such methods as async since we don't know of any way to show such messages to users synchronously in Maui. As a result we've had multiple scenarios where users click one button and are still able to touch other buttons because the UI is not blocked by the first action.

Any ideas on how to go around this problem?

• asynchronous
• maui

• 1 Well i had the same issue and i have created some variables used as flags until the end of my procedure. if the flag is true (procedure in progress) then the rest of the button are clickable but not functional as the 1st line of code of each button just checks the variable and returns at once. – Isidoros Moulas Commented Mar 29 at 14:46
• You can bind the page's button's IsEnable property to a bool value. And set the value as false before the popup showing, set it as true after the popup disppearing. Or you can refer to this thread: calling-async-method-synchronously. – Liyun Zhang - MSFT Commented Apr 4 at 9:19

1 Answer 1

You could try this:

1. Create a new MAUI project and change the .xaml and .cs files to have this content:

   MainPage.xaml:

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft/winfx/2009/xaml"
             x:Class="MauiApp4.MainPage">

    <ScrollView>
        <VerticalStackLayout
            Padding="30,0"
            Spacing="25">
            <Image
                Source="dotnet_bot.png"
                HeightRequest="185"
                Aspect="AspectFit"
                SemanticProperties.Description="dot net bot in a race car number eight" />

            <Label x:Name="TestLabel"
                Text="Hello, World!"
                Style="{StaticResource Headline}"
                SemanticProperties.HeadingLevel="Level1" />

            <Label
                Text="Welcome to &#10;.NET Multi-platform App UI"
                Style="{StaticResource SubHeadline}"
                SemanticProperties.HeadingLevel="Level2"
                SemanticProperties.Description="Welcome to dot net Multi platform App U I" />

            <Button
                x:Name="CounterBtn"
                Text="Click me" 
                SemanticProperties.Hint="Counts the number of times you click"
                Clicked="OnCounterClicked"
                HorizontalOptions="Fill" />
        </VerticalStackLayout>
    </ScrollView>

</ContentPage>

MainPage.cs:

namespace MauiApp4
{
    public partial class MainPage : ContentPage
    {
        public MainPage()
        {
            InitializeComponent();
        }

        private async void OnCounterClicked(object sender, EventArgs e)
        {
            await NewPage1.Show(this);

            TestLabel.Text = "Hi!";
        }
    }

}

2. Then add a new XAML page, named NewPage1, with this content:

NewPage1.xaml:

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft/dotnet/2021/maui"
             xmlns:x="http://schemas.microsoft/winfx/2009/xaml"
             x:Class="MauiApp4.NewPage1"
             Title="NewPage1">
    <VerticalStackLayout>
        <Label x:Name="TestLabel"
            Text="Welcome to .NET MAUI!"
            VerticalOptions="Center" 
            HorizontalOptions="Center" />

        <Entry x:Name="TestEntry" Placeholder="Enter your name" />
        <Button Text="Click me" Clicked="Button_Clicked" />
    </VerticalStackLayout>
</ContentPage>

NewPage1.cs:

namespace MauiApp4;

public partial class NewPage1 : ContentPage
{
    TaskCompletionSource TaskCompletionSource;

    public NewPage1(TaskCompletionSource cs)
    {
        InitializeComponent();

        TaskCompletionSource = cs;

        TestEntry.Focus();
    }

    private async void Button_Clicked(object sender, EventArgs e)
    {
        TestLabel.Text = TestEntry.Text;

        await Task.Delay(2000);

        await Navigation.PopAsync();

        TaskCompletionSource.TrySetResult();
    }

    static public Task Show(Page page)
    {
        TaskCompletionSource cs = new();

        var newPage = new NewPage1(cs);

        page.Navigation.PushAsync(newPage);

        return cs.Task;
    }
}

3. Do not fet to change namespace, according to your project name.

4. If you want, put a breakpoint in line

TestLabel.Text = "Hi!";

in MainPage.cs to see that is executed after the disappearance of NewPage1, after the push of the button.

5. Run the project. Press the button on the MainPage. NewPage1 will be shown. Type something in the Entry there and press the button. The text of Label will change to that of Entry and after 2 seconds the page will dissapear and the code execution will be continue to the line with the breakpoint.

I hope this help.