I will not go into some time-waster of a story about how I came to build this app. It was a prerequisite in a bigger project I am still tinkering with from time to time.
What are QR Codes?
No doubt you have seen these all over the place in recent years. Originally, QR (Quick Response) codes were used by car manufacturers to label different car parts, but recently, the smarty-pantses (yes, I am inventing words now) in marketing, have utilised these in adverts, coupons, presentations, flyers, on the backs of endangered pandas (just kidding), and many other things!
This effectively enabled users who own smartphones to access content more quickly than ever before. For example: Back in the day, when most of you young'uns were still way too young to even own a phone, if you saw an add in the paper which offered free pizza after 8 o'clock, you would have to tediously type the phone number in, by using your fingers (I know right? Such an inefficient method!), but with the help of modern technology, all I need to do now is to take my iPhone or Android, point it to a QR Code in the paper (by using an app obviously) and presto! It calls the phone number! Without me typing it in the old-fashioned way. OK, so maybe I overdid it with the sarcasm, but you get the idea, right?
So, if you are interested in more about the codes, hit up good ol' wiki and further your knowledge.
Now then, what was I saying? Oh yes, I will not go into long intros, (oops) hehe...
What I will discuss in this article, is how to build your own QR Code Generator.
The aim here is to get you into prodding at the way different types of data can be portrayed. While this tutorial will not explain what the code behind the ACTUAL qr matrix is, I hope it will get you interested in this sort of thing.
So, without further nonsense, let's review the requirements:
For this tutorial you will need:
- Visual C# 2010
- QR Toolkit found here (It's open source)
- Basic - Intermediate C# knowledge
Step 1 Adding References
- Create a new windows forms project.
- Download the QR Toolkit DLL and drop it into the bin\debug\ folder of your project.
To begin, switch back to Visual C# and click on ''Project'', located in the topmost toolbar and select "Add Reference.."
Then, click on the "Browse" tab and navigate to bin\debug\ and select the "MessagingToolkit.QRCode.dll";
Now it's time to populate our "using" clause. At the bottom of the "using" clause, add:
Step 2 Coding the QR Generation Function
Just after the Form initialization clause, paste in the code below:
private Image QRGen(string input, int qrlevel)
string toenc = input;
MessagingToolkit.QRCode.Codec.QRCodeEncoder qe = new MessagingToolkit.QRCode.Codec.QRCodeEncoder();
qe.QRCodeEncodeMode = QRCodeEncoder.ENCODE_MODE.BYTE;
qe.QRCodeErrorCorrect = QRCodeEncoder.ERROR_CORRECTION.L; // - Using LOW for more storage
qe.QRCodeVersion = qrlevel;
System.Drawing.Bitmap bm = qe.Encode(toenc);
Line 1 - Declaration of our function. private Image (will return an image after processing), (string input,int qrlevel) - required input, a text that it will encode and the level of encoding.
Line 2 - Creation of a new instance of the QR encoder.
Line 3 - Setting the encode mode to byte.
Line 4 - Setting Error Correction.
Line 5 - Setting version to reflect level entered.
Line 6 - Setting the encoded picture to be placed in a new bitmap instance.
Line 7 - Return the bitmap instance.
Two things you need to REALLY pay attention to:
One: Error correction—Simply put, the higher the error correction level, the lower storage capacity you get. Using a high correction level, you will be able to embed a logo in the middle of the code (with a caveat) and still get a correct read!
Two: QRLevel—This governs how many alphanumeric characters you can enter in a code. The more characters, the bigger the output image. The levels are from 1-40, ranging from 17 to 7,089 alphanumeric characters in length (subject to correction level). Now that this is done, let's head to step 3.
Step 3 Layout
OK, this will differ due to everyone's own style of doing things. Effectively, the function I gave you above will do 99% of what the app should do. The other 1% is the additional controls I have put in place for my own spin of the app. So if you are content and confident with leaving us here and going to test it out, please do. Otherwise, read on.
Here is my current LAYOUT;
Components to note (for code purposes):
Step 4 The Rest of the App
OK and now the rest of my code (explanations in // comments):
private void button3_Click(object sender, EventArgs e)
qr_pic.Image = QRGen(qrtext.Text, Convert.ToInt32(qrlev.Text));
//will generate the qr code, based on the contents of qrtext and qrlev text (converted to INTEGER) and put it into the picturebox - qr_pic.
private void button2_Click(object sender, EventArgs e)
qr_pic.Image.Save(Application.StartupPath+@"\Code_" + DateTime.Now.ToString("d_MM_yy_HH_mm_ss") + ".png");
//Will save the generated qr code, to the same directory as your qr code app's exe file, and will name it
// CODE_[datestamp:timestamp].png (useful if you do a few in a row since it will not overwrite the codes unless you generate them
// in intervals of less than a second.
private void qrlev_SelectedIndexChanged(object sender, EventArgs e)
int caseSwitch = Convert.ToInt32(qrlev.Text);
qrtext.MaxLength = 17;
qrtext.MaxLength = 32;
qrtext.MaxLength = 53;
qrtext.MaxLength = 78;
qrtext.MaxLength = 108;
qrtext.MaxLength = 134;
qrtext.MaxLength = 154;
qrtext.MaxLength = 192;
qrtext.MaxLength = 230;
qrtext.MaxLength = 271;
qrtext.MaxLength = 321;
qrtext.MaxLength = 367;
qrtext.MaxLength = 425;
qrtext.MaxLength = 458;
qrtext.MaxLength = 520;
qrtext.MaxLength = 586;
qrtext.MaxLength = 644;
qrtext.MaxLength = 718;
qrtext.MaxLength = 792;
qrtext.MaxLength = 858;
tlen.Text = qrtext.MaxLength.ToString();
// This function will, depending on what you select in the dropdown, limit the maximum length
//of the main text box, so your code corresponds to the level you selected.
// This ensures you CANNOT enter, for example, more than 17 characters for level 1 at low error correction (which is the max).
And that is it. You are done.
Your very own QR Code generator! YAY!
But, why the "part one" at the top? Because next time, I will go through superimposing your logo into the QR image on generation so your QRCodes will stand out.
Step 5 Source Code
My Zipped Source (Includes QR Toolkit DLL).
Enjoy! And don't label your pets!