Icon of group by

1 Answer 220 Views
ListView
Daniel
Top achievements
Rank 1
Silver
Bronze
Daniel asked on 27 Apr 2022, 12:34 PM

Hi,

When I open and close the group icon  show the same icon , it possible to change to plus  icon ?

Thanks,

1 Answer, 1 is accepted

Sort by
0
Lance | Senior Manager Technical Support
Telerik team
answered on 27 Apr 2022, 01:21 PM

Hello Daniel,

Please visit and read the Grouping documentation => .NET MAUI ListView Documentation | Grouping.

You will see that the DataTemplate for the GroupHeaderTemplate has everything you need to get started designing your own custom header template.

Regards,
Lance | Manager Technical Support
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Lance | Senior Manager Technical Support
Telerik team
commented on 27 Apr 2022, 04:04 PM

For example, try this one...

<DataTemplate x:Key="ListViewGroupHeaderTemplate">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition />
        </Grid.ColumnDefinitions>
        
        <Label Text="🤢"
               Margin="8, 12, 0, 6"
               TextColor="LightGreen"
               FontSize="Medium">
            <Label.Triggers>
                <DataTrigger TargetType="Label"
                             Binding="{Binding IsExpanded}"
                             Value="True">
                    <Setter Property="Text"
                            Value="🤮" />
                    <Setter Property="TextColor"
                            Value="DarkGreen" />
                </DataTrigger>
            </Label.Triggers>
        </Label>
        
        <Label Margin="0, 12, 0, 6"
               Text="{Binding }"
               Grid.Column="1"
               TextColor="DarkGray"
               FontSize="Medium"
               HorizontalOptions="Start" />
    </Grid>
</DataTemplate>

It will have the following result at runtime:

Tags
ListView
Asked by
Daniel
Top achievements
Rank 1
Silver
Bronze
Answers by
Lance | Senior Manager Technical Support
Telerik team
Share this question
or