How to display barcodes in the Page Header and Footer of a Report (RDL or RDLC)

Technologies used
- Neodynamic Barcode Professional 3.0 for Reporting Services
- Microsoft .NET Framework 1.1 or greater
- Microsoft Visual Studio .NET 2003, Microsoft Visual Studio 2005 or SQL Server Business Intelligence Development Studio
- Microsoft SQL Server 2000/2005 Reporting Services or Visual Studio Local Reports RDLC

A common need or requirement in barcode reporting scenarios is to display barcodes in the Page Header or/and Footer of a Report.

View Figure...

A SQL Server Reporting Services 2000/2005 Report (RDL file) or a Visual Studio Local Report (RDLC file) can contain a header and footer that run along the top and bottom of each page, respectively. The important thing to keep in mind regarding headers and footers is that they can contain static text, images, lines, rectangles, borders, background color, and background images ONLY, i.e. you cannot add databound fields or images directly to a header or footer and given that, it becomes in a problem when working with barcodes in such page sections because in most cases you'll want to encode a databound field. The following guide tries to provide you with a solution to this "limitation".

In the following guide we're going to create a Report Server Project which shows barcode images into a Page Header section of a simple report. This guide was developed by using Barcode Professional, Visual Studio 2005 and Reporting Services 2005. However, the same method stated here is valid for Reporting Services 2000 projects and Visual Studio Local Reports RDLC!

The idea is very simple... create a Product Catalog for AdventureWorks (A fictitious company which database is delivered with SQL Server 2005).

Follow these steps
- Open Visual Studio 2005 or SQL Server Business Intelligence Development Studio and create a new Report Server Project
- Add a new Shared Data Source pointing to the AventureWorks database sample
- Add a new blank Report and open it at design-time. Click on Data tab, select New DataSet from the drop down list and write the following SQL Statement in the Query String textbox:

SELECT
Production.vProductModelCatalogDescription.ProductModelID,
Production.vProductModelCatalogDescription.Summary,
Production.vProductModelCatalogDescription.Name,
Production.vProductModelCatalogDescription.WarrantyPeriod,
Production.vProductModelCatalogDescription.Wheel,
Production.vProductModelCatalogDescription.Saddle,
Production.vProductModelCatalogDescription.Pedal,
Production.vProductModelCatalogDescription.BikeFrame,
Production.vProductModelCatalogDescription.Crankset,
Production.vProductModelCatalogDescription.Color,
Production.vProductModelCatalogDescription.Material,
Production.ProductPhoto.LargePhoto
FROM
Production.vProductModelCatalogDescription
INNER JOIN
Production.ProductPhoto ON Production.vProductModelCatalogDescription.ProductPhotoID = Production.ProductPhoto.ProductPhotoID
WHERE
(Production.vProductModelCatalogDescription.ProductModelID = @ModelID)

View Figure...
The DataSet1 settings for the report

Click OK to save the DataSet.

After that, add a new DataSet by selecting <New DataSet...> from the DataSet drop down list on the Data tab. Write the following SQL Statement in the Query String textbox:

SELECT ProductModelID, Name FROM Production.vProductModelCatalogDescription ORDER BY Name

View Figure...
The DataSet2 settings for the report

Click OK to save the DataSet.

- Go back to the Layout tab. It´s time to display the Report Page´s Header and/or Footer on the report designer. To do that just go to Report menu and click on Page Header and/or Page Footer depending on where you want to display the barcode image. In this case, we´ll select Page Header only.

View Figure...
Display the Page Header and/or Page Footer on the Report Designer

After that, the Page Header and/or Page Footer should be displayed by the Report Designer so you can place the allowed objects onto it.

- Barcode Professional settings for the barcode generation:
+ Install Barcode Professional for Reporting Services on your machine so it can be used with it.

IMPORTANT: If you are using Visual Studio Local Reports RDLC, then after installing Barcode Professional for Reporting Services you must register it into the Global Assembly Cache (GAC). The assembly to register is located in [BarcodeInstallDir]\bin\For SSRS 2005\Neodynamic.ReportingServices.Barcode.dll

+ Add a reference to the Barcode Professional assembly (Neodynamic.ReportingServices.Barcode.dll) going to Report > Report Properties. In the dialog box shown, click on References tab and add a reference to the Barcode assembly as is shown in the following figure:

