Ext. Net 1.2.0 _ demonstrate Ext. NET + qrcode encapsulation bar code control

Source: Internet
Author: User
Tags autoload

Content
  • Qrcode Introduction
  • Qrcode data capacity
  • Qrcode corrected capacity
  • Qrcode Application
  • Demonstrate Ext. NET + qrcode encapsulation of two-dimensional bar code control
Qrcode Introduction

A QR code (Quick Response) is a two-dimensional code that can be quickly decoded. It stores more information than normal codes, and does not need to be aligned with the scanner when scanning.

Figure 1: qrcode diagram of version 3

The QR code uses an infrared enhancement camera instead of a linear scanning method, which can directly identify the QR code in the image taken by the camera, thus reducing the reflection angle. The QR code scanner can even identify the bar code displayed on the LCD screen.

The QR code is square and only black and white are available. Three of the four corners are used to help the decoding software locate and scan at any angle, and can be correctly read.

The QR code was invented by Japan's Denso-wave company in 1994 and standardized by ISO in June 2000.

Qrcode data capacity
  • The maximum number is 7,089 bytes.
  • The maximum number of letters is 4,296 bytes.
  • Binary Number (8 bits): a maximum of 2,953 bytes.
  • A Japanese character or katakana can contain a maximum of 1,817 bytes (using shift_jis)
  • Up to 984 Chinese characters (UTF-8), up to 1,800 Chinese characters (big5)
Qrcode corrected capacity
  • L level-7% characters can be corrected
  • M-level-15% characters can be corrected
  • Q-level -- 25% font code can be corrected
  • H-level-30% code can be corrected
Qrcode Application

QR codes were originally designed to facilitate tracking of parts in automobile manufacturing plants, and are now widely used in inventory management in various industries. Users can connect to a scanner or camera to read QR codes through personal computers and decoding programs with RS-232C interfaces.

In recent years, QR codes have become increasingly popular in Japan and South Korea. Mobile phone's built-in QR code decoding software allows more people to understand and use services based on QR codes. China Mobile also launched the offline business of QR codes. In particular, Japanese wine houses, beauty salons, magazines, posters, etc. You can use your own mobile phone to identify QR codes to easily obtain discount information for each store. Then the electronic ticketing field. Generally, a QR code image containing the relevant information is sent to the user's mobile phone via SMS. You only need to take a picture on the QR code identification terminal and the relevant information is read. On April 9, December 2009, Guangzhou airport began to use electronic air tickets. Boarding passes are not required. a qr code text message can be sent to the plane. On July 15, December 10, 2009, the Ministry of Railways adopted QR codes as anti-counterfeiting measures for new tickets.

Demonstrate Ext. NET + qrcode encapsulation two-dimensional bar code control Overview

This document demonstrates how to use Ext. net. Panel and qrcodelib to create a bar code. The encapsulation is as follows:

<C0: myqrcode id = "myqrcode1" Height = "100" width = "100" runat = "server" Title = "business card" customdata = "A: James; B: manager; c: development; D: XX software company; E: Beijing; F: 86000000; G: 15800000000; H: zhangsan@hotmail.com; I: Haidian District; ">
</cc1:MyQRCode>

Where,

  • The myqrcode control is a custom two-dimensional bar code control;
  • The customdata attribute is the string to generate the barcode.

As shown in:

Figure 2: Custom myqrcode Control

Solution Structure

Figure 3: Solution Structure

Program Effect

Figure 4: generate a qrcode for a business card

Figure 5: generate a qrcode

Figure 6: generate a qrcode code for the email

Figure 7: generate a qrcode

Custom myqrcode UI
using System;
using Ext.Net;
using System.ComponentModel;
 
namespace MyExtNet.Control
{
    public partial class MyQRCode
    {
        [DefaultValue("")]
[Description ("data")]
        public string CustomData
        {
            get
            {
                return (string)this.ViewState["CustomData"] ?? "";
            }
            set { this.ViewState["CustomData"] = value; }
        }
 
        public MyQRCode()
        {
            this.AnimCollapse = false;
            this.AutoDataBind = false;
        }
        protected override void OnPreRender(EventArgs e)
        {
            this.AutoLoad.Url = "~/QRCodeHandler.ashx";
            this.AutoLoad.Mode = Ext.Net.LoadMode.IFrame;
            this.AutoLoad.Method = Ext.Net.HttpMethod.GET;
            this.AutoLoad.Params.Add(new Parameter() { Name = "Data", Value = this.CustomData, Mode = Ext.Net.ParameterMode.Value });
        }
    }
}
Custom myqrcode Logic
using System;
using Ext.Net;
using System.Web;
 
namespace MyExtNet.Control
{
    public partial class MyQRCode : Ext.Net.Panel
    {
    }
}
Custom Handler qrcodehandler. ashx
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Services;
using System.Drawing;
using System.Drawing.Imaging;
using System.IO;
using ThoughtWorks.QRCode.Codec;
using System.Text;
 
namespace ExtNetQRCode
{
    /// <summary>
/// $ Codebehindclassname $ abstract description
    /// </summary>
    //[WebService(Namespace = "http://tempuri.org/")]
    //[WebServiceBinding(ConformsTo = WsiProfiles.BasicProfile1_1)]
    public class QRCodeHandler : IHttpHandler
    {
        HttpResponse _response;
        HttpRequest _request;
 
