Blog » Adding Bar Codes to Receipts in AspDotNetStorefront

Adding Bar Codes to Receipts in AspDotNetStorefront

Sample Administrative Notification ReceiptA recent posting in the AspDotNetStorefront forums got my brain spinning on how best to accomplish this. The technology to do this, once written, should be able to be leveraged in other areas that clients of mine have been looking to do. So, out comes Visual Studio and Google to come up for some starting points on how to accomplish this.

Research pointed me at an article by Zach Smith on TechRepublic that provided the basis for this project.  With this, I created a class file to place in the site’s /App_Code directory containing the following code:

using System;
using System.Drawing;
using System.Drawing.Imaging;
using System.Drawing.Text;

namespace BarCode{public class BarCode
{
public static Bitmap CreateBarcode(string data)
{
// Create the Bitmap we'll be using.
Bitmap barCode = new Bitmap(1, 1);
// Get a reference to the Free 3 of 9 font. We'll use this to generate the barcode.
// Found at http://www.squaregear.net/fonts/free3of9.shtml
Font threeOfNine = new Font("Free 3 of 9", 60, System.Drawing.FontStyle.Regular, System.Drawing.GraphicsUnit.Point);
// Get a graphics object to work with
Graphics graphics = Graphics.FromImage(barCode);
// Now we need to get the width and height that our data will cover 
// after is is rendered with the Free 3 of 9 font
SizeF dataSize = graphics.MeasureString(data, threeOfNine);
// Now we base the Bitmap's size off of this data
barCode = new Bitmap(barCode, dataSize.ToSize());
// Refresh our Graphics object with the new bitmap
graphics = Graphics.FromImage(barCode);
// Make the Graphic object's drawing surface white
graphics.Clear(Color.White);
// Set the rendering hint to SingleBitPerPixel
graphics.TextRenderingHint = TextRenderingHint.SingleBitPerPixel;
// Draw the string onto the Graphics ojbect
graphics.DrawString(data, threeOfNine, new SolidBrush(Color.Black), 0, 0);
// Force the graphics object to execute any pending operations
graphics.Flush();
// Dispose of our objects
threeOfNine.Dispose();
graphics.Dispose();
// Return the finished barcode
return barCode;
}
}
}

One of the key features of this code is the font that is used to create the barcode. Matthew Welch has released a number of freely available TrueType fonts at his site I Shot the Serif. The font in question is his “Free 3 of 9” which will produce a 3 of 9, or Code 39, barcode that is scannable by my hand-held scanners. You will need to download the fonts and install them into the %windir%\font directory on the server running the storefront. One thing that is very important is that the font won’t be available until either the server is rebooted or you’ve run IISRESET on the server. Normally the font is available immediately as soon as it is added to the server’s font directory to most applications but working with IIS6 on a Win2k3 server and IIS7 on a Vista box required an IISRESET to enable the font.

Next, we need to create a file in the website that will will actually generate the barcode image on the fly. This is done in the code-behind of the CreateBarCode.aspx file:

// ------------------------------------------------------------------------------------------
// Copyright Exhibit A Communications, 2009.
// Portions copyright Zach Smith, http://blogs.techrepublic.com.com/howdoi/?p=173
// 
// THE ABOVE NOTICE MUST REMAIN INTACT. 
// ------------------------------------------------------------------------------------------
using System;
using System.Collections;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Drawing.Imaging;
using System.Web;
using System.Web.SessionState;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.HtmlControls;
using AspDotNetStorefrontCommon;
using BarCode;
namespace AspDotNetStorefront {
/// <summary>
/// Summary description for createbarcode.
/// </summary>
public partial class createbarcode : System.Web.UI.;color: #2b91af">Page
{
protected void Page_Load(object sender, System.EventArgs e)
{
string data = Request.QueryString["data"];
Response.ContentType = "image/gif";
Response.Clear();
Bitmap barCode = BarCode.BarCode.CreateBarcode("*" + data + "*");
barCode.Save(Response.OutputStream, ImageFormat.Gif);
Response.End();
barCode.Dispose();
}
}
}

You’ll notice that in the call to BarCode.BarCode.CreateBarcode() includes an asterisk before and after the actual code to be encoded into the barcode. This is because Code39 barcodes are supposed to be enclosed in asterisks in order for scanners to identify the barcode type. This simple file just takes the querystring value named “data” and passes it (after enclosing it in *) to the CreateBarcode() function in the BarCode class in the BarCode namespace.

Lastly we will need modify the XMLPackage to generate the call to this image. In my client’s case, they want this to show up in the administrative notification email which is printed for the order pickers. As such, I added the following code to the appropriate location in the notification.adminneworder.xml.config file that generates this email.

<tr>
<td colspan="2" align="center">
<img src="{/root/System/StoreUrl}createbarcode.aspx?data={$OrderInfo/OrderNumber}" alt="Order Number {/root/QueryString/ordernumber}" />
</td>
</tr>

In this case, the table row is inserted into the tblOrderHeader table generated by the order ID. Please note that I’ve used two different
methods to pull in the order number into the <img> tag for illustrative purposes; either one will work

Hopefully someone else will find this handy. If so, please leave a note in the comments field below. Of course, if the work to implement this is beyond your abilities or the time available to you, please feel free to contact us and we’ll contract to do the work for you.

Michael Gibbs
Stalk Me...
Latest posts by Michael Gibbs (see all)