How can I adjust height of ever row of a grid in BindableLayout to fit the content's height?

Question

I'm working on a cross platform app on both iOS and Android.
Now I want to display some searched result in a big grid, every cell can be clicked. There should be 3 results in every row, and every cell in a same row should has a same height with a shadow frame. Every result may have a different height.

Here is a image demonstrated what I want (just like Excel):

Firstly, I tried to use a BindableLayout Grid, which has an indexed item list. Every item has a Row and a Col property to fill into a cell. But the Grid's height is different. Here is the xaml.

<ContentPage.BindingContext>
    <mvvm:GridViewModel />
</ContentPage.BindingContext>
<ContentPage.Content>
    <StackLayout Margin="5,50,5,0" >
        <Label Text="Result:" />
        <ScrollView x:Name="scrollViewResult" VerticalOptions="StartAndExpand">
            <Grid BindableLayout.ItemsSource="{Binding GridResult}" ColumnDefinitions="*,*,*" RowDefinitions="Auto" VerticalOptions="StartAndExpand">
                <BindableLayout.ItemTemplate>
                    <DataTemplate>
                        <!-- Every cell is a nested Grid. Using grid is for the purpose of button.-->
                        <Grid x:Name="NestedGrid" Grid.Row="{Binding Row}" Grid.Column="{Binding Col}" RowDefinitions="Auto" ColumnDefinitions="*" >
                            <!-- Frame for the corner radius and shadow.-->
                            <Frame Grid.Row="0" Grid.Column="0" CornerRadius="5" Margin="1">
                                <!-- Label text is real display text.-->
                                <Label Text="{Binding Value}" Margin="-15" FontSize="Small" LineBreakMode="WordWrap" HorizontalOptions="Center" VerticalOptions="StartAndExpand" HorizontalTextAlignment="Center"/>
                            </Frame>
                            <!-- Here placing a hole-cell button for a better click gesture. -->
                            <Button Grid.Row="0" Grid.Column="0" BackgroundColor="Transparent" Clicked="Button_Clicked" Margin="5"/>
                        </Grid>
                    </DataTemplate>
                </BindableLayout.ItemTemplate>
            </Grid>
        </ScrollView>
    </StackLayout>
</ContentPage.Content> 

It likes below. emmmmm, not good (a BindableLayout Grid):

Then, I tried to use nested BindableLayout Grid(only one row) in a BindableLayout StackLayout. Every item in StackLayout is a list, every item in the list has a Col property to fill into a cell. Act a little better but not enough, for some short text will still hold large blank, and some has different height in a row.

<ContentPage.BindingContext>
    <mvvm:GridInGridViewModel />
</ContentPage.BindingContext>
<ContentPage.Content>
    <StackLayout Margin="5,50,5,0" >
        <Label Text="Result:" />
        <ScrollView x:Name="scrollViewResult" VerticalOptions="FillAndExpand">
            <StackLayout BindableLayout.ItemsSource="{Binding GridResult}">
                <BindableLayout.ItemTemplate>
                    <DataTemplate>
                        <!-- Every Grid has one row and 3 columns.-->
                        <Grid x:Name="ARowGrid" Margin="5,5,5,0" ColumnSpacing="5" RowSpacing="15" RowDefinitions="Auto" ColumnDefinitions="30*,30*,30*" BindableLayout.ItemsSource="{Binding Items}">
                            <BindableLayout.ItemTemplate>
                                <DataTemplate>
                                    <!-- Every cell in ARowGrid is a nested Grid. Using grid is for the purpose of button.-->
                                    <Grid x:Name="NestedGrid" Grid.Row="0" Grid.Column="{Binding Col}" RowDefinitions="Auto" ColumnDefinitions="*" >
                                        <!-- Frame for the corner radius and shadow.-->
                                        <Frame Grid.Row="0" Grid.Column="0" CornerRadius="5" Margin="0">
                                            <!-- Label text is real display text.-->
                                            <Label Text="{Binding Value}" Margin="-15" FontSize="Small" LineBreakMode="WordWrap" HorizontalOptions="Center" VerticalOptions="Start" HorizontalTextAlignment="Center"/>
                                        </Frame>
                                        <!-- Here placing a hole-cell button for a better click gesture. -->
                                        <Button Grid.Row="0" Grid.Column="0" BackgroundColor="Transparent" Clicked="Button_Clicked" Margin="5"/>
                                    </Grid>
                                </DataTemplate>
                            </BindableLayout.ItemTemplate>
                        </Grid>
                    </DataTemplate>
                </BindableLayout.ItemTemplate>
            </StackLayout>
        </ScrollView>
    </StackLayout>
</ContentPage.Content>

It acts like this (a BindableLayout Grid in BindableLayout StackLayout):

So is there any way to adjust height of ever row of a grid to fit the content's height, with every cell in a row has the same height, the height is the max height of content(may be add some margin).