Post
Ask Question

How To Generate QR Code In ASP.Net Using c#

Introduction

In this blog, we will learn how to generate a QR code using ASP.Net by simply entering Text, numbers, and a combination of both in the textbox and clicking on generate button. I found a very useful library for generating QR code which is IronBarcode. You can install it through the NuGet package. It supports .Net Core, Standard & Framework. It has cross-platform support.

To use this library we will create a demo project in a visual studio. I am creating ASP.Net Web Application using Web Form for that I am going to use the visual studio 2017 version. You can dowload code here and play with that.

Creating a New Project in Visual Studio

Open the Microsoft Visual Studio software and go to the File menu. Select "New Project", and then select "Web Application". In this article, we are going to use a web application to generate QR codes.

Select “Web” from the right panel then select ASP.NET Web Application (.NET Framework). Enter the project name. I am giving GenerateQRCode. You can give anything you wish to, and select the file path in the appropriate text box. I am choosing default. Then, click the “OK” button, as in the screenshot below.

Then select the “Empty” template and check the “Web Form” checkbox from  “Add folders and core reference for” then click on the “OK” button as shown in the below screenshot.

The Microsoft Visual Studio project will now generate the structure for the selected application, and In this example, we are using ASP.Net Web Form So we can add a new item and then choose web from to write the code where you can enter the code and build and run the application. Next, we can add the library to test the code.

How to Install the Barcode Library through NuGet Package Manager

In Visual Studio Select Tools > NuGet Package Manager > Manage NuGet Packages for the solution.

Search for the specific package IronBarcode using the search box on the upper left. Select a package from the list to display its information, enabling the Install button and a version-selection drop-down. As shown below screenshot. The NuGet package will be installed for your project and reference will be added.

Advance barcode creation

We can add the annotation to the QR Code, set theme, set the font, display its value below it, add margins, change the barcode colour, and then save it, all quite simply in C#. We can also choose to export to HTML or PDF instead of an image if that is more appropriate for our application.

// Styling a QR code and adding annotation text
barcode.AddBarcodeValueTextBelowBarcode();
barcode.AddBarcodeValueTextAboveBarcode();
barcode.SetMargins(10);
barcode.ChangeBarCodeColor(Color.BlueViolet);

Design HTML Web From GenerateQRCode

Drag and drop TextBox, Button, and Image control

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="GenerateQRCode.aspx.cs" Inherits="GenerateQRCode.GenerateQRCode" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
   <title></title>
    <link href="lib/bootstrap/css/bootstrap.min.css" rel="stylesheet" />
</head>
<body>
    <form id="form1" runat="server">
        <div class="container">
            <h2>Generate QR Code Using C#</h2>
            <div class="row">
                <div class="col-4">
                    <div class="form-group">
                        <label>Enter a value to generate QR Code:</label>
                        <div class="input-group">
                            <asp:TextBox ID="txtGenerateQRCode" runat="server" CssClass="form-control"></asp:TextBox>
                            <div class="input-group-append">
                                <asp:Button ID="BtnGenerateQRCode" runat="server" Text="Generate QR Code" CssClass="btn btn-primary" OnClick="BtnGenerateQRCode_Click" />
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <asp:Image ID="ImageGeneratedBarcode" runat="server" CssClass="img-thumbnail" Visible="false"/>
        </div>
    </form>
</body>

</html>

Double click or enter Button control.

Write the following code

Add namespace

using IronBarCode;
using System;
using System.Drawing;
using System.IO;

namespace GenerateQRCode
{
    public partial class GenerateQRCode : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            ImageGeneratedBarcode.Visible = false;
        }

        protected void BtnGenerateQRCode_Click(object sender, EventArgs e)
        {
            string generatebarcode = txtGenerateQRCode.Text;
            GeneratedBarcode barcode = QRCodeWriter.CreateQrCode(generatebarcode, 300);

            // Styling a QR code and adding annotation text
            //barcode.AddBarcodeValueTextAboveBarcode();
            barcode.AddBarcodeValueTextBelowBarcode();
            barcode.SetMargins(10);
            barcode.ChangeBarCodeColor(Color.BlueViolet);

            //Create a folder to place generated QR code
            var folder = Server.MapPath("/App_Data/GeneratedQRcodeImage");
            if (!Directory.Exists(folder))
            {
                Directory.CreateDirectory(folder);
            }
            string filePath = Server.MapPath("GeneratedQRcodeImage/QRCode.png");
            barcode.SaveAsPng(filePath);
            ImageGeneratedBarcode.ImageUrl = "~/GeneratedQRcodeImage/" + Path.GetFileName(filePath);
            ImageGeneratedBarcode.Visible = true;
        }

    }
}

Run project ctr+F5

Conclusion

The IronBarcode is also helpful in creating QR code Images, QR code HTML, and QR code PDF format. Using IronBarcode we can create different types of images file like png, jpg, Gif, etc. The code of this tutorial is attached. You can download the code, play with the code and modify it according to your project requirement. Thank you for reading. Happy coding.