We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy.
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

Multiple header on ListView Grouping

Thread ID:

Created:

Updated:

Platform:

Replies:

128102 Jan 2,2017 04:35 PM UTC Mar 28,2017 12:00 PM UTC Xamarin.Forms 3
loading
Tags: SfListView
Hello
Asked On January 2, 2017 04:35 PM UTC

Hi,

I have a listview  that i group by two levels. 

Super group 1
    _Group 1
         _item 1_1_0
         _item 1_1_1
    _Group 2
         _item 1_2_0
         _item 1_2_1
Super group 2
    _Group 1
         _item 1_1_0
         _item 1_1_1
    _Group 2
         _item 1_2_0
         _item 1_2_1

and I like to have two different grouping header (for superGroup and group). Is it possible to achieve  it?


Regards,

Dinesh Babu Yadav [Syncfusion]
Replied On January 3, 2017 01:46 PM UTC

Hi Customer, 
 
Thanks for using Syncfusion products. 
 
You can achieve your requirement “Multi-level grouping” by sample level. We need to do some changes in the source level to achieve the mentioned requirement. As this is the forum, we could not update you the patch for this. Hence, we have created an incident for your query  and you can login through the below link using your Direct-Trac credentials. 
 
 
Please let us know if you need any further assistance. 
 
Regards, 
Dinesh Babu Yadav 


Jonathan McComb
Replied On March 27, 2017 06:30 AM UTC

Hello,

Is this now available in a release?

Kind Regards,
Jonathan

Muthu Kumaran Gnanavinayagam [Syncfusion]
Replied On March 28, 2017 12:00 PM UTC

Hi Jonathan, 
 
Thank you for contacting Syncfusion Support. 
 
Yes, we have included the fix to achieve the reported requirement “Multi-level grouping in SfListView” by sample level in our latest service pack release and you can download the same from the below link.  
 
 
And also, for your reference we have prepared the sample which illustrates to achieve the Multi-level grouping with SfListView and you can download it from the below location. 
 
 
In the above sample, we have used the converter to define the left margin of the GroupHeaderTemplate based on the Level of the group by which you can achieve the hierarchical structure like the below code example.    
    
Code example[XAML]:    
<ContentPage.Resources>    
<ResourceDictionary>    
<local:GroupHeaderConvertor x:Key="TemplateConverter"/>    
</ResourceDictionary>    
</ContentPage.Resources>    
    
<listView:SfListView x:Name="listViewItemsSource="{Binding contactsinfo}">    
<listView:SfListView.GroupHeaderTemplate>    
<DataTemplate>    
<ViewCell>    
<ViewCell.View>    
<StackLayout BackgroundColor="#E4E4E4" Margin="{Binding Level,Converter={StaticResource TemplateConverter}}">    
<Label Text="{Binding Key}" FontSize="22" FontAttributes="Bold" VerticalOptions="Center"     
HorizontalOptions="Start" Margin="20,0,0,0" />    
</StackLayout>    
</ViewCell.View>    
</ViewCell>    
</DataTemplate>    
</listView:SfListView.GroupHeaderTemplate>    
  
Code example[C#]:    
public class GroupHeaderConvertor : IValueConverter    
{    
  public object Convert(object value, Type targetType, object parameter, CultureInfo culture)    
  {    
    if ((int)value == 1)    
        return new Thickness(5, 5, 5, 0);    
    else    
        return new Thickness((int)value * 15, 5, 5, 0);    
  }    
    
  public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)    
  {    
    throw new NotImplementedException();    
  }    
}    
  
Please let us know if you require further assistance. 
 
Regards, 
G.Muthu Kumaran. 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

;