        public void ProcessRequest(HttpContext context)
        {
            _response = context.Response;
            _request = context.Request;
 
            try
            {
                QRCodeEncoder qrCodeEncoder = new QRCodeEncoder();
                qrCodeEncoder.QRCodeEncodeMode = QRCodeEncoder.ENCODE_MODE.BYTE;
                //qrCodeEncoder.QRCodeEncodeMode = QRCodeEncoder.ENCODE_MODE.ALPHA_NUMERIC;
                //qrCodeEncoder.QRCodeEncodeMode = QRCodeEncoder.ENCODE_MODE.NUMERIC;
                qrCodeEncoder.QRCodeScale = 4;
                qrCodeEncoder.QRCodeVersion = 7;
                qrCodeEncoder.QRCodeErrorCorrect = QRCodeEncoder.ERROR_CORRECTION.M;
                //qrCodeEncoder.QRCodeErrorCorrect = QRCodeEncoder.ERROR_CORRECTION.L;
                //qrCodeEncoder.QRCodeErrorCorrect = QRCodeEncoder.ERROR_CORRECTION.Q;
                //qrCodeEncoder.QRCodeErrorCorrect = QRCodeEncoder.ERROR_CORRECTION.H;
                String data = _request.QueryString["Data"].ToString();
                Bitmap bitMap = qrCodeEncoder.Encode(data, Encoding.GetEncoding("UTF-8"));
 
                WriteImageToStream(bitMap);
            }
            catch (Exception ex)
            {
                WriteImageToStream(CreateErrorBitmap(ex.Message));
            }
        }
        private Bitmap CreateErrorBitmap(string errMessage)
        {
            int width = 300;
            int height = 150;
 
            Bitmap errBitmap = new Bitmap(width, height);
 
            Graphics g = Graphics.FromImage(errBitmap);
 
            StringFormat strFormat = new StringFormat();
 
            strFormat.Alignment = StringAlignment.Center;
            strFormat.LineAlignment = StringAlignment.Center;
 
            g.FillRectangle(Brushes.White, 0, 0, width, height);
            g.DrawRectangle(new Pen(Brushes.LightGray, 1), new Rectangle(0, 28, width - 1, height - 33));
 
            strFormat.Alignment = StringAlignment.Center;
            strFormat.LineAlignment = StringAlignment.Near;
            g.DrawString("QRCode Generator Error", new Font("Arial", 10, FontStyle.Bold), Brushes.Red, new Rectangle(0, 5, width, 15), strFormat);
 
            strFormat.Alignment = StringAlignment.Center;
            strFormat.LineAlignment = StringAlignment.Center;
 
            g.DrawString(errMessage, new Font("Arial", 10), Brushes.Red, new Rectangle(8, 28, width - 16, height - 35), strFormat);
 
            return errBitmap;
        }
        private void WriteImageToStream(Bitmap bitMap)
        {
            _response.ClearContent();
            _response.AddHeader("Content-type", "image/jpeg");
            bitMap.Save(_response.OutputStream, ImageFormat.Jpeg);
        }
        public bool IsReusable
        {
            get
            {
                return false;
            }
        }
    }
}
Create page

Take "text message" as the production qrcode as an example. In other cases, it is similar to using keys and values.

<%@ Page Language="C#" %>
 
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<%@ Register Assembly="MyExtNet.Control" Namespace="MyExtNet.Control" TagPrefix="cc1" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <title></title>
 
<SCRIPT runat = "server">
   1:  
   2:         protected void EncodeClick(object sender, DirectEventArgs e)
   3:         {
   4:             string value = null;
   5:             for (int i = 0; i < this.FormPanel_Card.Items.Count; i++)
   6:             {
   7:                 Ext.Net.TextField txt = (Ext.Net.TextField)this.FormPanel_Card.Items[i];
   8:                 value += txt.DataIndex + ":" + txt.Text + ";";
   9:             }
  10:             value += ";";
  11:             this.MyQRCode_Message.CustomData = value;
  12:             this.MyQRCode_Message.Render();
  13:         }
  14:     

</SCRIPT>

 
<body>
    <form id="form1" runat="server">
    <ext:ResourceManager ID="ResourceManager1" runat="server">
    </ext:ResourceManager>
<Ext: Panel id = "panel_card" runat = "server" Title = "SMS" layout = "columnlayout" Height = "150"
        Width="500">
        <Items>
            <ext:FormPanel ID="FormPanel_Card" runat="server" ColumnWidth="0.6" Padding="5">
                <Items>
<Ext: textfield id = "txt_sm" runat = "server" fieldlabel = "mobile phone number" text = "158000000" dataindex = "SM">
                    </ext:TextField>
<Ext: textfield id = "txt_txt" runat = "server" fieldlabel = "content" text = "cnblog" dataindex = "TXT">
                    </ext:TextField>
                </Items>
                <Buttons>
<Ext: button id = "btn_cardqrcode" runat = "server" text = "generate QR code">
                        <DirectEvents>
                            <Click OnEvent="EncodeClick">
                            </Click>
                        </DirectEvents>
                    </ext:Button>
                </Buttons>
            </ext:FormPanel>
            <cc1:MyQRCode ID="MyQRCode_Message" Width="100" Height="150" runat="server">
            </cc1:MyQRCode>
        </Items>
    </ext:Panel>
    </form>
</body>

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.