2

我有一个详细信息列表(篮子),在每个详细信息中,都有另一个列表(水果)。我想显示这些细节,我首先想到的是 ListView 中的 ListView。但是在查看建议时,给了我这样的结果,主要表明在 Xamarin Forms 中实现不是一个好主意。

目前,我使用 FreshMvvM 作为我的 MvvM 框架。至于我要显示的数据,我有一组篮子,每个篮子都有几个水果。我希望也显示那些属于特定篮子的水果的图像。请参考图片。

在此处输入图像描述

我想知道这个或其他方面是否有改进,关于如何实现我的列表或任何其他方式来实现上述行为的布局的任何其他想法。谢谢你。

到目前为止我的代码:
XAML:

<ListView ItemsSource="{Binding Baskets}" HasUnevenRows="True">
    <ListView.ItemTemplate>
        <DataTemplate>
            <ViewCell>
                <StackLayout>
                    <Label Text="{Binding BasketID}" />
                    <ImageCell 
                        Text="{Binding FruitID}" 
                        Detail="{Binding FruitName}" 
                        ImageSource="{Binding ImageURL}">
                    </ImageCell>
                </StackLayout>
             </ViewCell>
         </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

课程:

public class Basket
{
    public string BasketID{ get; set; }
    public string BasketName{ get; set; }
}

public class Fruit
{
    public string FruitID{ get; set; }
    public string FruitName{ get; set; }
    public string ImageURL{ get; set; }
}
4

1 回答 1

4

您可以使用ListView遍历购物篮集合,同时使用自定义控件ItemsControl来遍历水果集合。

它基本上是一个自定义控件,允许您将动态子支持添加到StackLayout通过ItemsSourceItemTemplate属性。您可以按原样使用该控件 - 除非您需要在此的 StackLayout 上将Orientation属性设置为。Horizontal

样品用法:

<ListView ItemsSource="{Binding Baskets}" HasUnevenRows="True">
    <ListView.ItemTemplate>
        <DataTemplate>
            <ViewCell>
                <StackLayout>
                    <Label Text="{Binding BasketID}" />

                    <local:ItemsControl ItemsSource="{Binding Fruits}">
                        <local:ItemsControl.ItemTemplate>
                            <DataTemplate>
                                <Image Source="{Binding ImageURL}" />
                            </DataTemplate>
                        </local:ItemsControl.ItemTemplate>
                    </local:ItemsControl>
                </StackLayout>
             </ViewCell>
         </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

注意:ItemsControl仅适用于小型集合,因为虚拟化/回收支持不是很复杂。我假设,由于布局是水平的,Fruits集合中的项目数量会相对较少。

于 2017-09-08T05:48:34.717 回答