In This Topic
Learn how to create a simple report and bind it with data in the FlexReportDesigner application by following these steps:
Create a Report Definition
You can create report definitions using the FlexReport Designer application with zero code. The easiest way to create a report definition using the FlexReportDesigner app, which is a stand-alone application similar to the report designer in Microsoft Access and Crystal Reports.
Note: The C1FlexReportDesigner.exe for 64-bit platform and C1FlexReportDesigner32.x.exe for 32-bit platform are located at C:\Program Files (x86)\ComponentOne\Apps\vx.x on your computer.
FlexReportDesigner provides the FlexReport Wizard, a report engine to create reports. With this wizard, you can choose a suitable data source, select fields, layouts and style etc.
To begin, complete the following steps:
- Run the C1FlexReportDesigner.exe file.
- Go to File menu in the menu bar and select the New command to create a new empty report definition file.
- Click New Report dropdown from the Reports tab located on the extreme left of designer and select Report Wizard.
The FlexReport Wizard opens.
Here, we have used 'OLEDB Data Provider' as the data provider. You can also choose any other data provider from the drop-down button.
Add a DataSource to Report
Using the FlexReport Wizard, complete the following steps to add a data source in the new report:
- Click the ellipsis button to bring up the standard connection string builder. The Data Link Properties dialog box opens.
- Select the Provider tab and select a data provider from the list. For this example, select Microsoft Jet 4.0 OLE DB Provider.
- Click the Next button or select the Connection tab. Now, you must choose a data source.
- Click the ellipsis button to select a database. The Select Access Database dialog box appears. For this example, select the C1NWind.mdb located in the \Documents\ComponentOne Samples\WinForms\vx.0\FlexReport\CS\FlexReportExplorer\Data directory (by default installed in the Documents folder). Note that this directory reflects the default installation path and its path may be different if you made changes to the installation path.
You can test the connection and click OK.
- Click OK to close the Data Link Properties dialog box.
- Once you have selected your data source, you can select a table, view, or stored procedure to provide the actual data.Click Next.
- Select the Data source tab and select the Products table from the Tables list.
Select Data Fields
- Select the fields you want to include in the report using the FlexReport Wizard.
This page in the Wizard contains a list of fields available from the recordset you selected, and the two lists that define the group and detail fields for the report. Group fields define how the data will be sorted and summarized, and Detail fields define what information you want to appear in the report.
You can move fields from one list to another by dragging them with your mouse pointer. Drag fields into the Detail list to include them in the report, or drag within the list to change their order. Drag fields back into the Available list to remove them from the report. With your mouse pointer, select the CategoryID field and drag it into the Groups list.
- Press the >> button to move the remaining fields into the Detail list.
Click Next.
Select Layout and Style
- Select the layout for the new report. FlexReport Wizard lets you select data layouts, page orientation and choose to adjust fields to fit the page. Keep the Outline layout.
- Click Next.
- Select the style for the new report. The FlexReport Wizard lets you to select the fonts and colors that will be used in the new report.
- Click Next.
Add Title and Preview the Report
- Select a title for the new report.
Enter a title for the new report, Products Report, for example.
- Choose Preview the report option and click Finish. You will immediately see the report in the preview pane of the Designer.
Note: You can invoke the
FlexReportDesigner from Visual Studio as well. To do so, complete the following steps:
- Create a .NET project and add the FlexReport component to your Toolbox.
- From the Toolbox, double-click the FlexReport icon to add the component to your project. Note that the component will appear below the form in the Component Tray.
- Click the FlexReport component's smart tag and select Edit Report from its Tasks menu.
The FlexReportDesigner opens and the C1FlexReport Wizard is ready to guide you through the five easy steps discussed above.
Modify the Report
With the FlexReportDesigner in preview mode, you cannot make any adjustments to the report. Click the Design button to switch to Design mode and begin making modifications. The right pane of the main window switches from Preview mode to Design mode, and it shows the controls and fields that make up the report.
For this example, we will resize the Group Header section and fields as well as format a field value. To do this, complete the following steps:
- To resize the Group Header section, select its border and with your mouse pointer drag to the position where you want it.
- With your mouse pointer, drag the handles in the field corners to resize fields.
Tip: If the text is not fitting in the field, set the Appearance.WordWrap property for the field to True in the Properties window.
- In the Properties window, select the UnitPriceLbl field in Detail section under the Unit Price column.
- Set the Appearance.Format property for the field to Currency.
- Click the Preview button to switch to Preview mode and see your modifications.
- Click Design button to switch from Preview mode to Design mode.
- Click the File menu and select Save As from the menu that appears.
- In the Save Report Definition File dialog box, enter ProductsReport.flxr in the File name box. Save the file to a location that you can remember for later use.
- Close the Designer and return to your Visual Studio project to open the report in FlexViewer.
You can also create a report in Visual Studio using code. To get the detailed information, see .