How to draw and print QR Code barcode on high quality photos or images in ASP.NET

If this is your first visit, be sure to
check out the FAQ by clicking the
link above. You may have to register
before you can post: click the register link above to proceed. To start viewing messages,
select the forum that you want to visit from the selection below.

How to draw and print QR Code barcode on high quality photos or images in ASP.NET

How to draw and print QR Code barcode on high quality photos or images in ASP.NET

Prerequisites

Neodynamic Barcode Professional 7.0 for ASP.NET (WebControl)

Microsoft ASP.NET 2.0 or greater

Microsoft Visual Studio 2005/2008/2010 or Visual Web Developer

In this guide you will learn how to draw and print QR Code barcodes on high quality photos or images in an ASP.NET website.

NOTE: Although this guide takes QR Code barcode as a sample, you can use ANY of the linear, postal & 2D barcodes supported by Barcode Professional for ASP.NET product. For example, you could change this guide to print Code 39, Code 128, EAN-13, UPC-A, GS1 DataMatrix, GS1-128, GS1 DataBar, Data Matrix, PDF417, etc.

Suppose you have a client which is a professional photographer. He wants you design a website where he can show his work to the world. He also wants to offer to the website visitors to print out a sample photo but with some kind of symbol, watermark or info so his photo or website would be reached by any other person who like it.

QR Code barcodes are commonly used today for tagging things like postcards, business cards, brochures, etc; and any person using a mobile device with a barcode reader software can scan those barcodes for further info. Usually, an URL is encoded into the QR Code so when scanned, the userís mobile browser is redirected to such location. Other info or formats like VCard, MeCard, SMS, etc. are also used with QR Code barcodes.

Add a new item of type "Generic Handler" and name it GenHQBarcode.ashx

On this file, we'll take the Macaws.jpg high quality photo using System.Drawing.Image class and after creating a System.Drawing.Graphics object, weíll draw a QR Code barcode onto it encoding the URL which references the source image on the web. The output image (i.e. the photo with the QR Code stamped onto it) will be saved as a new JPEG image with a 90% quality compression level. Please copy/paste the following code:

Dim buffer As Byte() = Nothing
'get the HQ image or photo for drawing the barcode onto it
Using myImage As System.Drawing.Image = System.Drawing.Image.FromFile(context.Server.MapPath("~/images/macaws.jpg"))
'create a Graphics object on the image for drawing barcode
Using gfx As System.Drawing.Graphics = System.Drawing.Graphics.FromImage(myImage)
'create a BarcodeProfessional object and draw a QR Code barcode on the image
Using bcp As New BarcodeProfessional()
'barcode unit is in inch (change it if needed)
bcp.BarcodeUnit = BarcodeUnit.Inch
'Set the barcode to QR Code standard
bcp.Symbology = Symbology.QRCode
'Set the QR Code module size (each small black square is a module)
bcp.QRCodeModuleSize = 0.0208
'set the value to encode per your needs...
'in this case the URL of the original photo
bcp.Code = "http://www.stockvault.net/photo/113075/macaws"
'set a Quiet zone for the barcode
bcp.QuietZoneWidth = 0.1
bcp.BottomPadding = 0.1
bcp.TopPadding = 0.1
'use a semi-transparent white background
'so the QR Code looks like a watermark
bcp.BackColor = System.Drawing.Color.FromArgb(128, 255, 255, 255)
'draw the QR Code barcode onto the image at x=0.5in & y=0.5in!!!
bcp.DrawOnCanvas(gfx, New System.Drawing.PointF(0.5F, 0.5F))
End Using
End Using

'save the output image to a memory stream
Using ms As New System.IO.MemoryStream()
' Get an ImageCodecInfo object that represents the JPEG codec.
Dim myImageCodecInfo As System.Drawing.Imaging.ImageCodecInfo = GetEncoderInfo("image/jpeg")

' Create an EncoderParameters object.
' An EncoderParameters object has an array of EncoderParameter objects. In this case, there is only one
' EncoderParameter object in the array.
Dim myEncoderParameters As New System.Drawing.Imaging.EncoderParameters(1)

// Create an EncoderParameters object.
// An EncoderParameters object has an array of EncoderParameter objects. In this case, there is only one
// EncoderParameter object in the array.
System.Drawing.Imaging.EncoderParameters myEncoderParameters = new System.Drawing.Imaging.EncoderParameters(1);

The above HTTP Handler generates the output high quality image when invoking it. Remember that the original photo and the generated by that handler is 1800 x 1200 px at 300 dpi. To correctly display it on a webpage and still print it at high resolution on the userís local printer, the image must be set up on a simple IMG HTML tag but scale down its size to 96 dpi (which is the most common resolution on screen). So at 96 dpi, that image must be forced to be displayed with this size: 576px (6in * 96) width x 384px (4in * 96) height. In this way, the image will be displayed with a correct size for screen and when printing from the browser, the source image size (1800x1200) and dpi (300) will be taken into account getting high quality printing output.

<IMG src="GenHQBarcode.ashx" width=576 height=384>

That's it. Open the default.aspx page in your favorite browser and you should get something like follows:

View Figure...
The high quality photo with a dynamically generated QR Code from ASP.NET

Here are the source and the generated photo with the QR Code dynamically generated by Neodynamic Barcode Professional for ASP.NET product.

* The Perfect Platform for Game Developers: Android
Developing rich, high performance Android games from the ground up is a daunting task. Intel has provided Android developers with a number of tools that can be leveraged by Android game developers.

* The Best Reasons to Target Windows 8
Learn some of the best reasons why you should seriously consider bringing your Android mobile development expertise to bear on the Windows 8 platform.