View Figure...
Adding a reference to Barcode Professional assembly

Click on Add button and then on OK button.

After that, we'll need to create an instance of Barcode Professional to use it then in a custom function. To do this, add a new entry in the Classes grid as is shown in the following figure. Note that the instance will be called objBarcode and that the full reference to the class is Neodynamic.ReportingServices.Barcode

View Figure...
Creating an instance of Barcode Professional

+ Then click on Code tab and write the following function that utilizes the barcode instance created above to generate the desired barcode image. NOTE: In this case we opt for using Code 128 Symbology to encode the Product Model ID which will be passed to this function through the valueToEncode parameter.

View Figure...
The VB.NET Function that will generate the barcode image

Public Function GetBarcode(ByVal valueToEncode As String) As Byte()
objBarcode.Code = valueToEncode
objBarcode.Symbology = Neodynamic.ReportingServices.Symbology.Code128
objBarcode.BarWidth = 0.01
objBarcode.BarHeight = 0.4
objBarcode.AutoSize = False
objBarcode.Width = 2.875
objBarcode.Height = 0.625
Return objBarcode.GetBarcodeImage()
End Function

Notice that in the function above, we set the AutoSize property of Barcode Professional to False allowing us to CENTER the barcode image inside the dimensions specified in the Width and Height properties (which are measured in inches). You´ll see this effect after you run your report later.

- Report Layout
In our sample the report will allow us to select a Product Name in order to display information about the selected product in the form of DataSheet. The Product DataSheet will feature a barcode image in the Page Header section encoding the string "Model ID: " + the ProductModelID data field.
+ Go to Report menu and click on Report Parameters... and modify the existing parameter called ModelID (which was automatically created by the report designer based on the DataSet1 SQL statement) with the data shown in the following figure:

View Figure...
The Report Parameter settings for the Product Model ID

Click OK to save the changes.

+ Now it´s time to design the report for the Product DataSheet. Design the report as is shown in the following figure.

View Figure...
The Product DataSheet report layout

Report Layout Description
1- Header Section
It contains 2 Rectangles. The first one on the just contains 2 TextBox with static text. The most important is the rectangle on the right which contains:
- A TextBox to display the selected Product Name and which Value property is set to =Parameters!ModelID.Label
- An Image control that will display the barcode generated by the function we wrote in the Code section (See the setting in the Value property below). The properties of the Image control to set up are the following:
-- MIMEType is set to image/bmp
-- Source is set to Database
-- Value is set to =Code.GetBarcode("Model ID: " & ReportItems!txtProductModelID.Value)
-- Sizing is set to AutoSize
-- Size Width is set to 2.875in (the same value that appears in the GetBarcode function)
-- Size Height is set to 0.625in (the same value that appears in the GetBarcode function)

2- Body Section
It contains a List control with the following property settings:
- DataSetName is set to DataSet1
- The List control also contains 2 Rectangles.

3- A Rectangle which contains an Image and 3 TextBox:
- An Image control to display the product photo. The properties of the Image control to set up are the following:
-- MIMEType is set to image/bmp
-- Source is set to Database
-- Value is set to =Fields!LargePhoto.Value
-- Sizing is set to AutoSize
- A TextBox to display the Product Summary and which Value property is set to =Fields!Summary.Value
- A TextBox to display the Warranty period of the Product and which Value property is set to =Fields!WarrantyPeriod.Value + " Warranty!"
- A TextBox to display the Warranty period of the Product and which:
-- Value property is set to =Fields!ProductModelID.Value
-- Visibility > Hidden property is set to True (We do not want to display this field because it will be encoded in the barcode in the Page Header!)

4 A Rectangle which contains a set of TextBox for the rest of the data fields. Please refer to the figure above in order to see how to set up the Value properties of each TextBox


- That´s it. If you run the report you'll see the barcode image for the Product Model ID field in the Page Header after you select a Product from the drop down list.

View Figure...
The barcode image in the Page Header section

- Deployment
Please refer to the product help documentation about this topic.


Links:
This Demo
More Demos
Download Barcode Professional for Reporting Services
More Information about Neodynamic Barcode Professional for Reporting Services

Neodynamic
.NET Components & Controls
http://www.neodynamic.com
http://www.barcode-for-reporting-services.com