BUG: AppBarButton click doesn't trigger focus loss on previously focused inputs

// EDIT: initially this was a proposal and it unfolded into a bug. To get the full context please read all comments

Proposal: NumberBox NumberChanged event

Summary

There is currently no way to get value updates from a NumberBox just-in-time as the user types (like you can with a TextBox.TexChanged event).

Rationale

Given the summary above, this forces developers to make workarounds to certain scenarios. Example scenario: We want to input a value and save the value to a file

• Given a form with a NumberBox having a Value={x:Bind MyProp, Mode=2way} and ValueChanged="OnValChanged"
• Given a Button with Click="OnClick" which passes MyProp to a method
• When I input a number in the NumberBox, and directly after that I click the Button
• The OnClick triggers before the NumberBox change is picked up, thus passing an outdated value around.

In the case of a TextBox this annoying behavior can be worked around by having a TextChanged event handler which always updates MyProp just-in-time to be ready for being passed to the method invoked by OnClick In the case of a NumberBox, there’s no way to work around this, other than redesigning the UI to have a modal which collects the NumberBox value, and then passes it to the called to be used.

Scope

Capability	Priority
Just-in-time NumberBox value changes	Must

[ccornici]

I wonder if @ranjeshj saw you tagging him above @chingucoding 😄

[chingucoding]

In the repo above, in MainPage.xaml, if I remove the ValueChanged=“NumberBox_ValueChanged”, the only way that MainPageViewModel.Amount will be updated now is through the x:Bind present in the xaml.

Given the above, I would expect that when I click the Button (not AppBarButton, which apparently has problems), the Amount is first updated since the NumberBox lost focus, and only then the Click event fires. But the opposite happens. The Click triggers first and the binding update triggers after.

Is this by design?

I think it is, but I am not really sure when bindings get evaluated. It may be a bug, but I think it’s more based on the way bindings work in XAML. But again I am not sure on that.

I tried setting focus on pretty much all elements in that XAML and it doesn’t work. Then I tried unsetting focus on the NumBox and it throws an exception as follows:

Hmm, it seems that setting the focus inside the event handler only raises ValueChanged after it finished the handler it is in. There are two possible workarounds for your situation now I think:

1. Set flag (e.g. ClickedSendAppBar) inside AppBarButton click function, and change focus. Inside ValueChanged check for that flag and if it is set, do what you would like to do, in the example app send money.
2. You can find the textbox manually in the UIA tree. For that you could use the following code:

public MainPage()
{
    this.InitializeComponent();
    var NumBoxFirstChild = VisualTreeHelper.GetChild(Numbox, 0);

    Loaded += MainPage_Loaded;
}

private void MainPage_Loaded(object sender, RoutedEventArgs e)
{
    var numBoxRootGrid = VisualTreeHelper.GetChild(Numbox,0);
    // If you set header, it's 1, otherwise on initial load it is 0
    var inputBox = VisualTreeHelper.GetChild(numBoxRootGrid, 0) as TextBox;
    if(inputBox == null)
    {
        inputBox = VisualTreeHelper.GetChild(numBoxRootGrid, 1) as TextBox;
    }
    inputBox.TextChanged += InputBox_TextChanged;
}

private void InputBox_TextChanged(object sender, TextChangedEventArgs e)
{
    Debug.WriteLine($"Value changed to {(sender as TextBox).Text}");
}