我正在寻找一种实现看起来像 ListView with 2 columns 的控件的好方法,其中每列具有不同的高度 . 因为我没有't found another solution, I'决定通过 Repeater control来做 .
预期的结果是这样的:
-
所有项目都来自 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
但这不能按预期工作,因为图像的高度/宽度不一样:
我已经尝试使用Aspect(AspectFill,AspectFit,Fill)或VerticalOptions / HorizontalOptions,任何结果......
Is it possible to achieve the expected result without specify an HeightRequest? Are there other options?