Step 4: Display Summaries

  • 3 minutes to read

This step describes how to display summaries:

  • Process summaries in the virtual source.
  • Display summaries in the GridControl.

VirtualSourcesTutorialSummaries

Note

This tutorial uses the Issues Service as a sample data source.

Run Demo: Infinite Scrolling Source - Step 4 Run Demo: Paged Source - Step 4

Summary Types

The Issues Service allows you to obtain:

  • The total count of rows.
  • The last created object’s datetime.
public class IssuesSummaries {   
    public int Count { get; private set; }
    public DateTime? LastCreated { get; private set; }
}

Display Summaries

  1. Process summaries in the virtual source:

    [Command]
    public void GetTotalSummaries(GetSummariesAsyncArgs args) {
        args.Result = GetTotalSummariesAsync(args);
    }
    static async Task<object[]> GetTotalSummariesAsync(GetSummariesAsyncArgs args) {
        var summaryValues = await IssuesService.GetSummariesAsync((IssueFilter)args.Filter);
        return args.Summaries.Select(x => {
            if(x.SummaryType == SummaryType.Count)
                return (object)summaryValues.Count;
            if(x.SummaryType == SummaryType.Max && x.PropertyName == "Created")
                return summaryValues.LastCreated;
            throw new InvalidOperationException();
        }).ToArray();
    }
    
    <dxg:GridControl.ItemsSource>
        <dx:InfiniteAsyncSource ElementType="{x:Type local:IssueData}"
                                FetchRowsCommand="{Binding FetchIssuesCommand}"
                                GetUniqueValuesCommand="{Binding GetUniqueValuesCommand}"
                                GetTotalSummariesCommand="{Binding GetTotalSummariesCommand}"/>
    </dxg:GridControl.ItemsSource>
    
  2. Set the DataViewBase.ShowFixedTotalSummary property to true to show the Fixed Summary Panel:

    <dxg:GridControl.View>
        <dxg:TableView ShowFixedTotalSummary="True"/>
    </dxg:GridControl.View>
    
  3. Specify the GridControl.TotalSummary property to display total summaries in the GridControl:

    <dxg:GridControl.TotalSummary>
        <dxg:GridSummaryItem SummaryType="Count" Alignment="Right"/>
        <dxg:GridSummaryItem SummaryType="Max" FieldName="Created" 
                             DisplayFormat="{}Last created: {0}" Alignment="Right"/>
    </dxg:GridControl.TotalSummary>
    

Display Custom Summaries

In the example below, the Issues Service can calculate the Median and StdDev values:

public class IssuesSummaries {
    // ...
    public double VotesMedian { get; private set; }
    public double VotesStdDev { get; private set; }
}

  1. Process summaries in the virtual source:

    [Command]
    public void GetTotalSummaries(GetSummariesAsyncArgs args) {
        args.Result = GetTotalSummariesAsync(args);
    }
    static async Task<object[]> GetTotalSummariesAsync(GetSummariesAsyncArgs args) {
        var summaryValues = await IssuesService.GetSummariesAsync((IssueFilter)args.Filter);
        return args.Summaries.Select(x => {
            if (x.SummaryType == SummaryType.Count)
                return (object)summaryValues.Count;
            if (x.SummaryType == SummaryType.Max && x.PropertyName == "Created")
                return summaryValues.LastCreated;
    
            // Custom Summaries
            if (x.SummaryType == SummaryType.Custom && x.PropertyName == "Votes") {
                var tag = x.Tag as string;
                if (tag == "Median")
                    return summaryValues.VotesMedian;
                if (tag == "StdDev")
                    return summaryValues.VotesStdDev;
            }
            throw new InvalidOperationException();
        }).ToArray();
    } 
    
  2. Display summaries in the GridControl:

    <dxg:GridControl.TotalSummary>
        <dxg:GridSummaryItem SummaryType="Count" Alignment="Right"/>
        <dxg:GridSummaryItem SummaryType="Max" FieldName="Created" 
                             DisplayFormat="{}Last created: {0}" Alignment="Right"/>
        <!-- Custom Summaries -->
        <dxg:GridSummaryItem SummaryType="Custom" Tag="StdDev" FieldName="Votes" 
                             DisplayFormat="{}Votes StdDev={0}" Alignment="Right"/>
        <dxg:GridSummaryItem SummaryType="Custom" Tag="Median" FieldName="Votes" 
                             DisplayFormat="{}Votes Median={0}" Alignment="Right"/>
    </dxg:GridControl.TotalSummary> 
    

Continue or Review