如何在 Xamarin.Forms 中的 ListView 中绑定列表 [英] How to bind list inside ListView in Xamarin.Forms

问题描述

我的页面上有一个 ListView，其 ItemSource 为 List，如下所示:

I have one ListView on my page having ItemSource as List<AssetModel> as shown below:

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 列表?

How can I bind TaskDetail list in my parent list?

所需的布局:

推荐答案

这似乎是一个经典的分组列表视图用例.James Montemagno 写了一篇关于这种需求的文章，应该会对您有很大帮助.

It seems like a classic grouping listview use case. James Montemagno wrote an article about this kind of need that should help you a lot.

总而言之，分组功能需要一个List of List"类型的对象(IEnumerable)，其中每个主项"都是一个详细项"的列表'.

In summary, the grouping feature expects an object of type 'List of List' (IEnumerable<IEnumerable<>>), where each 'master item' is a list of 'detail item'.

为方便起见，您可以使用上述文章中提供的类:

To make it easy, you can use the class provided at the above mentioned article:

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);
    }
}

然后，您必须将列表属性的类型更改为，例如:

Then, the list property you must change its type to, for example, this:

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

这个AssetsList是你应该绑定到ListView

This AssetsList is what you should bind to the ItemsSource of ListView

要填充此属性，您需要执行以下操作:

To fill this property, you'll need, for example, do this:

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 分组属性:

Then in your XAML you define your ListView Grouping properties:

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

这篇关于如何在 Xamarin.Forms 中的 ListView 中绑定列表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！