有没有办法动态获取 ListView 项的 RowHeight 以用于设置 Grid 列的宽度？

Question

我有一个将 HasUnevenRows 设置为“true”的 ListView。在 ListView.ItemTemplate 我有一个网格，我想动态地将 ColumnDefinition Width 设置为 ListView 项的高度。最终目标是获得一个完美正方形的网格单元格，而不管 Platform 和 ListView 行内容如何。

有没有办法让我获取 ListView 项所在行的当前值并将其设置在 ListView.ItemTemplate 的 ColumnDefinition 中？这是我可以在不使用自定义渲染器的情况下完成的事情吗？

这是一个模拟 XAML，代表我想要实现的目标：

<ListView HasUnevenRows="True">
    <ListView.ItemTemplate>
        <DataTemplate>
            <ViewCell>

                <Grid>
                    <Grid.ColumnDefinitions Width=" LISTVIEW ITEM ROW HEIGHT "/>
                    <Grid.ColumnDefinitions Width="*"/>
                </Grid>

            </ViewCell>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

Answer 1

使用RowHeight属性设置ListView的一行的高度。然后使用 Converter 动态设置网格的宽度。

创建转换器：

 public class MyConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        return value ;
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

Xaml：

  <ContentPage.Resources>
    <ResourceDictionary>
        <local:MyConverter x:Key="MyConverter" />
    </ResourceDictionary>
</ContentPage.Resources>
<ContentPage.Content>
    <ListView
        x:Name="listView"
        BackgroundColor="Green"
        HasUnevenRows="True"
        ItemsSource="{Binding peoples}"
        RowHeight="100">
        <ListView.ItemTemplate>
            <DataTemplate>
                <ViewCell>
                    <Grid BackgroundColor="Accent">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="{Binding Source={x:Reference listView}, Path=RowHeight, Converter={StaticResource MyConverter}}" />
                            <RowDefinition Height="{Binding Source={x:Reference listView}, Path=RowHeight, Converter={StaticResource MyConverter}}" />
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="{Binding Source={x:Reference listView}, Path=RowHeight, Converter={StaticResource MyConverter}}" />
                            <ColumnDefinition Width="*" />
                        </Grid.ColumnDefinitions>

                        <BoxView
                            Grid.Row="0"
                            Grid.Column="0"
                            BackgroundColor="Black" />
                        <BoxView
                            Grid.Row="0"
                            Grid.Column="1"
                            BackgroundColor="Blue" />
                        <BoxView
                            Grid.Row="1"
                            Grid.Column="0"
                            BackgroundColor="Yellow" />
                        <BoxView
                            Grid.Row="1"
                            Grid.Column="1"
                            BackgroundColor="DarkGray" />
                    </Grid>
                </ViewCell>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
</ContentPage.Content>    

我使用BoxView 来表示正方形，不管黑色是哪种颜色。