RefreshView not triggering group header converter

[Giorgi Dalakishvili]

I have a listview (SfListView version: 16.4.0.53) bound to a list of objects. The listview is grouped by one of the properties and I am using a converter to show summary information in group header. When the user clicks one of the buttons I update the datasource and call ListView.RefreshView(). The converter for the item binding is getting called but the converter of the group header isn't so the header shows out of date information.

Can you fix the issue?

[Gnana Priya Namasivayam]

Hi Giorgi, 

 

 

Thanks for using Syncfusion support. 

 

We have checked the reported query from our side. We have prepared the sample as mentioned grouped based on one of property and we simply suggest to that you can display summary (if it is count of items means) in group header by binding directly `Count` property because Group Header will have its GroupResult as its BindingContext from the GroupResult you can display Key, Count, IsExpand…In our sample, we have updated data at runtime which updates in Group Header summary accordingly. We have attached the sample for your reference, please find the sample from below. 

 

Sample Link : http://www.syncfusion.com/downloads/support/directtrac/143005/ze/Grouping-1430051631181478   

 

Can you please check with the above sample whether it meets your requirement. 

 

If you are trying to display other than summary of items(other than count) in group header, can you please share the code snippet you have used in converter and group header template to display the details in group header view. So that we can under your requirement and provide the better solution at our end. 

 

Regards, 

Gnana Priya N 

[Giorgi Dalakishvili]

This is how my group header template looks like:

        <xForms:SfListView.GroupHeaderTemplate>

          <DataTemplate>

            <ViewCell>

              <ViewCell.View>

                <StackLayout Orientation="Horizontal">

                  <Label Text="{Binding Key}" TextColor="White" FontSize="{x:OnIdiom Phone=Medium, Tablet=Large, Default=Medium}" FontAttributes="Bold" VerticalOptions="Center" HorizontalOptions="Start" />

                  <Label Text="{Binding Items, Converter={StaticResource HeaderDurationConverter}}" MinimumWidthRequest="60" TextColor="White" FontSize="{x:OnIdiom Phone=Medium, Tablet=Large, Default=Medium}"

                                                                                                    FontAttributes="Bold" VerticalOptions="Center" HorizontalOptions="End" />

                  <Image Source="{Binding Items, Converter={StaticResource HeaderIconConverter}}" VerticalOptions="Center">

                  </Image>

                </StackLayout>

              </ViewCell.View>

            </ViewCell>

          </DataTemplate>

        </xForms:SfListView.GroupHeaderTemplate>

When I call ListView.RefreshView() the image is not changed.

[Deivaselvan Y]

Hi Giorgi, 

 

We have checked the shared code snippet from our side. If your requirement is to change the icon in group header template then you can bind `IsExpand` bool property which return image from converter based on Expand, Collapse state of the group like below. We have attached the sample for your reference, please refer the sample from below. 

 

Sample Link : http://www.syncfusion.com/downloads/support/forum/143005/ze/GroupHeader-1060530022  

 

Xaml 

 

<syncfusion:SfListView AllowGroupExpandCollapse="True" 

                      ItemsSource="{Binding contactsinfo}"> 

                <syncfusion:SfListView.GroupHeaderTemplate> 

                    <DataTemplate> 

                        <Grid > 

                            <Grid.ColumnDefinitions> 

                                <Image Source="{Binding IsExpand, Converter={StaticResource BoolToImageConverter}}"/> 

                            </StackLayout> 

                        </Grid> 

                    </DataTemplate> 

                </syncfusion:SfListView.GroupHeaderTemplate> 

</syncfusion:SfListView> 

 

Converter 

 

  public class BoolToImageConverter : IValueConverter 

    { 

        public object Convert(object value, Type targetType, object parameter, CultureInfo culture) 

        { 

            if ((bool)value) 

            { 

                return ImageSource.FromResource("SfListViewSample.Images.GroupExpand.png"); 

            } 

            else 

            { 

                return ImageSource.FromResource("SfListViewSample.Images.GroupCollapse.png"); 

            } 

        } 

 

        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture) 

        { 

            throw new NotImplementedException(); 

        } 

    } 

 

