Skip to main content Skip to footer

Barcode Support in ComponentOne Studio for WinForms

Applies To:

BarCode for WinForms

Author:

John Juback

Published On:

5/31/2005

The 2004 v3 release of ComponentOne Reports for .NET introduced barcode support via the Barcode property of the Field object. With the 2005 v2 release of ComponentOne Studio Enterprise and Studio for WinForms, this technology has been released as a separate product, ComponentOne BarCode for WinForms. This new product includes a single control, C1BarCode, which you can use to add barcode images to forms, reports, grid cells, Web pages, and standard .NET PrintDocument objects.

The C1BarCode control creates barcode representations of alphanumeric values. The main advantages of using the C1BarCode control instead of barcode fonts are:

  1. C1BarCode will automatically add any necessary control symbols and checksums to the value being encoded, depending on the encoding being used.
  2. C1BarCode is a royalty-free DLL and can be deployed with your application like any regular assembly. Barcode fonts, on the other hand, must be installed into the client's Font directory, and may not be royalty-free.

This article demonstrates some programming techniques for using C1BarCode in conjunction with other ComponentOne controls such as C1FlexGrid and C1WebGrid.

Using C1BarCode is easy. At design time, place a C1BarCode control on a form, then set its CodeType property to the type of encoding you want to use. C1BarCode supports the following encodings:

Codabar

Codabar may encode 16 different characters (0 through 9 plus -$:/. ), plus an additional 4 start/stop characters (A through D). Codabar is used by some US blood banks, photo labs, and on FedEx airbills.

Code128

Code 128 is a very high density alphanumeric bar code. It can be used to encode values with 6 characters or more and will use the least amount of space of any 1-D symbology.

Code39

Code 39 is an alphanumeric encoding also known as 3 of 9 and LOGMARS. This was the first alphanumeric symbology developed, and is one of the most widely used encodings.

Code93

Code 93 is an alphanumeric encoding that is slightly denser than code 39.

CodeI2of5

Code I2of5 is a numeric encoding. The symbol can be as long as necessary to store the encoded data.

Ean13

EAN-13 was implemented by the International Article Numbering Association (EAN) in Europe. EAN-13 encodes a 12-digit code that consists of a 2 digit system code followed by a 5 digit manufacturer code and a 5-digit product code. The 12-digit code is followed by a checksum digit (automatically added by the control).

Ean8

EAN-8 provides a short barcode for small packages. It encodes a 7-digit code that consists of a 2 or 3 digit system code followed by a 4 or 5 digit product code. The 7-digit code is followed by a checksum digit (automatically added by the control).

PostNet

PostNet is a numeric encoding used by the US postal service. It differs from most others in that it is based on the height of the bars rather than on their width.

At run time, set the Text property to the value you want to encode, and C1BarCode will display the proper image. Note that some encodings have a minimum character requirement, while others will only work with numeric values.

You can also create a C1BarCode control programmatically, then assign the value of its Image property to another control, such as a PictureBox:

C1BarCode bc = new C1BarCode();  
bc.CodeType = C1.Win.C1BarCode.CodeTypeEnum.Code39;  
bc.Text = "123456789";  
pictureBox1.Image = bc.Image;

This technique is also useful for rendering a barcode within a .NET PrintDocument object, or within another control, as in the following example.

Although C1FlexGrid does not have a built-in barcode cell style, you can use its owner-draw feature to render the image returned by a C1BarCode control into the appropriate cell, as in the following illustration.

To enable owner-draw mode, set the DrawMode property of the C1FlexGrid control to OwnerDraw at design time, or, in code:

c1FlexGrid1.DrawMode = C1.Win.C1FlexGrid.DrawModeEnum.OwnerDraw;

This will cause the OwnerDrawCell event to fire whenever the grid needs to render the contents of an individual cell. The handler for this event copies the cell text from the event argument object to a C1BarCode control on the form, then copies the resulting image from the C1BarCode control to the Image property of the event argument object. Finally, the event handler calls the DrawCell method to render the image, then sets the Handled property to true to terminate drawing within the cell. The complete code for the OwnerDrawCell event handler is as follows:

private void c1FlexGrid1_OwnerDrawCell(object sender,  
C1.Win.C1FlexGrid.OwnerDrawCellEventArgs e)  
{  
    // handle data rows in the ProductID column only  
    if (e.Col == 3 && e.Row > 0)  
    {  
        c1BarCode1.Text = e.Text;    // use the cell text  
        e.Image = c1BarCode1.Image;  // get the barcode image  
        e.DrawCell();                // draw the cell  
        e.Handled = true;            // we're done  
    }  
}

Note that the if statement restricts drawing operations to data cells within the ProductID column, which has an index of 3 (grid columns are zero-based, starting with the record selector button column). Likewise, the column header row has an index of 0, so data rows have positive index values.

