Xamarin.forms: [Bug] Material Visual applied to a Frame breaks the Item Selection for ListViews

[aspnetde]

Description

When using aFrame containing a (more or less) complex layout for aViewCell along with the Material Visual, the item selection works not "on" those elements contained in the layout within the cell. iOS only.

Steps to Reproduce

1. Apply the Material Visual to the whole page
2. Add a ListView and a ViewCell containing StackView's or a Grid (I didn't check with other components)
3. Run the thing on iOS 12.2
4. Selecting a cell is only possible by touching parts that are not contained in the frame itself. Touching "on the contents" of the cell does nothing.

Sample:

<ListView x:Name="_list" SeparatorVisibility="None" RowHeight="120">
    <ListView.ItemTemplate>
        <DataTemplate>
            <ViewCell>
                <Frame Margin="15, 15, 15, 5">
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="*" />
                            <RowDefinition Height="*" />
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*" />
                            <ColumnDefinition Width="*" />
                        </Grid.ColumnDefinitions>
                        <Label Text="Top Left" Grid.Row="0" Grid.Column="0" />
                        <Label Text="Top Right" Grid.Row="0" Grid.Column="1" />
                        <Label Text="Bottom Left" Grid.Row="1" Grid.Column="0" />
                        <Label Text="Bottom Right" Grid.Row="1" Grid.Column="1" />
                    </Grid>
                </Frame>
            </ViewCell>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

Basic Information

• Version with issue: Forms 3.6.0.293080, Xamarin.Forms.Visual.Material 3.6.0.293080

• Platform Target Frameworks:

• iOS: 12.2

Screenshots

Sample app attached.

Reproduction

See the sample attached.

FrameMaterialBug.zip

[aspnetde]

As a workaround I went with a combination of ItemTapped and a TapGestureRecognizer for the content element of the frame. Not pretty, though.

[aspnetde]

See https://twitter.com/PureWeen/status/1117943832828506112 for a first guess by @PureWeen.

[BuddyLReno]

Would love to see this fixed.

[DeerSteak]

@aspnetde how did you use the TapGestureRecognizer in conjunction with the ListView? Set a Command that basically calls the ItemSelected command, and then use the bound item as the CommandParameter? Just trying to get my brain wrapped around this, and don't want to make something that accidentally fires twice.

[aspnetde]

@DeerSteak See https://gist.github.com/aspnetde/6c82325989b3650795a27fc905c5f899/revisions

[DeerSteak]

@aspnetde thank you!

[MaxenceSAUNIER]

Any news ?

[codercampos]

Something that I have found is that the children of the frame is blocking the ItemTapped gesture. If you put a StackLayout inside the frame and use a padding (20 of thickness), you can tapped in the frame and the event is being called (even you can see the frame being selected with a material animation on the control).

Maybe We should go deep into the Material implementation and see what's wrong (when you add children).

(Saving this for myself later).

[dpuckett]

Any progress on this? It's causing issues being able to use this for production.