[Bug] Grid In DataTemplate allocates too much space on Android and iOS

[solomonfried]

Description

I have an app with a CollectionView using a DataTemplate. The DataTemplate contains a Grid with 2 rows. The top row is a narrow header. Within the top bar is another Grid with 2 rows. On UWP it displays as I would expect. On iOS and Android the cell in the CollectionView expands to at least twice what it would need. The Header is still narrow but the background of the Cell shows beneath the second row (see screenshots below)

The right side uses the same DataTemplate but the 2 row grid used in the headed to display the 2 lines (Hobby. Golfing) is replaced with a Label with a carriage return. A StackView also works.

On UWP both DataTemplates show a very similar layout.

Steps to Reproduce

1. Run attached project. Using a CollectionView with a DataTemplate like

   <DataTemplate x:Key="ListItemTemplateBad">
           <Grid RowSpacing="0" HorizontalOptions="FillAndExpand" BackgroundColor="DeepSkyBlue" x:DataType="controlsTest:ListInfo" >
               <Grid.RowDefinitions>
                   <RowDefinition Height="Auto"  />
                   <RowDefinition Height="Auto" />
               </Grid.RowDefinitions>
               <Grid Grid.Row="0" BackgroundColor="DarkSeaGreen" HorizontalOptions="FillAndExpand"  >
                   <Grid.ColumnDefinitions>
                       <ColumnDefinition Width="*" />
                       <ColumnDefinition Width="Auto" />
                   </Grid.ColumnDefinitions>
                   <Grid.RowDefinitions>
                       <RowDefinition Height="Auto" />
                   </Grid.RowDefinitions>
                   <Label Grid.Column="0" Text="{Binding Name}" TextColor="Black" FontSize="18" VerticalOptions="Center" 
                          Margin='5,5,0,5' />
   
                <!--- THIS GRID IS CAUSING THE CELL TO GROW IS !!!! --->
                   <Grid Grid.Row="0" Grid.Column="1" RowSpacing="0" Margin="0,0,5,0" 
                         HorizontalOptions="End"
                         VerticalOptions="Start" >
                       <Grid.RowDefinitions>
                           <RowDefinition Height="Auto" />
                           <RowDefinition Height="Auto" />
                       </Grid.RowDefinitions>
                       <Label Text="Hobby" FontSize="10" HorizontalOptions="End" />
                       <Label Grid.Row="1"  FontSize="12" 
                              Text="{Binding Hobby}" HorizontalOptions="End" />
                   </Grid>
                   <!--- USE THIS INSTEAD AND THE SIZING IS CORRECT !!
                   <Label Grid.Row="0" Grid.Column="1" HorizontalOptions="End">
                       <Label.FormattedText>
                           <FormattedString>
                               <Span Text="Hobby" />
                               <Span Text="{x:Static x:Environment.NewLine}" />
                               <Span Text="{Binding Hobby}" />
                           </FormattedString>
                       </Label.FormattedText>
                   </Label>
                   --->
               </Grid>
               <Grid Grid.Row="1" BackgroundColor="DarkOrange" HorizontalOptions="FillAndExpand"  >
                   <Label Text="{Binding Description}" TextColor="Black" FontSize="16" VerticalOptions="Center" />
               </Grid>
           </Grid>
       </DataTemplate>

Expected Behavior

CollectionView Items should not be larger than the Layout requests

Actual Behavior

CollectionView Items are too large

Basic Information

• Version with issue: Xamarin 4.8.0.1687
• Last known good version:
• Platform Target Frameworks:
  • iOS:
  • Android: 10
  • UWP: 16299 - 18362
• NuGet Packages:
• Affected Devices:

Environment

1. VS2019 16.8.2

Screenshots

Android & iOS. DataTemplate on left with 2 row grid in top row of item (showing "Hobby","golfing") Same CollectionView on right, using a Label in place of a Grid. The Blue in the items is extra space in each CollectionView item. (default background color of a cell)

Same app on UWP

Reproduction Link

DataTemplateIssue.zip

Workaround

Replaced Grid in DataTemplate with a Label or StackView

[mterwoord]

It seems this is a problem starting with 4.8.0.1451. This really is a big issue for complexer layouts.