ChrisNTR's Blog

Just another developer weblog.

Get Scanning With Google Glass

Since Google Glass has no easy way of fine detailed text entry (when it comes to entering in passwords or for authentication), the recommended way of getting specific data to an application is to use a QR code to send this information. To get this integrated with a Google Glass Xamarin.Android application is very simple, we’ll take full advantage of the ZXing.Net.Mobile barcode scanning library in C# and then use the Google Glass SDK to display the scanned results in our application.

Scanning Example Scanned Example

To help with a File –> New Project –> Google Glass application, take a look at the Xamarin Studio and Visual Studio templates.

Using the ZXing.Net.Mobile library (version 1.4.2 and above) from the component store for simple access to asynchronous scanning of a QR code. To get the ZXing library setup, you’ll also need to include the Android Support Library v4 component.

Next we will want to add the code to tell the app to scan a code, you may want to do this after telling the user that you are going to be scanning a QR code (and give them a hint as to where they can generate a QR code from). The code for this is as follows:

var scanner = new ZXing.Mobile.MobileBarcodeScanner(this);
var result = await scanner.Scan();

Since we’re using await, we’ll need to make our OnCreate method async:

protected override async void OnCreate (Bundle bundle)

And we’re going to be using the Camera, so let’s make sure that we add the Camera permission for that in the “Android Application” project options.

To handle the result, we’ll create a new Card and display the result in there, if the result is not empty.

if (result != null) {
    var card2 = new Card (this);
    card2.SetText (result.Text);
    card2.SetFootnote ("Just scanned!");
    SetContentView (card2.ToView());
}

We’ll also want to keep the screen on whilst we are scanning a QR code so we can use the Window AddFlags/ClearFlags API to do this and when we have scanned the QR code, we can play a success sound. Combining all this, you should get something like the following:

protected override async void OnCreate (Bundle bundle)
{
    base.OnCreate (bundle);

    var card = new Card (this);
    card.SetText ("Welcome to Xamarin Google Glass Development");
    card.SetFootnote ("Let's get hacking!");
    SetContentView (card.ToView ());

    Window.AddFlags (WindowManagerFlags.KeepScreenOn);

    var scanner = new ZXing.Mobile.MobileBarcodeScanner(this);
    var result = await scanner.Scan();

    AudioManager audio = (AudioManager) GetSystemService(Context.AudioService);
    audio.PlaySoundEffect((SoundEffect)Sounds.Success);

    if (result != null) {
        var card2 = new Card (this);
        card2.SetText (result.Text);
        card2.SetFootnote ("Just scanned!");
        SetContentView (card2.ToView());
    }

    Window.ClearFlags (WindowManagerFlags.KeepScreenOn);
}

Now we’ll need a QR code to scan, there’s a few websites that you can generate QR codes from (such as GoQR), but it might be worth generating your own QR codes, Scott Hanselman has a good blog post on this here: http://www.hanselman.com/blog/HowToDisplayAQRCodeInASPNETAndWPF.aspx, as an example, here’s a QR code to scan and get you started:

QR Code Example

Plug in Google Glass, hit run and that’s all there is to it. If you wanted to go further, you can also take advantage of the CustomOverlay support with ZXing to make the UI look a little more Google Glass friendly by adding in a custom layout resource and adding this with the following code:

scanner.UseCustomOverlay = true;
scanner.CustomOverlay = LayoutInflater.Inflate(Resource.Layout.QRScan, null);

which can end up getting a UI that looks a little like this:

QR Scanner Styled

You can find all of the code for this example on my GitHub page for Xamarin Glass QR Scanner.