Как создать таблицу с вертикально закрепленным заголовком и горизонтально закрепленным первым столбцом с помощью Xamarin Forms?

При отображении табличных данных я думаю, что в некоторых случаях наличие всегда видимой строки заголовка и всегда видимого первого столбца действительно может улучшить читаемость и общее удобство использования таблицы, особенно если в таблице много данных. Проблема возникает, когда таблица должна поддерживать как горизонтальную, так и вертикальную прокрутку. Хороший пример такой таблицы можно найти в приложении NBA при просмотре очков в прошлой игре. Вот пример изображения из приложения NBA для Android: Пример таблицы из мобильного приложения NBA

Как вы можете ясно видеть из изображения, строка заголовка выровнена по горизонтали с фактическими данными таблицы, а первый столбец выровнен по вертикали с данными таблицы. Я не знаю, является ли это непроизвольным или добровольным решением предотвратить прокрутку как по горизонтали, так и по вертикали одним движением касания, но это мелкая деталь, которая меня не волнует.

Я не знаю, как это реализовать с помощью Xamarin Forms. Я не интересуюсь закрытым исходным кодом / платным решением, так как я действительно хотел бы узнать, как это сделать самостоятельно. Я понимаю, что мне, скорее всего, придется использовать собственные средства визуализации как для Android, так и для IOS. Моя текущая идея заключается в том, что у меня есть абсолютный макет, в котором есть следующие элементы:

• Первая ячейка (она стационарная и единственная стационарная)
• Остальная часть строки заголовка внутри горизонтальной прокрутки
• Первый столбец внутри listview / stacklayout + вертикальная прокрутка
• Фактические данные таблицы внутри списка + горизонтальная прокрутка / stacklayout + горизонтальная и вертикальная прокрутка

С помощью этой настройки я бы захватил событие касания и отправил его в другие списки / прокрутки, таким образом синхронизируя прокрутку. Фактически, я могу легко добиться синхронизированной прокрутки с первым столбцом и фактическими данными таблицы, установив данные таблицы внутри того же вертикального прокрутки, что и первый столбец. Но я не знаю, как синхронизировать горизонтальную прокрутку со строкой заголовка, и я считаю, что это не может быть достигнуто с помощью продуманной компонентной структуры. До сих пор я тестировал только на Android, что могу зафиксировать событие касания в методе OnTouchEvent настраиваемого средства визуализации scrollview, но я не знаю, как отправить его в строку заголовка scrollview из настраиваемого средства визуализации.

Вот черновик XAML, иллюстрирующий мой подход.

<AbsoluteLayout xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             HorizontalOptions="FillAndExpand">
    <ScrollView
        Orientation="Horizontal"
        x:Name="HeaderScrollView"
        AbsoluteLayout.LayoutBounds="0,0,1,1"
        AbsoluteLayout.LayoutFlags="All">
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="200" />
                <ColumnDefinition Width="100" />
                <ColumnDefinition Width="100" />
                <ColumnDefinition Width="100" />
                <ColumnDefinition Width="100" />
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="50" />
            </Grid.RowDefinitions>
            <!-- Skip first column, leave it empty for stationary cell -->
            <Label Text="Column 1" Grid.Row="0" Grid.Column="1" />
            <Label Text="Column 2" Grid.Row="0" Grid.Column="2" />
            <Label Text="Column 3" Grid.Row="0" Grid.Column="3" />
            <Label Text="Column 4" Grid.Row="0" Grid.Column="4" />
        </Grid>
    </ScrollView>
    <ScrollView
        x:Name="FirstColumnScrollView"
        Orientation="Vertical"
        AbsoluteLayout.LayoutBounds="0,50,1,1"
        AbsoluteLayout.LayoutFlags="SizeProportional"
        BackgroundColor="Aqua">
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="200" />
                <ColumnDefinition Width="*" />
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>
            <StackLayout
                Grid.Column="0"
                Grid.Row="0"
                BindableLayout.ItemsSource="{Binding DataSource}">
                <BindableLayout.ItemTemplate>
                    <DataTemplate>
                        <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="50" />
                            </Grid.RowDefinitions>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="150" />
                            </Grid.ColumnDefinitions>
                            <Label Text="{Binding Column1}" Grid.Row="0" Grid.Column="0" />
                        </Grid>
                    </DataTemplate>
                </BindableLayout.ItemTemplate>
            </StackLayout>
            <ScrollView
                x:Name="TableDataScrollView"
                Grid.Column="1"
                Grid.Row="0"
                Orientation="Horizontal">
                <StackLayout
                    BindableLayout.ItemsSource="{Binding DataSource}">
                    <BindableLayout.ItemTemplate>
                        <DataTemplate>
                            <Grid>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="100" />
                                    <ColumnDefinition Width="100" />
                                    <ColumnDefinition Width="100" />
                                    <ColumnDefinition Width="100" />
                                </Grid.ColumnDefinitions>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="50" />
                                </Grid.RowDefinitions>
                                <Label Text="{Binding Column2}" Grid.Row="0" Grid.Column="0" />
                                <Label Text="{Binding Column3}" Grid.Row="0" Grid.Column="1" />
                                <Label Text="{Binding Column4}" Grid.Row="0" Grid.Column="2" />
                                <Label Text="{Binding Column5}" Grid.Row="0" Grid.Column="3" />
                            </Grid>
                        </DataTemplate>
                    </BindableLayout.ItemTemplate>
                </StackLayout>
            </ScrollView>
        </Grid>
    </ScrollView>
    <Label Text="First Column" BackgroundColor="White" AbsoluteLayout.LayoutBounds="0,0,200,50" />
</AbsoluteLayout>

Как видите, проблема в том, что события горизонтальной прокрутки между HeaderScrollView и TableDataScrollView не используются совместно, и я не знаю, как это сделать наилучшим образом или вообще.

Я ценю всю помощь и отзывы по этому поводу!