Part 5 Overview


This is the fifth part in the six-part "Become an Expert" series. In this part we will add a report generation feature to the Sales Management Application. This feature will be implemented simply by using the C1Report control, which is part of ComponentOne Studio for WinForms.


In the previous posts we used the C1FlexGrid and C1Chart controls to visualize our data. Now, we will add a reporting feature which is essential to this type of application. We will use the print feature of each control and the C1PdfDocument component as well. For the reporting we will utilize various features of the rich C1Report component, and we'll show how to print preview and actually print the report using the C1PrintPreviewControl.


Final Result


Here is a preview of the final result. When we click the "Report" button on the main form, we will open a print preview window.



From the print preview screen you can display file output or directly print the document.



So, let's add this reporting feature to our application. 


Design a report with C1Report control


The first step is to generate a report definition file (xml) that will define the layout and structure of our report. We will use the C1ReportDesigner application to create this report definition through a WYSIWYG design surface. The C1ReportDesigner application installs alongside Studio for WinForms.


Launch the C1ReportDesigner from the Start menu, under ComponentOne and Reports for .NET.



Select "File" --> "Add New Report" to create a new report.



In the first page of the C1Report wizard will connect to the database. Click on the "Build Connection String" button on the top right to display the "Data Link Properties" dialog.


Enter the server name, user name, password and select the database to create the connection string.



Next, write a SQL query to get the data to be displayed in the report.


We will be getting data from the Sales and Category data tables. The two tables are related through the CategoryCode field. We will get "Date", "Proceeds", "Payments", "GrossMargin", and "GrossMarginRate" from the Sales table and "Category Name" from the Category table.


Please refer to Part 1 and Part 2 of this series for details on the layout of Sales and Category tables. The SQL create statements can be found in the attached samples.



We could also use the SQL builder to create our SQL query. The SQL builder dialog can be accessed by clicking the "Build SQL statement" button on the top right.



You must be careful about predefined keywords in the C1Report control. In our case the word "Date" is a keyword so we use the AS operator to change the name of the column to "SalesDate."?


Once the SQL statement has been created, click on the "Next" button. We will group our data based on "CategoryName". Move "CategoryName" to the "Groups" box and all other fields to the "Detail" box on the C1Report Wizard dialog.



Click "Next" to select the layout. We'll select Outline, Portrait and Adjust Fields to fit page options.



Click "Next" to select a preset report style and enter the title of the report.




Finally, click "Finish" and Voila! The initial settings of your report are done.



Now we will decide where the report will be displayed and set the font for the report. These settings are easy to do by just dragging and dropping or setting some properties. We can also set the date format and currency format for our fields here.


Save the report definition file to complete the report design process.


Load and Print the report design using C1Report


Now, let's use the actual C1Report component in our Sales Management application.


Place the C1Report component on the Form. To get the C1Report control, add the control to the toolbox by right clicking on it and accessing the "Choose Toolbox Items" dialog.?For details on how to add controls refer to previous articles.


Use the Load method to load the report definition file. Set the parameters of the Load method to report definition file path and the name of the report. A single report definition file can contain many reports. In our case, we have only 1 report in our definition file but we still need to provide the report name.


this.c1Report1.Load("Report File Name & Path", "Report Name");

Then, call the Print method of the Document property to print the report.


this.c1Report1.Document.Print();

Preview and Export the Report


Printing starts the moment we click on the Report button because we are calling the Print method. However, it would be better if we get a print preview first and allow the user to change settings before the actual printing takes place. Just like other applications. It would also be great if we can get the output of the report in other formats besides simply printing. That would enhance the usability of this application tremendously. So let's try adding these two features.


Exporting the report as a file is easy; C1Report's RenderToFile method is available for generating outputted formats such as rich text, Html, PDF and Excel.


We can easily generate a preview using the standard PrintPreviewControl or the PrintPreviewDialog control. However, there will be some limitations on paging and zooming if you use the standard controls. So for better performance we will use C1PrintPreviewControl.


C1PrintPreviewControl


The C1PrintPreviewControl is also include in Studio for WinForms. This control is optimized for C1Report and already contains features like preview, printing, export etc. Just a few quick settings are needed to implement these features in our application.


First, place the C1PrintPreviewControl on the screen where we want the report to be displayed. For this sample, we add a new Form window called Print Preview.



Change the settings of C1PrintPreviewControl to decide on the commands to be used or if the navigation panel is to be displayed or not.


// Set the tools to be used.
this.c1PrintPreviewControl1.AvailablePreviewActions = C1PreviewActionFlags.All;
// Hide the navigation panel.
this.c1PrintPreviewControl1.NavigationPanelVisible = false;

Then, assign the Document property of C1Report to the Document property of C1PrintPreviewControl.


// Display document preview.
this.c1PrintPreviewControl1.Document = this.c1Report1.Document;

That's it! Replace the line of code that prints our report from earlier and display our new Print Preview window.



Use the buttons on the Print Preview of the C1PrintPreviewControl to print or get the file output.


Conclusion


In this part, we used the C1ReportDesigner application to create a report. We used the C1Report and C1PrintPreviewControl to load and preview our report in the Sales Management application. Unlike PDF export explained in Part 3, here we are able to export our data to PDF format in a better design.


In the final part, we will use some interesting features provided by various controls and complete the application.


Acknowledgements



  • Article copyright © 2009 Shogo Takayama & Shoeisha Co., Ltd. http://www.shoeisha.co.jp/

  • http://codezine.jp/

  • These contents were made by GrapeCity inc., Japan. http://www.grapecity.com/japan/

  • Translated by Vidhi Kapoor (GrapeCity India Pvt. Ltd.)

  • Edited by Greg Lutz (ComponentOne)