Grouping not working in listview

[Mohsen Saad]

I am trying to use this property in listview with grouping 

private ObservableCollection<ModifierGroupInfo> _ModifierList;

public ObservableCollection<ModifierGroupInfo> ModifiersList

{

get { return _ModifierList; }

set { _ModifierList = value; RaisePropertyChanged("ModifiersList"); }

}

and ModifierGroupInfo looks like below code 

public class ModifierGroupInfo 

{

public int id { get; set; }

public int limit { get; set; }

List<ProductModifierData>  modifiers { get; set;}

public int type { get; set; }

public object key { get; set; }

}

and my XAML code looks like the below 

<StackLayout Orientation="Vertical" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" Grid.Row="1">

<syncfusion:SfListView 

x:Name="ModifierslistView" 

IsStickyGroupHeader="True"

GroupHeaderSize="60" 

AllowGroupExpandCollapse="True"

ItemsSource="{Binding ModifiersList}"

ItemSpacing="0,0,5,0"

ItemSize="70">

<syncfusion:SfListView.DataSource>

<dataSource:DataSource>

<dataSource:DataSource.GroupDescriptors>

<dataSource:GroupDescriptor PropertyName="Key" />

</dataSource:DataSource.GroupDescriptors>

</dataSource:DataSource>

</syncfusion:SfListView.DataSource>

<syncfusion:SfListView.GroupHeaderTemplate>

<DataTemplate>

<ViewCell>

<ViewCell.View>

<Grid BackgroundColor="Red">

<Label Text="{Binding Key}" BackgroundColor = "Black" TextColor="#6e7275" VerticalOptions="Center" FontSize="40" HorizontalOptions="Start" FontAttributes="Bold" />

</Grid>

</ViewCell.View>

</ViewCell>

</DataTemplate>

</syncfusion:SfListView.GroupHeaderTemplate>

<syncfusion:SfListView.ItemTemplate>

<DataTemplate>

<ViewCell>

<ViewCell.View>

<StackLayout Orientation="Horizontal">

<StackLayout.GestureRecognizers>

<TapGestureRecognizer Tapped="OnModifierTapped" NumberOfTapsRequired="1" CommandParameter={Binding .}" />

</StackLayout.GestureRecognizers>

<controls:SVGImage Aspect="AspectFit" HorizontalOptions="Center" VerticalOptions="Center" Style="{StaticResource SmallIconStyle}" SVGPath="{Binding selectedModifier, Converter={StaticResource ModifierSelectionConverter}}" />

<Label Margin="0,10,0,0" Text="{Binding Name}" />

<Label Margin="0,10,0,0" HorizontalOptions="EndAndExpand" TextColor="{Binding includedModifier, Converter={StaticResource IncludedModifierSelectionColorConverter},ConverterParameter=#2fae44}" Text="{Binding includedModifier, Converter={StaticResource IncludedModifierSelectionConverter}}" />

</StackLayout>

</ViewCell.View>

</ViewCell>

</DataTemplate>

</syncfusion:SfListView.ItemTemplate>

<syncfusion:SfListView.LayoutManager>

<syncfusion:GridLayout SpanCount="2" />

</syncfusion:SfListView.LayoutManager>

</syncfusion:SfListView>

Is something wrong with this code, and how grouping is working if I have groups and each group contains list of data?

[Muthu Kumaran Gnanavinayagam]

Hi Mohsen, 

 

Thank you for contacting Syncfusion Support. 

 

We have checked the reported query “Need to group SfListView items” from our side. We have referred the attached code example and found that you have set the ‘Key’ value instead of Model ‘key’ to GroupDescriptor’s PropertyName. We would like to inform you that the Grouping in SfListView is based on the name of the property defined in the PropertyName of GroupDescriptor. 

 

For your assistance, we have attached the working sample and you can download it from the below location. 

 

Sample link: http://www.syncfusion.com/downloads/support/directtrac/196628/ze/SfListViewSample1632030417 

 

Please refer the below documentation link to know more details regarding Grouping of SfListView items. 

 

UG link: https://help.syncfusion.com/xamarin/sflistview/grouping 

 

Please let us know if you require further assistance. 

 

Regards, 

G.Muthu kumaran.