This sample also performs some initialization in the Form_Load event to increase the height of the grid's data rows, but not the column header row:

// initialize the barcode text for size calculations  
c1BarCode1.Text = "000000";  

// save the default row height of the grid  
int oldDefault = c1FlexGrid1.Rows.DefaultSize;  
int padding = 6;  

try  
{  
    // use the barcode image height for sizing rows  
    c1FlexGrid1.Rows.DefaultSize = c1BarCode1.Image.Height   padding;  
}  
catch  
{  
    // if the image is null, use the default barcode height  
    c1FlexGrid1.Rows.DefaultSize = c1BarCode1.BarHeight   padding;  
}  

// restore the default height for the column header row  
c1FlexGrid1.Rows[0].Height = oldDefault;

The try block first attempts to use the height of the barcode image. If the text value "000000" is not valid for the selected encoding, the catch block uses the value of the BarHeight property of the C1BarCode control.

The Form_Load event ends by creating a new CellStyle for the ProductID column, which causes cells in that column to display images only (without text), centered within the cell.

// create a new style for the ProductID column (image only, centered)  
CellStyle cs = c1FlexGrid1.Cols[3].StyleNew;  
cs.Display = DisplayEnum.ImageOnly;  
cs.ImageAlign = ImageAlignEnum.CenterCenter;

Even though the ImageOnly display style is in effect, the sample shows barcode images annotated with the underlying text value. This is because the ShowText property of the C1BarCode control was set to true at design time, causing the text to be rendered as part of the image.

In an ASP.NET application, you can use a similar technique to render barcode images within cells of a C1WebGrid control. The difference is that you do not have direct access to an Image property-you must create tags that reference a separate .aspx page that returns a barcode image based upon the URL arguments. The following illustration shows a scrollable C1WebGrid control that uses the Code93 encoding type.

The code for this form is fairly straightforward. In addition to the usual data binding code, this sample includes a handler for the grid's ItemDataBound event, which is analogous to the OwnerDrawCell event in C1FlexGrid:

private void C1WebGrid1_ItemDataBound(object sender,  
C1.Web.C1WebGrid.C1ItemEventArgs e)  
{  
    if (e.Item.ItemType == C1ListItemType.Item ||  
        e.Item.ItemType == C1ListItemType.AlternatingItem)  
    {  
        // replace the text in the ProductID column (cell 2)  
        // with a barcode image url  
        string code = RadioButtonList1.SelectedItem.Text;  
        string text = e.Item.Cells[2].Text;  
        string img = String.Format(  
            "",  
            code, text);  
        e.Item.Cells[2].Text = img;  
    }  
}

This code replaces the Product ID cell text with an tag that points to another page within the project. For example, the URL for the first row is:

BarCode.aspx?CodeType=Code93&Text=000003

The CodeType argument is derived from the current selection in the RadioButtonList to the right of the grid. The Text argument is derived from the Cells collection of the item (row) being rendered.

The real work is done by BarCode.aspx, which creates and initializes a C1BarCode control from the QueryString arguments:

private void Page_Load(object sender, System.EventArgs e)  
{  
    // create a new C1BarCode component  
    C1BarCode bc = new C1BarCode();  

    // get the arguments from the query string  
    string codeType = Request.QueryString["CodeType"];  
    string text = Request.QueryString["Text"];  

    // convert the CodeType string to the appropriate enum value  
    if (codeType != null)  
        bc.CodeType = (CodeTypeEnum)  
            Enum.Parse(typeof(CodeTypeEnum), codeType, true);  

    // set the text to be encoded  
    if (text != null)  
        bc.Text = text;  

    // annotate the barcode image with the text value  
    bc.ShowText = true;  

    if (bc.Image != null)  
    {  
        // create a bitmap the same size as the barcode image  
        Rectangle rc = new Rectangle(Point.Empty, bc.Image.Size);  
        Bitmap bmp = new Bitmap(rc.Width, rc.Height);  

        // paint the bitmap background white  
        using (Graphics g = Graphics.FromImage(bmp))  
        {  
            g.FillRectangle(Brushes.White, rc);  
            g.DrawImage(bc.Image, rc);  
        }  

        // write the bitmap to the output stream in gif format  
        Response.ContentType = "image/gif";  
        bmp.Save(Response.OutputStream, ImageFormat.Gif);  
        Response.Flush();  
    }  
}

The trick here is to not use the Image property of the C1BarCode control directly, but to create a white bitmap of the same size, then draw the barcode image on top of that bitmap. The resulting image is then saved as a GIF file to the HTTP output stream.

To download the source code for the sample projects described in this article, visit the following link:

C1BarCodeArticleProjects.zip

MESCIUS inc.

comments powered by Disqus