To know more about group header customization, you can also refer our documentation link below. 

 

UG Link : https://help.syncfusion.com/xamarin/sflistview/grouping?cs-save-lang=1&cs-lang=xaml#group-header-customization  

 

Please let us know if you have any further queries. 

 

Regards, 

Deivaselvan 

[Giorgi Dalakishvili]

I am not trying to show expand/collapse image. I just need to set image based on the Items in the group that's why I am passing Items collection to the converter.

[Deivaselvan Y]

Hi Giorgi,  

  

You can set items in the converter to handle what you need to do in the group like below. We have attached the sample for your reference, please refer the sample from below.  

  

Sample Link :  http://www.syncfusion.com/downloads/support/directtrac/general/ze/Grouping1125190706 

 

Xaml  

  

<syncfusion:SfListView AllowGroupExpandCollapse="True" ItemsSource="{Binding contactsinfo}">  

   <syncfusion:SfListView.GroupHeaderTemplate> 

                    <DataTemplate> 

                        <Grid BackgroundColor="#E4E4E4"> 

                            <Grid.ColumnDefinitions> 

                                <ColumnDefinition Width="*"/> 

                                <ColumnDefinition Width="*"/> 

                            </Grid.ColumnDefinitions> 

                            <StackLayout Orientation="Horizontal" HorizontalOptions="Start" VerticalOptions="Center" Padding="10,0,0,0"> 

                                <Label Text="{Binding Key}" TextColor="Black" FontSize="Medium"/> 

                            </StackLayout> 

                            <StackLayout Orientation="Horizontal" Grid.Column="1" Padding="0,0,20,0" 

                                              HorizontalOptions="EndAndExpand" VerticalOptions="Center"> 

                                <Label Text="{Binding Count}" TextColor="Black" FontSize="Medium"/> 

                                <Label Text="Item(s)" TextColor="Black" FontSize="Medium"/> 

                                <Image Source="{Binding Items, Converter={StaticResource BoolToImageConverter}}" HeightRequest="50" WidthRequest="100"/> 

                            </StackLayout> 

                        </Grid> 

                    </DataTemplate> 

                </syncfusion:SfListView.GroupHeaderTemplate>  

</syncfusion:SfListView>  

  

Converter  

  

public class BoolToImageConverter : IValueConverter 

    { 

        public object Convert(object value, Type targetType, object parameter, CultureInfo culture) 

        { 

            var image = ImageSource.FromResource("SfListViewSample.Images.GroupExpand.png"); 

            var items = value as IEnumerable; 

            if (items != null) 

            { 

                var groupitems = items.ToList<object>().ToList<object>(); 

 

                if (groupitems != null) 

                { 

                    for (int i = 0; i < groupitems.Count; i++) 

                    { 

                        var contact = groupitems[i] as Contacts; 

                        if (contact.ContactName == "Kenny") 

                            image = ImageSource.FromResource("SfListViewSample.Images.new.jpg"); 

                    } 

                } 

            } 

 

            return image; 

        } 

 

        public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture) 

        { 

            throw new NotImplementedException(); 

        } 

    } 

  

Please let us know if you have any further queries.  

  

Regards,  

Deivaselvan 

[Giorgi Dalakishvili]

That's what I am doing but when I update any item the group header image doesn't change even if I call RefreshView on the listview.

[Deivaselvan Y]

Hi Giorgi,

 

We have ensured to update the item name and add the new item in run time, But unfortunately the reported issue is not reproduced in our end. So, you can revert us with the modified sample, and provide the below details. 

 

1.      Which platforms do you faced this issue? 

2.      Which version of Xamarin forms do you have used in your sample. 

3.      Reproduce the issue in below sample. It is also used your xaml template. 

 

Sample Link - http://www.syncfusion.com/downloads/support/directtrac/general/ze/Grouping1550727979 

 

Please let us know if you have any further queries. 

 

Regards, 

Deivaselvan