Skip to main content
A newer version of this page is available. .

Lesson 2 - Create a Data-Aware Report

  • 8 minutes to read

This tutorial will guide you through the process of creating a master-detail report using Microsoft® Visual Studio®. You will learn how to add a data-bound report to your application using the Report Wizard and customize the report layout.

The created report will be platform-agnostic, which means that you can use it later in other applications created on any of the supported platforms.

winforms-getting-started-master-detail-result-small

Tip

To get started with this tutorial, open an existing reporting application or create a new one from scratch. To learn how to create a reporting application on the platform of your choice, see Adding a Report to Your .NET Application.

This tutorial consists of the following sections:

Add a New Report

The following steps illustrate how to create a new report bound to a hierarchical SQL data source and specify a master-detail relationship between data source queries.

  1. Select PROJECT | Add New Item… in the Visual Studio® main menu or press CTRL+SHIFT+A.

    add-new-item-windows-forms

  2. In the Add New Item dialog, select the DevExpress v17.2 Report Wizard item and click Add.

    add-a-new-report-winforms-report-wizard

  3. In the invoked Report Wizard, select Data-bound Report and click Next.

    xtrareport-wizard-databaound-report-01

    Note

    Refer to the following documents to learn about other report types:

  4. On the next wizard page, you can select a required data source type. Choose Database and click Next to proceed.

    report-wizard-select-data-source-type

    Note

    Refer to the following documents to learn about binding to other data source types:

  5. On the next wizard page, specify whether you want to use any of the data connections that are already available in the Visual Studio® Server Explorer, or create a new data connection from scratch.

    report-wizard-page-visual-studio-database-02a

    To create a new connection, select the first option and click Next.

  6. On the next page, you can define a custom connection string, or select from the list of supported data providers.

    Depending on the data provider selected, it may be necessary to specify additional connection options (such as authentication type and database name) on this page.

    For this example, we will bind a report to a sample Northwind database hosted on a Microsoft SQL Server.

    report-wizard-database-sql-server

    To proceed to the next wizard page, click Next.

  7. On the following page, specify whether or not to save the connection string to the application’s configuration file.

    report-wizard-save-connection-string

    If you choose to save the connection string, specify its name and click Next.

  8. On the next page, you can choose which tables, views and/or stored procedures to add to the report.

    To create a master-detail report, select two or more tables and click Manage Relations.

    winforms-report-wizard-select-tables-edit-relations

    In the invoked editor, connect the required key fields (columns) using drag and drop.

    winforms-report-wizard-master-detail-relations-editor

    Click OK to close the editor.

    Note

    When you are required to shape data at the level of a data source, you can create custom queries by expanding the Queries category and clicking the report-wizard-multi-query-page-icon-add button.

    This will invoke the Query Builder where you can create complex queries by joining multiple tables, filtering, sorting and grouping their data, as well as calculating various aggregate functions.

    Although it is also possible to join different tables within a single query, creating hierarchical data sources is preferred in most cases to provide better performance (in general, master-detail reports are generated faster than similar-looking reports created by grouping “flat” data sources).

    You can stop the wizard at this step by clicking Finish to create a blank data-bound report.

    To continue report customization, click Next to proceed to the next wizard page.

The default report layout contains three different bands (Top Margin, Detail and Bottom Margin).

visual-studio-blank-report-default-layout

These bands cannot be deleted.

  • The top and bottom margins are repeated on each document page and in most scenarios should be left blank.
  • The Detail band provides space for printing repeated data coming from a report data source. This band is printed as many times as there are records in the report data source.

The following panels provide information about the report and will be used to create the report layout.

Report Explorer

Field List

The report structure is displayed in the Report Explorer where you can also access the data source settings.

visual-studio-report-explorer-data-source-context-menu

The hierarchy of the report data source is reflected by the Field List. You can right-click the data source to access its settings.

visual-studio-field-list-data-source-context-menu

To toggle the visibility of these panels, use the XtraReports Menu:

