TextInput/TextEdit does not loose focus with DirectNavigation

Bug Reports
1

When navigating between Pages in a DirectNavigation, I would expect a different behavior when interacting with on-screen keyboard. In the video you’ll see two distinct ways the UI reacts to NavigateTo event, while the only thing that changed was a Panel being clicked vs. a Button.

This has to do with how and when a TextInput looses its Focus, and, for one, it seems to be inconsistent. For two, it should probably just hide the keyboard (and release that space) when navigating between Pages.

Video: https://www.youtube.com/watch?v=GoKJselbCuI

Code to test with:

<App Theme="Basic" Background="#666688ff">
    <ClientPanel>
        <DirectNavigation Active="page1" />

        <Page ux:Name="page1">
            <EnteringAnimation>
                <Move X="1" RelativeTo="ParentSize" />
            </EnteringAnimation>
            <ExitingAnimation>
                <Move X="-1" RelativeTo="ParentSize" />
            </ExitingAnimation>
            <DockPanel>
                <Panel Dock="Top" Height="100">
                    <!--Button Text="Click me!" Width="200" Height="50">
                        <Clicked>
                            <NavigateTo Target="page2" />
                        </Clicked>
                    </Button-->
                    <Panel HitTestMode="LocalBounds" Background="#aaa" Width="200" Height="50">
                        <Text Alignment="Center">Click me!</Text>
                        <Clicked>
                            <NavigateTo Target="page2" />
                        </Clicked>
                    </Panel>
                </Panel>
            </DockPanel>
        </Page>

        <Page ux:Name="page2">
            <EnteringAnimation>
                <Move X="1" RelativeTo="ParentSize" />
            </EnteringAnimation>
            <ExitingAnimation>
                <Move X="-1" RelativeTo="ParentSize" />
            </ExitingAnimation>
            <DockPanel>
                <Panel Dock="Top" Height="100">
                    <!--Button Text="Go Back" Width="200" Height="50">
                        <Clicked>
                            <NavigateTo Target="page1" />
                        </Clicked>
                    </Button-->
                    <Panel HitTestMode="LocalBounds" Background="#aaa" Width="200" Height="50">
                        <Text Alignment="Center">Go back</Text>
                        <Clicked>
                            <NavigateTo Target="page1" />
                        </Clicked>
                    </Panel>
                </Panel>

                <ScrollView>
                    <StackPanel>
                        <Panel Height="100" Background="#aaa">
                            <Text>scrollview contents 1</Text>
                        </Panel>
                        <Panel Height="100" Background="#bbb">
                            <Text>scrollview contents 2</Text>
                        </Panel>
                        <Panel Height="100" Background="#aaa">
                            <Text>scrollview contents 3</Text>
                        </Panel>
                        <Panel Height="100" Background="#bbb">
                            <Text>scrollview contents 4</Text>
                        </Panel>
                        <Panel Height="100" Background="#aaa">
                            <Text>scrollview contents 5</Text>
                        </Panel>
                        <Panel Height="100" Background="#bbb">
                            <Text>scrollview contents 6</Text>
                        </Panel>
                        <Panel  Height="100" Background="#aaa" ux:Name="last">
                            <Text>scrollview contents 7</Text>
                        </Panel>
                    </StackPanel>
                </ScrollView>

                <Panel Dock="Bottom" Height="100">
                    <Panel>
                        <TextInput Value="text" Background="#999" Height="50">
                            <WhileFocused>
                                <BringIntoView TargetNode="last" />
                            </WhileFocused>
                        </TextInput>
                    </Panel>
                </Panel>
            </DockPanel>
        </Page>

    </ClientPanel>
</App>
2

The behaviour difference has to do with Button being marked as IsFocusable="true" and your custom Panel not marked that way. When the node tree for a pointer event works with Focus somehow, like the button, the focus is not automatically released from other controls. This is to provide that control the chance to decide what happens. In this case though the button just doesn nothing to the focus, thus leaves the keyboard open.

We’re discussion what the standard behaviours should be here. Releasing focus on page navigation seems like a good default, even if no control has explicitly released the focus. But perhaps a button press on its own should also clear focus (as it tends to in other environments).

I’m unable to reproduce the second part of your issue, where the scrollbar space isn’t returned. There has been some work done in this are recently, so it might have been fixed. I tested on an iPhone5s.

3

Thanks for the reply! As for reproducing the second part of the issue, I noticed it more frequently when I entered something in the TextInput, then switched to page one and then back to page two. With the TextInput left empty, it usually didn’t happen. Tested on iPhone 6.