Home »

Adding Bar Codes to Receipts in AspDotNetStorefront

29. May 2009 by 3 Comments

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.

Comments (3) -

Georgiy Kharchenko
Georgiy Kharchenko said:

I was going to pay between $100 - $400 for a solution to display bar codes on aspdotnetstorefront receipt. Fortunately I found this article. As far as source code - it works great, but In order for it to work, you need to install font that is used by Zach Smith on TechRepublic. It's absolutely free and you can download it by going to: http://www.squaregear.net/fonts/free3of9.shtml Its called Free 3 of 9 font. Just add it to your font directory on the server: control pannel > fonts.

2. XSLT modifications:

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

Go to the xml package: notification.receipt.xml.config (make sure that this is the name of the package in your configuration settings in aspdotnetstorefront.

3. If you don't have source code, you may create another asp.net project and add it under the same directory as your aspdotnetstorefront.  For example YOURSTOREURL/barcodes/showbarcode.aspx, add the above code to that new project and point reference from xml package to that additional project under the same root. In iis navigate to that directory, go to properties and click "create".  If you have latest storefront version, you will need to modify web.config (only for no source code instance). UrlRoutingModule


ringbacks
United Kingdom ringbacks said:

I've been looking for a solution to displaying bar codes on one of my clients websites and I AM REALLY fortunate that I found your blog! You're a bless man!

Selim
Tunisia Selim said:

Many thanks for this article man. I helped me saving money and time. I was goign to buy a solution to generate barcodes with C# until I found your post. Thanks to Matthew Welch.

Pingbacks and trackbacks (1)+

Add comment




  Country flag
biuquote
  • Comment
  • Preview
Loading