How to group with an icon and text

[Spencer Bosley]

Hello,

I am working to convert normal xamarin listviews to sflistviews.

The problem that I am having is that I am unable to group the same way that I did before.

Part of the Xaml for what I have tried is below.

        <syncfusion:SfListView 

            AbsoluteLayout.LayoutBounds="0.0, 0.0, 1.0, 1.0"

                     AbsoluteLayout.LayoutFlags="All"

                     x:Name="todayListView" Style="{StaticResource ListViewStyle}"

                     VerticalOptions="FillAndExpand"

                     SelectedItem="{Binding SelectedItem}" ItemsSource="{Binding Items}"

                     ItemTemplate="{StaticResource dataTemplate}"

                        AutoFitMode="DynamicHeight">

            <syncfusion:SfListView.GroupHeaderTemplate>

                <DataTemplate>

                    <ViewCell>

                        <ViewCell.View>

                            <StackLayout BackgroundColor="{StaticResource SecondaryBackgroundColor}">

                                <StackLayout Orientation="Horizontal" VerticalOptions="CenterAndExpand" Padding="10,10,10,5">

                                    <app:CustomImage Source="{Binding Icon}" TintColor="{Binding TextColor}"  VerticalOptions="Center" HeightRequest="20" />

                                    <Label Text="{Binding Title}" Style="{StaticResource SecondaryCaptionStyle}" VerticalOptions="Center" TextColor="{Binding TextColor}" />

                                </StackLayout>

                                <BoxView Style="{StaticResource BoxviewSeperator}" />

                            </StackLayout>

                        </ViewCell.View>

                    </ViewCell>

                </DataTemplate>

            </syncfusion:SfListView.GroupHeaderTemplate>

Items is an observablecollections that contains lists of each grouping of items. Each list has its own icon, textcolor, and title (for each groups heading). Inside the lists are the items that correspond to that group.

Any help would be appreciated. Thank you.

[SaiGanesh Sakthivel]

Hi Spencer, 

 

Thank you for using syncfusion products. 

 

#Regarding How to group the item in SfListview 

We would like to inform you that we have already documentation about ‘How to group the item in SfListview’ in our user guidance document. Please refer to the following UG Documentation for your reference. 

 

UG: https://help.syncfusion.com/xamarin/listview/grouping?cs-save-lang=1&cs-lang=csharp#grouping-based-on-first-character 

 

We hope this helps. Please let us know if you need any further assistance.  

  

Regards,  

SaiGanesh Sakthivel