Google WindowsPhone 8.1 : Generate QR code with ZXing library (C#-Xaml) | SubramanyamRaju Xamarin & Windows App Dev Tutorials

Tuesday 3 February 2015

WindowsPhone 8.1 : Generate QR code with ZXing library (C#-Xaml)

Introduction:

In WindowsPhone 8.1,The ZXing.Net(0.14.0.1) library provides the IBarcodeWriter interface defined in the ZXing namespace which lets you to generate the barcode. The developers can also define the format of the barcode via the 'Format' property of the BarcodeWriter. The Write method of the BarcodeWriter is used to define the string to be encoded for the barcode.
Note:ZXing.Net library is also available for previous windowsphone os versions(8.0/7.1/7.0)

Requirements:

  • This sample is targeted for windowsphone store 8.1 OS,So make sure you’ve downloaded and installed the Windows Phone 8.1 SDK. For more information, see Get the SDK.
  • I assumes that you’re going to test your app on the Windows Phone emulator. If you want to test your app on a phone, you have to take some additional steps. For more info, see Register your Windows Phone device for development.
  • This post assumes you’re using Microsoft Visual Studio Express 2013 for Windows.

Description:


To generate the QR code in your Windows Phone store 8.1 App using ZXing.Net Library, follow the below steps.
1)Installing Zxing library from Nuget:
Install the  ZXing.Net nuget package into the solution by starting the Package Manager PowerShell by following:
Tools->Library Package Manager->Package Manager console

Once the powershell command prompt is running, type the following command
Install-Package ZXing.Net 
 This will add ZXing library in the current project like below:
2)Generate QR code with ZXing:
Lets add image control in MainPage.xaml,to display generated QR code image

  1. <Page  
  2.     x:Class="QRCodeWP8._1.MainPage"  
  3.     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"  
  4.     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"  
  5.     xmlns:local="using:QRCodeWP8._1"  
  6.     xmlns:d="http://schemas.microsoft.com/expression/blend/2008"  
  7.     xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"  
  8.     mc:Ignorable="d"  
  9.     Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">  
  10.     <Grid>  
  11.         <Image Name="QrCodeImg"/>  
  12.     </Grid>  
  13. </Page>  
In 'OnNavigatedTo' event add following code to generation of the QR code and showing it in the Image control (QrCodeImg).

  1. //Generating barcode with ZXing libary in WP8.1  
  2.  protected override void OnNavigatedTo(NavigationEventArgs e)  
  3.         {  
  4.             IBarcodeWriter writer = new BarcodeWriter  
  5.             {  
  6.                 Format = BarcodeFormat.QR_CODE,//Mentioning type of bar code generation  
  7.                 Options = new ZXing.Common.EncodingOptions  
  8.                 {  
  9.                     Height = 300,  
  10.                     Width = 300  
  11.                 },  
  12.                 Renderer = new ZXing.Rendering.PixelDataRenderer() { Foreground = Colors.Black}//Adding color QR code  
  13.             };  
  14.             var result = writer.Write("http://www.bsubramanyamraju.blogspot.com ");  
  15.             var wb = result.ToBitmap() as WriteableBitmap;  
  16.             //Displaying QRCode Image  
  17.             QrCodeImg.Source = wb;  
  18.         }  
In above code ,i am trying to generate QR code for my blog link 'http://www.bsubramanyamraju.blogspot.com'
We can also add color for QR code like this:


  1. Renderer = new ZXing.Rendering.PixelDataRenderer() { Foreground = Colors.RosyBrown }//Adding color QR code    



3)Output:
Press 'F5' to launch the Application and you should see the QR code generated and displayed in the image control.
4)Scanning generated QR code:
In your Windows Phone 8/8.1 physical device, tap the search hardware button to open the Bing search and then tap the Vision Icon in the Application Bar and then bring the focus to the generated barcode which should identify the string within the barcode as shown below.

If you tap on link founded from the scanner,it will redirect to specified website.

Source code is available from here.

Summary:
From this article we have learned "How to generate QR code with ZXing library in WIndowsPhone store 8.1".

FeedBack Note:
Please share your thoughts,what you think about this post,Is this post really helpful for you?I always welcome if you drop comments on this post and it would be impressive.

Follow me always at  
Have a nice day by  :)

7 comments:

  1. Hi Subbu,

    Can you please tell how to scan a Barcode using ZXing library.?

    Thanks

    ReplyDelete
  2. Can you please show how to scan and generate QR code in WP8 SDK (VS2012 express).
    Thanks in advance.

    ReplyDelete
  3. What Formats can this output? 128?
    Also, can the barcode be saved locally as an image?
    Thanks.

    ReplyDelete
  4. Hello, I'm searching for the oposite, read a QR Code with ZXing using windows phone 8.1.
    Can you do a tutorial about that?
    Thanks

    ReplyDelete
  5. It telling me that it cant create an instance of the abstract class

    ReplyDelete
  6. Hi, I get this error:
    Cannot implicitly convert type 'Windows.UI.Color' to 'ZXing.Rendering.PixelDataRenderer.Color'.
    Can you suggest some solution?
    Thanks

    ReplyDelete
  7. hi,
    You can use this example code for other colors

    Renderer = new PixelDataRenderer
    {
    Background = new PixelDataRenderer.Color(Color.Yellow.ToArgb()),
    Foreground = new PixelDataRenderer.Color(Color.Blue.ToArgb()),
    }

    ReplyDelete

Search Engine Submission - AddMe