如何在Xamarin.Forms中将列表绑定到ListView？

Question

我在页面上有一个 ListView，其 ItemSource 是 List<AssetModel>，如下所示：

public class AssetModel
{
    public string AssetId { get; set; }
    public string Description { get; set; }

    public List<TaskDetail> TaskDetailList { get; set; }
}

public class TaskDetail
{
    public string Description { get; set; }
}

我该如何将TaskDetail列表绑定到父列表中？

期望的布局：

- Neelam Prajapati

---

这取决于您想如何展示数据。您能分享一下您期望的演示布局吗？ - Diego Rafael Souza

@DiegoRafaelSouza，请检查我上传的图片。 - Neelam Prajapati

看起来你有一个嵌套的列表视图。因此，你需要将你嵌套的列表视图的ItemSource设置为"TaskDetailList"。 - VahidShir

Answer 1

看起来像是一个典型的分组列表视图用例。 詹姆斯·蒙特马格诺写了一篇关于这种需求的文章，应该会对你有很大帮助。

总的来说，分组功能需要一个类型为“列表的列表”(IEnumerable<IEnumerable<>>)的对象，其中每个“主项”都是一个“细节项”的列表。

为了使它更容易，您可以使用上述文章提供的类：

public class Grouping<K, T> : ObservableCollection<T>
{
    public K Key { get; private set; }

    public Grouping(K key, IEnumerable<T> items)
    {
        Key = key;
        foreach (var item in items)
            this.Items.Add(item);
    }
}

那么，您必须将列表属性更改为以下类型：

ObservableCollection<Grouping<AssetModel, TaskDetail>> AssetsList { get; set; } = 
    new ObservableCollection<Grouping<AssetModel, TaskDetail>>();

< p >这个AssetsList是你应该绑定到ListView的ItemsSource属性上的。

要填充这个属性，你需要做如下操作，例如：

for (int i = 0; i < 5; i++)
{
    var asset = new AssetModel();
    asset.AssetId = new Guid().ToString();
    asset.Description = $"Asset { i + 1} ";
    asset.TaskDetailList = new List<TaskDetail>();

    for (int j = 0; j < 3; j++)
        asset.TaskDetailList.Add(new TaskDetail() { Description = $"Detail { (i + 1) } - { (j + 1) }" });

    var group = new Grouping<AssetModel, TaskDetail>(asset, asset.TaskDetailList);

    AssetsList.Add(group);
}

然后，在你的 XAML 中定义 ListView 的分组属性：

<ListView ItemsSource="{Binding AssetsList}" 
          HasUnevenRows="True" 
          SeparatorVisibility="None"
          SeparatorColor="Transparent"
          IsGroupingEnabled="True">
    <ListView.GroupHeaderTemplate>
        <DataTemplate>
            <ViewCell>
                <StackLayout>
                    <StackLayout Orientation="Horizontal">
                        <Label Text="AssetId"
                               FontAttributes="Bold"/>
                        <Label Text={Binding Key.AssetId}/>
                    </StackLayout>
                    <StackLayout Orientation="Horizontal">
                        <Label Text="Description"
                               FontAttributes="Bold"/>
                        <Label Text={Binding Key.Description}/>
                    </StackLayout>
                </StackLayout>
            </ViewCell>
        </DataTemplate>
    </ListView.GroupHeaderTemplate>
    <ListView.ItemTemplate>
        <DataTemplate>
            <ViewCell>
                <StackLayout>
                    <Label Text={Binding Description}/>
                </StackLayout>
            </ViewCell>
        </DataTemplate>
    </ListView.ItemTemplate>
</ListView>

- Diego Rafael Souza

---

非常好，非常感谢您宝贵的时间为我深入解释。对我帮助很大，再次感谢。 - Neelam Prajapati

@diego 如果我们有一个更深层次的嵌套listview怎么办？我的意思是在item模板中有一个listview。 - Abhinav

@AbhinavRastogi 我不认为嵌套ListView是一个好主意。其他人也同意这一点。这样做是不被鼓励的，主要是因为滚动事件处理问题，与ScrollView中的ListView（请参见注释）相同。也许你可以搜索/创建一个自定义视图，只使用一个滚动处理程序来处理内部集合。 - Diego Rafael Souza