Barcode scanning is a common functionality in many mobile applications. From checking attendees into an event and opening web pages to creating a conference scavenger hunt, there are plenty of use cases. ZXing.NET Mobile (Zebra crossing) is an open source library that makes scanning barcodes as effortless and painless as possible in your Xamarin and Xamarin.Forms applications.
Getting Started
ZXing.Net Mobile is available for your traditional Xamarin applications as both a component and a NuGet package that can be installed in your iOS, Android, Windows, and PCL projects. For this post I’m going go focus on the new ZXing.Net package enhanced for Xamarin.Forms. This is a special component and NuGet package that can easily be installed in your Xamarin.Forms projects that adds all the great functionality from the original library, but integrates deeply into Xamarin.Forms by allowing you to customize Xamarin.Forms pages with an embedded scanner. Ensure that you add the package or NuGet to all of your projects to get started.
Create a Scanner Page
You are able to get barcode scanning in your application with as little as two lines of code. First, create a new ZXingScannerPage and then push the page onto the navigation stack:
var scanPage = new ZXingScannerPage (); // Navigate to our scanner page await Navigation.PushAsync (scanPage);
This will bring up the barcode scanner and put it into scanner mode immediately.
Checking results
Of course, you’ll want to check the results of what was actually being scanned. You can do this when the OnScanResult event is fired to stop scanning, pop the scanner page, and check the result:
scanPage.OnScanResult += (result) => { // Stop scanning scanPage.IsScanning = false; // Pop the page and show the result Device.BeginInvokeOnMainThread (async () => { await Navigation.PopAsync (); await DisplayAlert("Scanned Barcode", result.Text, "OK"); }); };
Handling Permissions
On Android ZXing.Net requires the Camera and Flashlight permission to function, so you’ll need to check these permissions in the project settings or add them to your Android Manifest:
When Android Marshmallow was released it added new runtime permissions when apps need to use features such as the camera or geolocation, similar to iOS. ZXing.Net will handle the runtime permissions in your app automatically by simply adding the following code to your MainActivity.cs:
public override void OnRequestPermissionsResult(int requestCode, string[] permissions, Permission[] grantResults) { global::ZXing.Net.Mobile.Forms.Android.PermissionsHandler.OnRequestPermissionsResult (requestCode, permissions, grantResults); }
On Windows apps you’ll need to ensure that you select the Webcam permission. On iOS, ZXing handles everything.
Customization
There are several ways to customize the scanner pages. The easiest thing to do is to simply set additional properties on the default scanner page and pass it scanning options. This will allow you to customize the text on the page, but also adjust things such as scanning speed, types, and rotation:
//setup options var options = new MobileBarcodeScanningOptions { AutoRotate = false, UseFrontCameraIfAvailable = true, TryHarder = true, PossibleFormats = new List { ZXing.BarcodeFormat.Ean8, ZXing.BarcodeFormat.Ean13 } }; //add options and customize page scanPage = new ZXingScannerPage(options) { DefaultOverlayTopText = "Align the barcode within the frame", DefaultOverlayBottomText = string.Empty, DefaultOverlayShowFlashButton = true };
Learn More
This is just a sample of everything that ZXing.Net Mobile has to offer. You can continue to customize with custom overlays and even generate and display your very own Barcode with just a few lines of code. Be sure to read through the ZXing.Net Mobile Getting Started guide to learn more.
Hi James,
I realise this is an old post, but this is the simplest version of ZXing that I found, and I got it to work on Android and iOS. So thanks for that. If anyone reads this, the requirement is to now to install both ZXing Nuget Packages for .Mobile and .Mobile.Forms. Other examples I tried to follow were more complex, creating services or separate Xamarin pages which just confused me even more.
I...
Did you find the solution?
based on my understanding,
if you want to delete the ‘await DisplayAlert’ line, you need to add await in your result.Text.
companyDetails.RecordingDeviceID = await result.Text;