C# Xamarin Forms Listview 将 BindingContext 设置为嵌套列表

Question

我在Xamarin Form有一个经典的ListView ，我正在尝试绑定它的内容。 我来自我们使用CollectionViewSource UWP，这里的情况有点不同。

XAML

<StackLayout>
        <ListView x:Name="listView" 
                ItemsSource="{Binding Monkeys}" 
                Header="{Binding Intro}"
                Footer="{Binding Summary}">
            <ListView.HeaderTemplate >
                <DataTemplate>
                    <StackLayout Orientation="Horizontal" 
                        Padding="10,5,5,10"
                        BackgroundColor="Yellow">
                        <Label Text="~~"/>
                        <Label Text="{Binding .}"/>
                        <Label Text="~~"/>
                    </StackLayout>
                </DataTemplate>
            </ListView.HeaderTemplate>
            <ListView.ItemTemplate>
                <DataTemplate>
                    <TextCell Text="{Binding Name}" Detail="{Binding Description}"></TextCell>
                </DataTemplate>
            </ListView.ItemTemplate>
        </ListView>
    </StackLayout>

后台代码

var results = new List<Matches> {
                new Matches {Name="Xander", Description="Writer"},
                new Matches {Name="Rupert", Description="Engineer"},
                new Matches {Name="Tammy", Description="Designer"},
                new Matches {Name="Blue", Description="Speaker"},
            };
            var header = new List<Titles> { new Titles { Monkeys = results, Intro = "This is a big header", Summary = "This is the end" } };
            header.Add(new Titles { Monkeys = results, Intro = "Shift", Summary = "Yeah" } );
            //BindingContext = header;
            BindingContext = new Titles { Monkeys = results, Intro = "This is a big header", Summary = "This is the end"};

class Matches
    {
        public string Name { get; set; }
        public string Description { get; set; }
    }
    class Titles
    {
        public List<Matches> Monkeys { get; set; }
        public string Intro { get; set; }
        public string Summary { get; set; }
    }

正如您在注释掉的行上看到的那样，它不绑定列表，因此被注释掉了 :) 知道是否可以将其内容与具有多个标题和项目的嵌套列表绑定？ 我在这里做错了什么？

Answer 1

根据你的数据，我认为你应该显示一个组数据列表。 您可以尝试以下代码：

班级比赛

public class Matches
{
    public string Name { get; set; }
    public string Description { get; set; }
}

班级名称

public class Titles : ObservableCollection<Matches>
{
    //public List<Matches> Monkeys { get; set; }
    public string Intro { get; set; }
    public string Summary { get; set; }

    public Titles(List<Matches> list):base(list)
    {
    }
}

类 MainPage

public partial class MainPage : ContentPage
{
    public ObservableCollection<Titles> sortedItems { get; set; }

    public ObservableCollection<Matches> items { get; set; }

    public MainPage()
    {
        InitializeComponent();
        listView.ItemsSource = getData();
    }


    public List<Titles> getData() {

        items = new ObservableCollection<Matches> {
            new Matches {Name="Xander", Description="Writer"},
            new Matches {Name="Rupert", Description="Engineer"},
            new Matches {Name="Tammy", Description="Designer"},
            new Matches {Name="Blue", Description="Speaker"},
        };


        List<Titles> sortedItems = new List<Titles>() {
            new Titles(items.ToList()){ Intro = "This is a big header", Summary = "This is the end" },
            new Titles(items.ToList()){ Intro = "Shift", Summary = "Yeah" },
            new Titles(items.ToList()){ Intro = "This is a big header", Summary = "This is the end" },
        };

        return sortedItems;
    }
}

主页.xaml

   <StackLayout>
    <ListView
            HasUnevenRows="True"
            x:Name="listView" 
            IsGroupingEnabled = "True">
        <ListView.GroupHeaderTemplate >
            <DataTemplate>
                <ViewCell Height="40">
                    <StackLayout Orientation="Horizontal"
                             BackgroundColor="#3498DB"
                             VerticalOptions="FillAndExpand">
                        <Label Text="{Binding Intro}"
                           VerticalOptions="Center" />
                        <Label Text="   "/>
                        <Label Text="{Binding Summary}"
                           VerticalOptions="Center" />

                    </StackLayout>
                </ViewCell>
            </DataTemplate>
        </ListView.GroupHeaderTemplate>

        <ListView.ItemTemplate>
            <DataTemplate>
                <TextCell Text="{Binding Name}" Detail="{Binding Description}"></TextCell>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
</StackLayout>

效果如下：

笔记：

按照我的理解，你是想在每个组List的位置显示这两个字段，对吗？ 那么ListView.GroupHeaderTemplate就可以满足我们的需要了。你可以根据需要自定义ListView.GroupHeaderTemplate的布局，这样你就可以同时显示Intro和Summary 。