Xamarin Forms - 实现嵌套列表

Question

我有一个详细信息列表（篮子），在每个详细信息中都有另一个列表（水果）。我想显示这些细节，我首先想到的是 ListView 中的 ListView。但是在查看建议时，给了我诸如 this and this 之类的结果，这主要表明在 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; }
}

Answer 1

您可以使用 ListView 循环访问篮子集合，同时使用 ItemsControl 等自定义控件循环访问水果集合。

它基本上是一个自定义控件，允许您通过 ItemsSource 和 ItemTemplate 属性向 StackLayout 添加动态子支持。您可以按原样使用该控件 - 除了您需要在 line.

的 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>

Note: ItemsControl is good for usage with only small collections, as the virtualization/recycling support is not very sophisticated. I am assuming, as the layout is horizontal, number of items in Fruits collection will be relatively a low.

Xamarin Forms - 实现嵌套列表

Xamarin Forms - Implementing a nested list

c#

xamarin

mvvm

xamarin.forms

freshmvvm