I have a big list of objects retrieved through parsing a JSON file. Right now I'm binding said list to a ListView
but the list is unwieldy and I wanted to divide it in separate groups for an ease of use. I tried following several different guides but I'm unable to prepare my data in the correct way.
My grouping model:
public class SortedItem
{
public string Header { get; set; }
public List<Item> Items { get; set; }
public SortedItem(string header)
{
Header = header;
}
}
My object model:
public class Item
{
public string item { get; set; }
//public int icon { get; set; }
private string ico;
public string icon
{
get { return ico; }
set { ico = "Icons/" + value + ".png"; }
}
public int id { get; set; }
public string slot { get; set; }
public string scrip { get; set; }
public Reduce reduce { get; set; }
public int lvl { get; set; }
public string zone { get; set; }
public int time { get; set; }
}
Right now my XAML is as follows:
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="Eorzea_Gatherer.Pages.NodesPage"
xmlns:ios="clr-namespace:Xamarin.Forms.PlatformConfiguration.iOSSpecific;assembly=Xamarin.Forms.Core"
ios:Page.UseSafeArea="true"
BackgroundColor="#F4F4F4">
<!--https://xamarinhelp.com/safeareainsets-xamarin-forms-ios/-->
<ListView x:Name="nodesListView"
IsGroupingEnabled="True"
GroupDisplayBinding="{Binding Header}"
HasUnevenRows="True"
BackgroundColor="#F4F4F4"
Margin="30, 30, 30, 0">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<Grid Padding="0, 5">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="60"/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Image Source="{Binding icon}"
HeightRequest="50"
WidthRequest="50"
Grid.Column="0"/>
<StackLayout Grid.Column="1">
<Label Text="{Binding item}"
TextColor="#171717"
FontSize="13"
FontFamily="SegoeUI"/>
<!--https://forums.xamarin.com/discussion/97996/binding-more-than-one-property-in-listview-->
<Label TextColor="#171717"
FontSize="12"
FontFamily="SegoeUI">
<Label.FormattedText>
<FormattedString>
<Span Text="{Binding zone}"/>
<Span Text=" - "/>
<Span Text="{Binding slot}"/>
</FormattedString>
</Label.FormattedText>
</Label>
<Label TextColor="#171717"
FontSize="12"
FontFamily="SegoeUI">
<Label.FormattedText>
<FormattedString>
<Span Text="{Binding time}"/>
<Span Text=" - "/>
<Span Text="00:00 AM"/>
</FormattedString>
</Label.FormattedText>
</Label>
</StackLayout>
</Grid>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
The function I'm using to bind a source to the ListView
:
public static List<SortedItem> GetSortedItems()
{
List<Item> items = GetItems();
List<SortedItem> sortedItems = new List<SortedItem>()
{
new SortedItem("50")
{
Items = items.Where(x => x.lvl == 50).ToList()
},
new SortedItem("55"),
new SortedItem("60"),
new SortedItem("65"),
new SortedItem("70")
};
return sortedItems;
}
With my code I'm able to see the different groups in my ListView
(50, 55, ...) but nothing else pops out. I'm sure my issue is taking my objects list and splitting it in an appropriate way but I'm stumped. What puzzles me is during debugging when hovering on the resulting sortedItems
I get to see my first group does contain the objects it needs to but they still don't show up in the view.