The RadListView control is now obsolete and will be removed in the future. Use the RadCollectionView control instead. The RadCollectionView is a complete, ground-up rewrite of the ListView. The RadCollectionView offers improved performance, enhanced features, and a modernized approach to managing lists of data. The RadCollectionView incorporates all of the ListView's key features. More about the differences between both components and how to migrate to the new RadCollectionView is available in the Migrating the Telerik .NET MAUI RadListView to RadCollectionView article.

.NET MAUI ListView Property Group Descriptor

You can group the data by a property value from the class that defines your items. This descriptor exposes the following properties:

• PropertyName—Defines the string name of the property you want to group by.
• SortOrder—Defines the sort order in each group to Ascending or Descending.

1. Add the following business object:

public class City
{
    public string Continent { get; set; }
    public string Name { get; set; }
    public string Country { get; set; }
}

2. Add a ViewModel with a collection of Cities:

public class GroupingViewModel : NotifyPropertyChangedBase
{
    public ObservableCollection<City> Cities { get; set; }

    public GroupingViewModel()
    {
        this.Cities = new ObservableCollection<City>()
        {
            new City() { Name = "Barcelona", Country = "Spain", Continent = "Europe"},
            new City() { Name = "Madrid", Country = "Spain", Continent = "Europe" },
            new City() { Name = "Rome", Country = "Italy", Continent = "Europe" },
            new City() { Name = "Florence", Country = "Italy", Continent = "Europe" },
            new City() { Name = "London", Country = "England", Continent = "Europe" },
            new City() { Name = "Manchester", Country = "England", Continent = "Europe"},
            new City() { Name = "New York", Country = "USA", Continent = "North America" },
            new City() { Name = "Boston", Country = "USA",  Continent = "North America" }
         };
    }
}

3. Group the Cities by the Country property through the PropertyGroupDescriptor:

<telerik:RadListView x:Name="listView" ItemsSource="{Binding Cities}"
                         ItemTemplate="{StaticResource ListViewItemTemplate}"
                         GroupHeaderTemplate="{StaticResource ListViewGroupHeaderTemplate}"
                         GroupHeaderStyle="{StaticResource ListViewGroupHeaderStyle}">
    <telerik:RadListView.BindingContext>
        <local:GroupingViewModel/>
    </telerik:RadListView.BindingContext>
    <telerik:RadListView.GroupDescriptors>
        <telerik:ListViewPropertyGroupDescriptor PropertyName="Country"/>
    </telerik:RadListView.GroupDescriptors>
</telerik:RadListView>

4. Add the Templates definition in the page resources:

<ResourceDictionary>
    <DataTemplate x:Key="ListViewItemTemplate">
        <telerik:ListViewTemplateCell>
            <telerik:ListViewTemplateCell.View>
                <Grid HeightRequest="40" Padding="28, 0, 0, 0">
                    <Label Text="{Binding Name}" TextColor="#6F6F70" FontSize="Small" VerticalOptions="Center" />
                </Grid>
            </telerik:ListViewTemplateCell.View>
        </telerik:ListViewTemplateCell>
    </DataTemplate>
    <DataTemplate x:Key="ListViewGroupHeaderTemplate">
        <Grid HeightRequest="40" BackgroundColor="#F1F2F5">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="Auto" />
                <ColumnDefinition />
            </Grid.ColumnDefinitions>
            <Label Text="&#xE806;" Margin="8, 0, 0, 0" TextColor="DarkGray" FontFamily="TelerikFontExamples" FontSize="Medium" VerticalOptions="Center">
                <Label.Triggers>
                    <DataTrigger TargetType="Label" Binding="{Binding IsExpanded}" Value="True">
                        <Setter Property="Text" Value="&#xE80D;" />
                    </DataTrigger>
                </Label.Triggers>
            </Label>
            <Label Margin="8, 0, 0, 0" Text="{Binding }" Grid.Column="1" TextColor="DarkGray" FontSize="Medium" VerticalOptions="Center" />
        </Grid>
    </DataTemplate>
    <telerik:ListViewGroupStyle x:Key="ListViewGroupHeaderStyle" BackgroundColor="Transparent" />
</ResourceDictionary>

5. Include the telerik namespace:

xmlns:telerik="http://schemas.telerik.com/2022/xaml/maui" 

For the ListView PropertyGroupDescriptor example, go to the SDKBrowser Demo Application and navigate to ListView -> Grouping category.

See Also

• Filtering
• Sorting
• Selection