fuselibs rendering problems with TextInput in GraphicsView, in NativeViewHost on Android

rendering problems with TextInput in GraphicsView, in NativeViewHost on Android

Open eksperts opened this issue 7 years ago • 3 comments

Fuse 1.4.0 build 14778, macOS.

Affected: Android preview and build Not affected: iOS

Tested on a Nexus 5 with Android 6. Should be tested on some newer devices with 7 and 8 too.

Repro:

<App>
    <DockPanel>
        <StatusBarBackground Dock="Top" Background="#18f" />
        <BottomBarBackground Dock="Bottom" />
        <NativeViewHost>
            <Panel>
                <GraphicsView Background="#f81">
                    <StackPanel ItemSpacing="4" Margin="8">
                        <TextInput Height="56" PlaceholderText="Test one">
                            <Rectangle Color="#fff" StrokeWidth="2" StrokeColor="#000" />
                        </TextInput>
                        <TextInput Height="56" PlaceholderText="Test two">
                            <Rectangle Color="#fff" StrokeWidth="2" StrokeColor="#000" />
                        </TextInput>
                    </StackPanel>
                </GraphicsView>
            </Panel>
        </NativeViewHost>
    </DockPanel>
</App>

The TextInputs behave very oddly on Android in this setup. As an example, when I focus either of the two inputs, I'm getting rendering issues like this:

When unfocusing either input by clicking outside of them, they just disappear altogether (but I can still click on them).

There seem to be more issues around the rendering in more complex hierarchies, as reported on community - the value and placeholder text of a TextInput that has focus is travelling outside of the parent bounds without being clipped, while the inputs without focus are clipped just fine.