Create a Cross-Tab Report in the Visual Studio Report Designer

• Mar 05, 2024
• 4 minutes to read

This tutorial describes how to use the Cross-Tab Report Wizard to create a report and configure the XRCrossTab control to adjust the report appearance. The resulting report is similar to the following Sales Summary Report demo reports:

• Sales Summary Report Demo Online.
• Sales Summary Report Desktop Demo (installation of the DevExpress Demo Center is required).

For information on how to start with a Cross Tab control on the design surface to create a cross-tab report, review the following help topic: Create a Balance Sheet in the Visual Studio Report Designer.

Use the Cross-Tab Report Wizard

Invoke the Report Wizard, select Cross-Tab Report, and follow the steps listed below.

Bind a report to a sample Northwind database.

Drop data fields onto their corresponding cross-tab areas:

• The OrderDate and CategoryName fields onto the Rows area.
• The Country and FullName fields onto the Columns area.
• The ExtendedPrice field onto the Data area.

The field order within the area defines the hierarchy in the resulting cross-tab report.

Change the report page layout to landscape to ensure the cross-tab content fits the report page.

Set the report’s color scheme.

Specify the report’s title.

The newly created report contains the XRCrossTab control, which calculates automatic totals and grand totals across the row and column fields.

Tip

In the cross-tab report, the XRCrossTab control retrieves and processes data. Do not specify the report’s DataSource property. Otherwise, the Cross Tab data is printed as many times as there are rows in the report data source, because the Cross Tab control is located in the Detail band.

Switch to the Preview tab to see the result:

In the image above, the Cross Tab displays data for individual days, but the data is not properly formatted. The following steps improve the appearance of the Cross Tab control:

Specify Group Settings

Select the Cross Tab cell bound to the OrderDate field and click its smart tag. Set the GroupInterval property to DateQuarter to group data by quarters.

The result is shown below:

Format Data

1. Format the currency data. Hold down SHIFT or CTRL, and select the following cells:

   • The cell bound to the ExtendedPrice field.
   • The cells that display column and row totals.
   • The cells that display column and row grand totals.

   Switch to the Properties window and set the TextFormatString property to {0:c}.

   

2. Select the cell bound to the OrderDate field and click its smart tag. Set the Format String option to Quarter {0}.

   

The result is shown below:

Customize Appearance

1. Select the entire Cross Tab control, switch to the Properties window, and expand the CrossTabStyles property. Expand the GeneralStyle property and set the BorderColor to 160, 160, 160. This value applies to all Cross Tab cells.

   

2. Expand the HeaderAreaStyle property and set the following properties:

   • BackColor to 240, 240, 240
   • Font to Calibri, 9pt, style=Bold

   

3. Expand the TotalAreaStyle property and set the Font to Calibri, 9pt, style=Bold.

   

4. Expand the DataAreaStyle property and set the Font to Calibri, 9pt.

   

5. Hold down SHIFT or CTRL, and select the cells that display the grand total values. Go to the Properties window and set the BackColor to 240, 240, 240. This value applies to the selected cells only and overrides the value specified at the area level.

   

6. Select the cell bound to the OrderDate field and set the TextAlignment to TopLeft.

   

The result is shown below:

Adjust the Content Size

1. Select the cell bound to the OrderDate field and set the ColumnAutoWidthMode property to None. The property specifies how to calculate the cell width. The Report Wizard sets this property to ShrinkAndGrow for row headers and to None for other cells.

   

2. Move the report title to the Top Margin band to repeat the title on each page and let the Cross Tab fill the entire page area.

   

The resulting report is shown below:

Cross-Tab Report - Page 1

Cross-Tab Report - Page 2

Create a Cross-Tab Report in the End-User Report Designer

Tutorials that explain how to create different reports in EUD Report Designers for WinForms and Web are included in the End-User Documentation online help section:

• Create a Cross-Tab Report in the End-User Report Designer for Web
• Create a Cross-Tab Report in the End-User Report Designer for WinForms