通过Xamarin.Forms中JSON上的组件对ListView进行分组

Question

我正在尝试对ListView中JSON中的项进行分组。

我的JSON存储在一个web存储库中，我已经从服务器上提取了它并列出了它，但没有分组。

我读了很多关于如何对C#列表进行分组的教程，但都没有解决我的问题。

这是JSON:

[
{
"status": "Status 1",
"erpCode": "1901",
"name": "Name 1",
"statusReportDate": "24/08/2018",
"statusReportDescription": "Description 1"
},
{
"status": "Status 2",
"erpCode": "2160",
"name": "Name 2",
"statusReportDate": "24/08/2018",
"statusReportDescription": "Description 2"
},
{
"status": "Status 2",
"erpCode": "543",
"name": "Name 3",
"statusReportDate": "24/08/2018",
"statusReportDescription": "Description 3"
}
]

我的方法是从web存储库中提取JSON并将其转换为List和ObservableCollection：

protected async void OnGetList()
{
if (CrossConnectivity.Current.IsConnected)
{
try
{
//Getting JSON data from the Web
var content = await _client.GetStringAsync(Url);
//We deserialize the JSON data from this line
var list = JsonConvert.DeserializeObject<List<Company>>(content);
//After deserializing , we store our data in the List called ObservableCollection
ObservableCollection<Company> collection = new ObservableCollection<Company>(list);
myList.ItemsSource = collection;
}
catch (Exception ey)
{
Debug.WriteLine("" + ey);
}
}
}

XAML列表视图：

<ListView x:Name="myList" 
HasUnevenRows="True" 
ItemSelected="MyList_ItemSelected">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<StackLayout Orientation="Horizontal" Margin="5" HorizontalOptions="Fill">
<Button Text="{Binding erpCode}"/>
<StackLayout HorizontalOptions="Fill">
<Grid>
<Label Text="{Binding name}"/>
<Label Text="{Binding statusReportDate}"/>
</Grid>
<Label Text="{Binding statusReportDescription}"/>
</StackLayout>
</StackLayout>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>

我想按"状态"对其进行分组，并打印如下内容：

状态1

名称1

状态2

名称2

名称3

状态N

名称n1

名称n2

名称n3

Answer 1

查看本文：https://xamarinhelp.com/xamarin-forms-listview-grouping/

但是最好使用ObservableCollection，上面的文章使用List。

因此，您必须创建一个类型为ObservableCollection的子类的ObservableCollection。

首先创建一个ObservableCollection子类的类型，该类型将按状态包含一组公司：

public class CompanyByStatusList : ObservableCollection<Company>
{
public string Status { get; set; }
public ObservableCollection<Company> Companies => this;
}

然后创建CompanyByStatusList的ObservableCollection。这将是ListView的项目来源。

public ObservableCollection<CompanyByStatusList> CompanyList { get; set; }

然后，您需要为每个状态创建一个CompanyByStatusList，其中包含处于该特定状态的所有公司，然后将这些CompanyByStatusList中的每一个添加到CompanyList集合中。确保设置每个CompanyByStatusList的Status属性

并确保在ListView上设置IsGroupingEnabled="true"。ListView xaml:

<ListView ItemsSource="{Binding CompanyList}"
IsGroupingEnabled="true" 
HasUnevenRows="true">
<ListView.GroupHeaderTemplate>
<DataTemplate>
<ViewCell>
<Label Text="{Binding Status}" />
</ViewCell>
</DataTemplate>
</ListView.GroupHeaderTemplate>
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<StackLayout Orientation="Horizontal" Margin="5" HorizontalOptions="Fill">
<Button Text="{Binding erpCode}"/>
<StackLayout HorizontalOptions="Fill">
<StackLayout Orientation="Horizontal">
<Label Text="{Binding name}"/>
<Label Text="{Binding statusReportDate}"/>
</StackLayout>
<Label Text="{Binding statusReportDescription}"/>
</StackLayout>
</StackLayout>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>