Search code examples
c#uwpwinui

UWP: Settings buttons to IsEnabled = false triggers a tab-change in the NavigationView

I have a UWP app with a WinUI2.4 NavigationView on my MainPage. There are three pages that are placed in the frame of the navigationview. The second tab navigates to a Page with 3 buttons with a Click-event.

<Button Grid.Row="0" Grid.Column="0" x:Name="lightButton" x:Uid="LightOn" Click="ActivateLight"/>
<Button Grid.Row="0" Grid.Column="1" x:Name="countButton" x:Uid="ShowCount" Click="GetLightCounter"/>
<Button Grid.Row="0" Grid.Column="2" x:Name="resetButton" x:Uid="ResetCount" Click="ResetLightCounter"/>

They perform an async-action. Everything works fine. Except now I want to disable the 3 buttons together when a button is clicked. Only when the async action is finished, they should be re-enabled again.

I wrote a method on my second Page

private void Freeze()
{
    lightButton.IsEnabled = false;
    resetButton.IsEnabled = false;
    countButton.IsEnabled = false;
}

and an accompanying Unfreeze method that should set everything to true again. I call the Freeze method at the beginning of my Event-callbacks en Unfreeze at the end.

The weird and unexpected behavior is that when I click any of the 3 buttons, now that the Freeze method is available, that my NavigationView navigates to the first page. I have no clue why.

What I tested.

  1. Comment everything in Freeze:
private void Freeze()
{
    //lightButton.IsEnabled = false;
    //resetButton.IsEnabled = false;
    //countButton.IsEnabled = false;
}

Then it works again as expected, no navigation to the first page

  1. Set Enable all buttons in Freeze
private void Freeze()
{
    lightButton.IsEnabled = true;
    resetButton.IsEnabled = true;
    countButton.IsEnabled = true;
}

This makes no sense of course, but everything works again as expected - no navigation.

  1. Disable only 1 button
private void Freeze()
{
    lightButton.IsEnabled = false;
    //resetButton.IsEnabled = false;
    //countButton.IsEnabled = false;
}

Everything works as expected.

  1. Throw away bin/ and obj/ folder

The problem persists. So it has to be an error in my code. I have no idea where I should be looking. Has anybody a clue about what I'm missing?

Edit: A complete app to reproduce the issue is here: https://antamista.visualstudio.com/_git/TestAlbumControl?path=%2FTestAlbumControl%2FNavigationViewIsEnabled There is a Readme included.

Solution

  • Based on your sample, I noticed you used SelectionFollowsFocus property. When you set NavigationView.SelectionFollowsFocus to "Enabled", the item selection of your NavigationView will change when keyboard focus changes. It means when you set the IsEnabled of three buttons in the second page as "false", they won't receive the keyboard focus, so the NavigationView will always navigate to the first page.

    You could remove the statement SelectionFollowsFocus="Enabled" or set the SelectionFollowsFocus property to "Disabled". If you still want to enable the SelectionFollowsFocus, you could add another control which is focusable(e.g. TextBox) in the second page. In this case, it won't navigate to the first page when you disable the three buttons.