[0.20] TextView is behind another Panel, but click on Panel gives focus to TextView

Bug Reports
1

Title says it all.

If you look at this screenshot, clicking on the “Edited At” panel should unfocus the TextView (as it’s on top of it), just like it does when I click the top bar. That’s what happened on 0.12. However, in 0.12, the click on the “Edited At” panel is also registered by the TextView, so it keeps focus (and I can trigger a Select, Copy, or Paste, just like I would if I were clicking directly).

file
owu2o4P0F0Hi-legacy-files-KWK9iLZyZMh0sgJL-5lNf6PK3FHFLzjxzjdU9Q5dO.png1080×1920

2

Hi there! If you could provide some (minimal) UX code that reproduces the problem that would be even better for debugging. Thanks in advance!

3

What does your UX code look like for that layout? If I try to reproduce it it works as expected, consider this example:

<App>

    <ClientPanel>

        <DockPanel>
            <Panel Height="48" Color="#0fc" Dock="Top" />
            <TextView Dock="Fill" Margin="8" />
            <Panel Dock="Bottom" Color="#0fc" >
                <Text Value="Edited at 19:50" Margin="10" />
            </Panel>
        </DockPanel>

    </ClientPanel>

</App>
4

EDIT: I removed my previous code in favor of this fully contained app to reproduce:

<App>
<DockPanel>
<Panel ux:Name="Notes">
    <Grid Rows="auto, 1*, auto">
      <Rectangle Row="0" Height="56" Fill="White">
        <DropShadow Angle="90" Distance="2" Size="4" Spread="0.01" Color="#00000044" />
      </Rectangle>

      <Rectangle Row="2" Height="56" Fill="White">
        <Text TextColor="#959492" FontSize="11" TextAlignment="Center" Alignment="Center" Value="Edited At 21:12"></Text>
        <DropShadow Angle="270" Distance="1" Size="2" Spread="0.01" Color="#00000022" />
        <Tapped>
          <DebugAction Message="OK" />
        </Tapped>
      </Rectangle>

      <Panel Row="1" Background="White">
        <Text TextColor="#959492" FontSize="19" Alignment="TopLeft" Margin="20,31,0,0" Value="Title"></Text>
        <TextView ux:Name="Note" TextColor="#323232" FontSize="16" Alignment="TopLeft" Margin="20,69,0,0" Value="Your text…" Width="90%" Height="200">
        </TextView>
      </Panel>
    </Grid>

    <AddingAnimation>
      <Move RelativeTo="Size" Y="1" Duration="0.6" />
      <Scale Factor="0.1" Duration="0.3" />
    </AddingAnimation>
</Panel>
<!-- for keyboard -->
<WhileKeyboardVisible>
  <BottomBarBackground Dock="Bottom" />
</WhileKeyboardVisible>
</DockPanel>
</App>

So I suspect foul play between the Grid and the WhileKeyboardVisible

5

You have set Height="200" on your <TextView/> which makes it take up to much space in the grid. Try removing it and see if that helps. :slight_smile:

6

Well this “solves” the problem for this specific case, but not really makes the bug go away. If you put a colored background on the Row 1, you will see that it’s definitely painted behind the Row 2 at all times, but when you click on Row 2, it is caught by Row 1’s TextView.

Thanks anyway! That’s actually what I ended up doing in production.