design-panels-xtrareports-menu

Construct the Master Report Layout

This document section illustrates how to add report bands and provide content to the report.

Add a Report Header

To quickly add a new band, right-click a report to invoke the context menu. To add a Report Header, select Insert Band | ReportHeader.

insert-report-header-band

Add Static Content

To create a title that will be printed in the beginning of a document, do the following.

  1. Open the Toolbox pane (by pressing CTRL+ALT+X), select the XRLabel control in the DX.17.2: Report Controls tab and drop it onto the Report Header.

    add-label-to-report-header

  2. Double-click the created label to invoke its in-place editor and type the required text (e.g., “Fall Catalog”). Then, use the XtraReports toolbar to adjust the label’s color and font options.

    label-specify-static-text

Add Dynamic Content

  1. To provide dynamic report content that is supplied from a connected data source, add data-bound controls to report bands.

    For example, to list product categories along with their descriptions in a report, drag the corresponding fields from the Field List and drop them onto the report’s Detail band.

    winforms-getting-started-master-report-layout-drop-fields

    Then, you can adjust the color and font options of the created labels.

  2. To display images stored in a connected database, right-click the corresponding item in the Field List and drop it onto the report. Choose PictureBox in the invoked context menu.

    winforms-getting-started-master-report-layout-drop-picture

    To specify the size mode for the image, click the control’s smart tag and set the XRPictureBox.Sizing property.

    picture-box-sizing-mode-zoomimage

    For instance, set this property to ZoomImage to proportionally resize the image within the control (without clipping).

Switch to the Preview tab to view the resulting document.

winforms-getting-started-master-result

Construct the Detail Report Layout

This document section describes how to create a hierarchical report displaying specific details under each product category of the master report created in the previous section.

A report can contain any number of detail reports (with each detail report containing any number of nested detail reports), which makes it possible to publish even the most complex hierarchical data.

  1. To create a Detail Report Band, right-click the report to invoke its context menu. Select Insert Detail Report and click the name of the master-detail relationship.

    winforms-getting-started-detail-report-layout-add-band-relationship

    This will create a new Detail Report with its data member set to the corresponding relationship.

    winforms-getting-started-detail-report-data-member-smart-tag

  2. A detail report can contain other bands. In this tutorial, we will add a Group Header for displaying captions of data fields contained in the detail report.

    To do this, right-click the detail report, and select Insert Band | GroupHeader in the invoked context menu.

    winforms-getting-started-detail-report-add-group-header

  3. To display column captions in the Group Header, click the required fields in the Field List (under the category corresponding to the data relationship assigned as the detail report’s data member) while holding the CTRL key. Then, drag and drop them onto the Group Header using the right mouse button.

    winforms-getting-started-detail-report-add-group-header-content

  4. To provide dynamic content to the detail report, select the same fields in the Field List and drop them onto the Detail Report band (using the left mouse button).

    winforms-getting-started-detail-report-add-content

  5. You can customize the appearance of the created Tables using the Properties window.

    winforms-getting-started-detail-report-customize-header-table

    To learn how to assign different style settings to alternating table rows in the detail report, see Report Visual Styles.

  6. To apply a currency format to a table cell displaying unit price, click the cell’s smart tag. Then, click the ellipsis button for the Format String property and select an appropriate format in the invoked Format String Editor.

    winforms-getting-started-detail-report-currency-format

  7. To secure proper location of document content, you can enable the GroupBand.RepeatEveryPage property, and set the GroupHeaderBand.GroupUnion property to WithFirstDetail.

    winforms-getting-started-group-header-layout-options

    This will make the Group Header repeated on every report page and always printed with at least one Detail band below it.

  8. To have master and detail report content always print on the same page, set the DetailBand.KeepTogetherWithDetailReports property of the master report’s Detail band.

    winforms-getting-started-master-keep-together-with-detail

The master-detail report is now ready. Switch to the Preview tab and view the result.

winforms-getting-started-master-detail-result

See Also