Leave certain listview items ungrouped

[Michael]

Hi,

I use your SfListView to display a list of menu items in a shell flyout. In general this works. But I want some items to be grouped and expandable and others not to be grouped at all. How can this be done?

Besides SfListView I also use the Community Toolkit for MVVM support.

Thanks for your help!

Regards

Michael

XAML:

 <Shell.FlyoutContent>
     <syncfusion:SfListView x:Name="menuListView" ItemsSource="{Binding MenuItems}"
                   SelectionMode="Single"
                   AllowGroupExpandCollapse="True"
                   SelectedItem="{Binding SelectedMenuItem, Mode=TwoWay}"
                   SelectionGesture="Tap"
                   SelectionChangedCommand="{Binding SelectionChangedCommand}"
                   SelectionChangedCommandParameter="{Binding SelectedItem, Source={RelativeSource Self}}">
         <syncfusion:SfListView.DataSource>
           <data:DataSource>
               <data:DataSource.GroupDescriptors>
                   <data:GroupDescriptor PropertyName="Category"/>
               </data:DataSource.GroupDescriptors>
           </data:DataSource>
       </syncfusion:SfListView.DataSource>
         <syncfusion:SfListView.GroupHeaderTemplate>
             <DataTemplate>
                 <Label Text="{Binding Key}"
                      BackgroundColor="LightGray"
                      FontSize="18"
                      FontAttributes="Bold" />
             </DataTemplate>
         </syncfusion:SfListView.GroupHeaderTemplate>
         <syncfusion:SfListView.ItemTemplate>
             <DataTemplate x:DataType="menu:MenuItem">
                 <Grid Padding="10">
                     <Image Grid.RowSpan="1"
                          Source="{Binding ImageSource}"
                          Aspect="AspectFill"
                          WidthRequest="40" />
                     <Label Grid.Column="1"
                          Text="{Binding Title}"
                          FontAttributes="Bold" />
                 </Grid>
             </DataTemplate>
         </syncfusion:SfListView.ItemTemplate>
     </syncfusion:SfListView>
 </Shell.FlyoutContent>

ViewModel:

public partial class NavigationViewModel : ObservableObject
{
 
    /// <summary>
    /// Collection of menu entries available in the application.
    /// </summary>
    [ObservableProperty]
    public partial List<MenuItem> MenuItems { get; set; } = [];

    /// <summary>
    /// Create menu structure
    /// </summary>
    private void CreateMenuItems()
    {
        MenuItems =
        [
            new MenuItem { Title = "A", Category = AppResources.MenuItemNew },
            new MenuItem { Title = "B", Category = AppResources.MenuItemNew },
            new MenuItem { Title = "C", Category = AppResources.MenuItemNew },
            new MenuItem { Title = "D", Category = AppResources.MenuItemNew },

            // Leave these items ungrouped !!!!
            new MenuItem { Title = "X" },
            new MenuItem { Title = "Y" },
            new MenuItem { Title = "Z" },
        ];
    }

    // ... removed ....

}

public class MenuItem
{
    public string Category { get; set; }
    public string ImageSource { get; set; }
    public string Title { get; set; }
    public int Id { get; set; }
    public string NavRoute { get; set; }
}

[Muthupandy Ramakrishnan]

Hi Michael,

Thank you for your interest in using grouping in SfListView.

Currently, grouping in SfListView is applied to the entire ItemsSource. When a GroupDescriptor is used, all items in the list will be grouped accordingly, and selectively excluding specific items from grouping is not supported at this time.

Please let us know if you have any further questions or need assistance with other SfListView features. We’ll be happy to help.

Best Regards,
Muthupandy R.