All Telerik .NET tools and Kendo UI JavaScript components in one package. Now enhanced with:
New to Telerik UI for ASP.NET AJAX? Download free 30-day trial
To make the Barcode render QRCode you need to set its Type to "QRCode" . Then you can specify the QRCodeSettings collection of properties that includes the following: ErrorCorrectionLevel - There are four possible values to choose from - L(Low), M(Medium), Q(Quartile), H(High). These values allow for 7%, 15%, 25% and 30% recovery of symbol code words. Additionally, choosing a higher version of error correction dedicates a larger portion of modules for error correction. Thus, given two QR codes with the same sizes, the one with a lower error correction level would be able to accommodate more data. ApplicationIndicator - This property allows for additional data to be applied to the FNC1 data. Please, keep in mind, that this is only applicable with FNC1Mode.FNC1SecondPosition. Additionally, the acceptable data for this property is in the range {a-z}],{[A-Z} and {00-99}. FNC1 - This mode is used for messages containing data formatted either in accordance with the UCC/EAN Application Identifiers standard or in accordance with a specific industry standard previously agreed with AIM International. Mode - There are four values available for this property - Alphanumeric, Numeric, Byte and Kanji. Essentially, this determines the sets of acceptable symbols - numbers, characters, etc. ECI - (Extended Channel Interpretations Encoding) property allows for additional data to be applied to the FNC1 data. Please, keep in mind, that this is only applicable with FNC1Mode.FNC1SecondPosition. Additionally, the acceptable data for this property is in the range {a-z}],{[A-Z} and {00-99}. Do not change the encoding if you plan to decode your barcodes on smartphones. Some readers are working with the default encoding only. Version - This is an integer value, in the range from 1 to 40, representing the version which one desires to use. Usually, higher-version QR codes are used do accommodate larger amounts of data. Setting version to 0 will force the RadBarcode to calculate the version automatically by the length of the text. AutoIncreaseVersion - Set this property to true, and the Version will be automatically increased if the length of the text is more than the limit for the current version. DotSize - Use this to specify size of the barcode dots in pixels. Use this to achieve sharp rendered QR Code. You can use this in combination with Width="" and Height="" and the QR will be sized according to the number of its dots. If you set DotSize to zero, the QR symbol will be resized to fill up the Width and Height.
<%@ Page Language="c#" CodeFile="DefaultCS.aspx.cs" AutoEventWireup="true" Inherits="Telerik.BarcodeExamplesCS.QRCode.DefaultCS" %> <%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %> <%@ Register TagPrefix="qsf" Namespace="Telerik.QuickStart" %> <!DOCTYPE html> <html xmlns='http://www.w3.org/1999/xhtml'> <head runat="server"> <title>Telerik ASP.NET Example</title> <link type="text/css" rel="Stylesheet" href="styles.css" /> </head> <body> <form id="form1" runat="server"> <telerik:RadScriptManager runat="server" ID="RadScriptManager1" /> <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" /> <telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Skin="Metro" /> <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server"> <AjaxSettings> <telerik:AjaxSetting AjaxControlID="ConfigurationPanel1"> <UpdatedControls> <telerik:AjaxUpdatedControl ControlID="Panel1" /> </UpdatedControls> </telerik:AjaxSetting> <telerik:AjaxSetting AjaxControlID="Panel1"> <UpdatedControls> <telerik:AjaxUpdatedControl ControlID="Panel1" /> </UpdatedControls> </telerik:AjaxSetting> </AjaxSettings> </telerik:RadAjaxManager> <asp:Panel ID="Panel1" runat="server" CssClass="demo-container"> <telerik:RadTabStrip RenderMode="Lightweight" ID="RadTabStrip1" runat="server" MultiPageID="RadMultiPage1" SelectedIndex="0" AutoPostBack="true"> <Tabs> <telerik:RadTab Text="URL" Value="url"> </telerik:RadTab> <telerik:RadTab Text="Text" Value="text"> </telerik:RadTab> <telerik:RadTab Text="vCard" Value="vcard"> </telerik:RadTab> <telerik:RadTab Text="Map location" Value="map"> </telerik:RadTab> </Tabs> </telerik:RadTabStrip> <div id="Div1"> <telerik:RadMultiPage ID="RadMultiPage1" runat="server"> <telerik:RadPageView ID="RadPageView1" runat="server" Selected="true"> <telerik:RadTextBox RenderMode="Lightweight" ID="RadTextBoxURL" LabelWidth="40px" Width="400px" runat="server" Label="URL: " /> </telerik:RadPageView> <telerik:RadPageView ID="RadPageView2" runat="server"> <telerik:RadTextBox RenderMode="Lightweight" ID="RadTextBoxText" runat="server" Label="Text: " LabelWidth="40px" TextMode="MultiLine" Width="400px" Rows="3"> </telerik:RadTextBox> <br /> </telerik:RadPageView> <telerik:RadPageView ID="RadPageView3" runat="server"> <telerik:RadTextBox RenderMode="Lightweight" ID="textBoxVCardName" runat="server" Label="Name: " LabelWidth="100px" Width="400px" /> <br /> <telerik:RadTextBox RenderMode="Lightweight" ID="textBoxVCardPhone" runat="server" Label="Phone number: " LabelWidth="100px" Width="400px" /> <br /> <telerik:RadTextBox RenderMode="Lightweight" ID="textBoxVCardEmail" runat="server" Label="Email: " LabelWidth="100px" Width="400px" /> <br /> </telerik:RadPageView> <telerik:RadPageView ID="RadPageView4" runat="server"> <telerik:RadMaskedTextBox RenderMode="Lightweight" ID="RadMaskedTextBoxLatitude" runat="server" Label="Latitude:" LabelWidth="100px" Width="400px" Mask="<-90..90>° <0..59>′ <0..59>.<0..9999>″" Text="42° 25′ 58.2060″"> </telerik:RadMaskedTextBox> <br /> <telerik:RadMaskedTextBox RenderMode="Lightweight" ID="RadMaskedTextBoxLongitude" runat="server" Label="Longitude:" Text="25° 36′ 54.6264″" LabelWidth="100px" Width="400px" Mask="<-90..90>° <0..59>′ <0..59>.<0..9999>″"> </telerik:RadMaskedTextBox> </telerik:RadPageView> </telerik:RadMultiPage> <telerik:RadButton RenderMode="Lightweight" ID="Button1" runat="server" Text="Generate" /> <telerik:RadBarcode runat="server" ID="RadBarcode1" Type="QRCode" Width="400px" Height="405px" OnPreRender="RadBarcode1_PreRender"> <QRCodeSettings AutoIncreaseVersion="true" /> </telerik:RadBarcode> </div> </asp:Panel> <qsf:ConfiguratorPanel runat="server" ID="ConfigurationPanel1"> <Views> <qsf:View> <qsf:ConfiguratorColumn runat="server" Size="Wide"> <ul class="fb-group"> <li> <qsf:DropDownList runat="server" ID="RadComboBoxECL" Size="Medium" Label="Error Correction Level" AutoPostBack="true" EnableViewState="true" ViewStateMode="Enabled"></qsf:DropDownList> <qsf:DropDownList runat="server" ID="RadComboBoxVersion" Size="Narrow" Label="Size Version" AutoPostBack="true" EnableViewState="true" ViewStateMode="Enabled"></qsf:DropDownList> <qsf:DropDownList runat="server" ID="RadComboBoxECI" Size="Wide" Label="ECI Encoding" AutoPostBack="true" EnableViewState="true" ViewStateMode="Enabled"></qsf:DropDownList> </li> <li> <qsf:DropDownList runat="server" ID="RadComboBoxMode" Size="Medium" Label="Code Mode" AutoPostBack="true"></qsf:DropDownList> <qsf:DropDownList runat="server" ID="RadComboBoxDotSize" Size="Narrow" Label="Dot Size" AutoPostBack="true"></qsf:DropDownList> <qsf:DropDownList runat="server" ID="RadComboBoxOutputType" Size="Wide" Label="Output Type" AutoPostBack="true"></qsf:DropDownList> </li> </ul> </qsf:ConfiguratorColumn> </qsf:View> </Views> </qsf:ConfiguratorPanel> </form> </body> </html>