Imaginemos un mundo libre

La paz interior comienza en el momento en el que decides no permitir, que ninguna persona o evento, tome el control de tus emociones.

Android QR Code Scanner – Quick Guide

leave a comment »

In this tutorial, we are going to build a simple Android QR Scanner using ZXing, a well known Open Source library to work with bar and qr codes.

Our small QR Scanner works this way: We call the Barcode Scanner app with an Intent action, it gets the QR Code and send it back to our app.

One problem, is that probably the user doesn’t have the Barcode scanner app installed. In this case our QR Scanner needs to tell this the user and redirect them to Google Play in order to install it.

So, we are going to use ZXing to manage this situation.

1.- Add ZXing to your project.

In particular, we need two Zxing classes, IntentIntegrator and IntentResult. 
Add them easily to your project. In your source directory create another package. Right click and select New -> Package. Let’s call it com.google.zxing.integration.android  and save the classes.  You can find the code here.

Then, in our activity code, we just need to import these classes:

import com.google.zxing.integration.android.IntentIntegrator;
import com.google.zxing.integration.android.IntentResult;

Once, we have add ZXing to our project, we can start working on our app.

2.- Create the layout.

We need a Button to call the Barcode Scanner app and a TextView to see the qr code content scanned.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    android:paddingBottom="@dimen/activity_vertical_margin"
    tools:context="com.qr.scanner.MainActivity">

    <Button
        android:id="@+id/button_get_qr_code"
        android:layout_centerHorizontal="true"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/get_qr_code" />

    <TextView
        android:id="@+id/text_view_qr_content"
        android:layout_below="@+id/button_get_qr_code"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

</RelativeLayout>

Obviously, we have a  <string name=”get_qr_code”>Get QR Code</string> in the strings.xml file.

3.- Create the Activity and the scanning code.

Find the layout widgets and create a method with “Get QR Code” logic:

import android.content.Intent;
import android.app.Activity;
import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.widget.Button;
import android.widget.TextView;

...

public class MainActivity extends Activity {
    private static final String TAG = "QR Scanner";
    private Activity mActivity;
    private Button mGetQRButton;
    private TextView mQRCodeTextView;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        mActivity = this;
        mGetQRButton = (Button) findViewById(R.id.button_get_qr_code);
        mQRCodeTextView = (TextView) findViewById(R.id.text_view_qr_content);
        setupButton();
    }

In the setupButton method, create an instant of the IntentIntegrator class and call the initiateScan() method to start scanning.

    private void setupButton() {
        mGetQRButton.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                IntentIntegrator integrator = new IntentIntegrator(mActivity);
                integrator.initiateScan();
            }
        });
    }

4.- Get the Scanning results.

Now, we are going to use the IntentResult class, to get the scanned data and show it in our Activity.

The IntentIntegrator will return this data to the onActivityResult method of the calling activity. Create and instant of the IntentResult class. Call the getContents() method of the scanning result and save the returned data in a string.

Finally, update your textview text with this string. It’s always useful to log what we are getting.

    public void onActivityResult(int requestCode, int resultCode, Intent intent) {
        IntentResult scanResult = IntentIntegrator.parseActivityResult(requestCode, resultCode, intent);
        if (scanResult != null) {
            String scanContent = scanResult.getContents();
            mQRCodeTextView.setText(scanContent);
            Log.d(TAG, "QR Scan Content: " + scanContent);
        }
    }

You can see the full example at my GitHub account:

Written by Ronny Yabar

January 24, 2014 at 12:05 pm

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: