Group Summary

• Feb 26, 2023
• 4 minutes to read

A group summary represents a value of the aggregate function calculated over all data rows within a group. Group summaries are displayed within group rows, and are stored within the grid’s GridControl.GroupSummary collection.

Displaying Group Summaries

To create a group summary item at design time, use the GroupSummary Collection Editor.

XAML

<dxg:GridControl.GroupSummary>
    <dxg:GridSummaryItem DisplayFormat="Max: {0:c2}" FieldName="UnitPrice"
        ShowInColumn="" SummaryType="Max" />
</dxg:GridControl.GroupSummary>

To display group summaries in code, create a new instance of the GridSummaryItem class, specify its properties and add it to the GridControl.GroupSummary collection.

C#

DevExpress.Xpf.Data.GridSummaryItem groupSummaryItem = new DevExpress.Xpf.Data.GridSummaryItem();
groupSummaryItem.FieldName = "UnitPrice";
groupSummaryItem.DisplayFormat = "Max: {0:c2}";
groupSummaryItem.SummaryType = DevExpress.Data.SummaryItemType.Max;
grid.GroupSummary.Add(groupSummaryItem);

Use the AddRange method to add multiple summary items.

View Example: How to Display Group Summaries

Obtaining Summary Values

To obtain a group summary value displayed within the specified group row, use the GridControl.GetGroupSummaryValue method.

Align Group Summaries by Columns

By default, group summaries are displayed to a group row’s right. To display group summaries under corresponding columns, set the TableView.GroupSummaryDisplayMode to GroupSummaryDisplayMode.AlignByColumns.

Group Footers

To show group footer rows, use the view’s TableView.ShowGroupFooters property. To display a summary item within group footer rows, use its GridSummaryItem.ShowInGroupColumnFooter property.

Customize Group Summaries

The following table lists properties that allow you to customize group summaries:

Property	Description
GroupSummaryDisplayMode	Gets or sets the position of group summaries within a group row. This is a dependency property.
GroupSummaryContentStyle	Gets or sets the style applied to group summary items. This is a dependency property.
GroupBandSummaryContentStyle	Gets or sets the style applied to group summary items aligned by bands. This is a dependency property.
GroupColumnSummaryContentStyle	Gets or sets the style applied to group summary items aligned by columns. This is a dependency property.
GroupColumnSummaryElementStyle	Gets or sets the style applied to individual text elements in group summary items that are aligned by columns. This is a dependency property.
GroupFooterSummaryContentStyle	Gets or sets the style applied to summary items displayed within group footers. This is a dependency property.
GroupColumnFooterElementStyle	Gets or sets the style applied to individual text elements in the group summary item that is displayed within the group footer. This is a dependency property.
GroupSummaryItemTemplate	Gets or sets the template that defines the presentation of summary items displayed within group rows. This is a dependency property.
GroupSummaryItemTemplateSelector	Gets or sets an object that chooses a group summary template based on custom logic. This is a dependency property.
GroupColumnSummaryItemTemplate	Gets or sets the template that defines the presentation of group summary items aligned by columns. This is a dependency property.
GroupFooterSummaryItemTemplate	Gets or sets the template that defines the appearance of group footer summary items. This is a dependency property.
GroupFooterSummaryItemTemplateSelector	Gets or sets an object that chooses a group footer summary item template based on custom logic. This is a dependency property.

Examples

The following code sample demonstrates how to use the GridViewBase.GroupSummaryItemTemplate property to change the group summary caption and background color:

XAML

<dxg:GridControl ItemsSource="{Binding Orders}">
    <dxg:GridControl.GroupSummary>
        <dxg:GridSummaryItem SummaryType="Sum" FieldName="UnitPrice" />
    </dxg:GridControl.GroupSummary>
    <dxg:GridControl.View>
        <dxg:TableView>
            <dxg:TableView.GroupSummaryItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal" Background="Bisque">
                        <TextBlock Text="Total Price: "/>
                        <TextBlock Text="{Binding Value}" Background="LightBlue"/>
                    </StackPanel>
                </DataTemplate>
            </dxg:TableView.GroupSummaryItemTemplate>
        </dxg:TableView>
    </dxg:GridControl.View>
</dxg:GridControl>

You can also define multiple templates and implement custom logic to choose a template. To do this, use the GridViewBase.GroupSummaryItemTemplateSelector property.

If the TableView.GroupSummaryDisplayMode property is set to AlignByColumns, use the TableView.GroupColumnSummaryItemTemplate property to define a group summary template. The code sample below shows how to display group summaries aligned by columns with a custom background:

XAML

<dxg:GridControl>
    <dxg:GridControl.GroupSummary>
        <dxg:GridSummaryItem SummaryType="Sum" FieldName="UnitPrice" />
    </dxg:GridControl.GroupSummary>
    <dxg:GridControl.View>
        <dxg:TableView GroupSummaryDisplayMode="AlignByColumns">
            <dxg:TableView.GroupColumnSummaryItemTemplate>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal">
                        <TextBlock Text="{Binding Value}" Background="LightBlue" Margin="130,0,0,0"/>
                    </StackPanel>
                </DataTemplate>
            </dxg:TableView.GroupColumnSummaryItemTemplate>
        </dxg:TableView>
    </dxg:GridControl.View>
</dxg:GridControl>