Group Summary

  • 3 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.

Total_Group_Summaries

Displaying Group Summaries

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

GroupSummary_AddDT

<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.

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.

align group summary by columns

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.

group_footers

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:

DevExpress WPF | Grid Control - Customize Group Summary

<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:

DevExpress WPF | Grid Control - Customize Aligned Group Summary

<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>