How does a toolbar button know to await?

Question

If I have this...

<ContentPage.ToolbarItems>
    <ToolbarItem  Text = "Done" Clicked="Done_Clicked" />
    <ToolbarItem Text = "Cancel" Clicked="Cancel_Clicked" Priority="1" />
</ContentPage.ToolbarItems>

In the code behind...

async void Cancel_Clicked(object sender, EventArgs e)
{
    await Navigation.PopModalAsync();
}

How does the tool bar item know that its handler is asynchronous?

Thowk · Answer 1 · 2017-10-20T21:14:56.050

2

Cancel_Clicked handler returns void so your toolbar item (UI Thread) can't know if your method is asynchronous.

Edit:
Inner method PopModalAsync() will run asynchronously - it will finish work in some time in the future. Cancel_Clicked() will return immediately, and for UI thread it is synchronous operation.

edited Oct 20 '17 at 21:14

answered Oct 20 '17 at 12:20

Thowk

386
4
15

So, it's called synchronously? – Ian Warburton Oct 20 '17 at 12:21
1

That should give you some view: https://stackoverflow.com/questions/37419572/if-async-await-doesnt-create-any-additional-threads-then-how-does-it-make-appl – Thowk Oct 20 '17 at 12:33
I don't see the relevance. – Ian Warburton Oct 20 '17 at 15:43
I've added an additional comment. Also there are a lot of docs about how async/await work in details. – Thowk Oct 20 '17 at 21:20

Scott Chamberlain · Accepted Answer · 2017-10-20T22:02:41.930

It doesn't, you need to use a 3rd party library that provides async commands. Personally I like Nito.Mvvm.Async, it gives you a AsyncCommand you can use and bind your functions to. The button will be disabled while the async function runs and will re-enable once the function is complete.

<ContentPage.ToolbarItems>
    <ToolbarItem Text = "Done" Command="{Binding DoneCommand}" />
    <ToolbarItem Text = "Cancel" Command="{Binding CancelCommand}" Priority="1" />
</ContentPage.ToolbarItems>

in your view moodel.

public MyViewModel()
{
    CancelCommand = new AsyncCommand(ExecuteCancel);
}

public AsyncCommand CancelCommand {get;}

async Task ExecuteCancel()
{
    await Navigation.PopModalAsync();
}

Here is a more complex version that disables the cancel option unless the Done option is currently running.

<ContentPage.ToolbarItems>
    <ToolbarItem Text = "Done" Command="{Binding DoneCommand}" />
    <ToolbarItem Text = "Cancel" Command="{Binding CancelCommand}" Priority="1" />
</ContentPage.ToolbarItems>

in your view moodel.

    public MyViewModel()
    {
        DoneCommand = new AsyncCommand(ExecuteDone);
        CancelCommand = new CustomAsyncCommand(ExecuteCancel, CanExecuteCancel);
        PropertyChangedEventManager.AddHandler(DoneCommand, (sender, e) => CancelCommand.OnCanExecuteChanged(), nameof(DoneCommand.IsExecuting));
        PropertyChangedEventManager.AddHandler(CancelCommand, (sender, e) => CancelCommand.OnCanExecuteChanged(), nameof(CancelCommand.IsExecuting));
    }

    private bool CanExecuteCancel()
    {
        return DoneCommand.IsExecuting && !CancelCommand.IsExecuting;
    }

    public AsyncCommand DoneCommand { get; }
    public CustomAsyncCommand CancelCommand { get; }

    async Task ExecuteDone()
    {
        await ... //Do stuff

    }

    async Task ExecuteCancel()
    {
        await Navigation.PopModalAsync();
    }

How does a toolbar button know to await?

2 Answers2

Linked