我正在寻找一种实现看起来像 ListView with 2 columns 的控件的好方法,其中每列具有不同的高度 . 因为我没有't found another solution, I'决定通过 Repeater control来做 .

预期的结果是这样的:
screenshot

  • 所有项目都来自 same DataSource ,此数据源将包含一到十几个项目 .

  • 必须将项目拆分 automatically (按模数)分成2列

  • 当用户单击与项目相关的按钮时,将打开项目的详细信息页面

  • 红色方块是 images that must have the same height/width

我正在设计单元格 DataTemplate ,但我没有看到如何管理图像:

  • 2列之间的区别由包含2列的Grid给出

  • 然后我为每列指定DataTemplate

<ScrollView>
    <Grid Padding="10">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="2*" />
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>
        <!-- Col.1 -->
        <tabletControls:Repeater  Grid.Column="0" Margin="10"
                                  ItemsSource="{Binding ListProductItems}">
            <tabletControls:Repeater.ItemTemplate>
                <DataTemplate>
                    <ViewCell>
                        <StackLayout Orientation="Vertical" >
                            <StackLayout>
                                <ffimageloading:CachedImage Source="{Binding Icon}" 
                                                  Aspect="AspectFill"/>
                            </StackLayout>
                            ...
                        </StackLayout>
                    </ViewCell>
                </DataTemplate>
            </tabletControls:Repeater.ItemTemplate>
        </tabletControls:Repeater>

        <!-- Col.2 -->
        <tabletControls:Repeater  Grid.Column="1" Margin="10"
                                  ItemsSource="{Binding ListProductItems}">
            <tabletControls:Repeater.ItemTemplate>
                <DataTemplate>
                    <ViewCell>
                        <StackLayout Orientation="Vertical" >
                            <StackLayout>
                                <ffimageloading:CachedImage Source="{Binding Icon}" 
                                                  Aspect="AspectFill"/>
                            </StackLayout>
                            ...
                        </StackLayout>
                    </ViewCell>
                </DataTemplate>
            </tabletControls:Repeater.ItemTemplate>
        </tabletControls:Repeater>
    </Grid>
</ScrollView

但这不能按预期工作,因为图像的高度/宽度不一样:

result

我已经尝试使用Aspect(AspectFill,AspectFit,Fill)或VerticalOptions / HorizontalOptions,任何结果......

Is it possible to achieve the expected result without specify an HeightRequest? Are there other options?