Membuat QR Code Reader Sederhana pada Android (End)

Last Updated on 12 years by Mas Herdi

Untuk tutorial membuat QR Code Scanner yang lebih mudah, klik link ini.

Oke, kali ini saya akan melanjutkan tutorial membuat QRCode Scanner sederhana pada Android. Langsung saja, pada postingan yang pertama kemarin kita sudah menyiapkan library yang akan digunakan. Sekarang kita akan membuat aplikasi QRCode scannernya.

Pre Requisites

• Membuat QRCode Scanner sederhana pada Android bag. pertama

The Code

Aplikasi ini akan mempunyai dua buah Activity Class, yaitu MainActivity dan QRScanner Activity. MainActivity hanya berisi nama program dan sebuah tombol, sedangkan QRScanner-lah yang melakukan proses pemindaian QRCode.

Pertama-tama kita akan membuat dahulu layout untuk MainActivity, yang bernama MainActivity.xml. Beginilah kodenya :

<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"
    tools:context=".MainActivity"
    android:background="@drawable/background"
    >

    <TextView
        android:id="@+id/labelText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="185dp"
        android:text="QR Code Scanner"
        android:textSize="25sp"
        android:textColor="#0044ff"
        />
    <TextView
        android:id="@+id/labelCopy"
        android:layout_centerHorizontal="true"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/labelText"
        android:text="by : twoh.co"
        android:textSize="15sp"
        android:textColor="#444444"
        />
    <Button
        android:id="@+id/buttonStart"
        android:layout_centerHorizontal="true"
        android:layout_below="@id/labelCopy"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="mulai"
        />

</RelativeLayout>

Layout tersebut menggunakan RelativeLayout dan hanya mempunyai satu tombol. Quite simple. Setelah itu, buka file MainActivity.java dan masukkan kode berikut :

package id.web.twoh.qrproject;

import android.os.Bundle;
import android.app.Activity;
import android.content.Intent;
import android.view.Menu;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.Button;

public class MainActivity extends Activity implements OnClickListener{

	Button startButton;

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		startButton = (Button) findViewById(R.id.buttonStart);
		startButton.setOnClickListener(this);
	}

	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		getMenuInflater().inflate(R.menu.activity_main, menu);
		return true;
	}

	@Override
	public void onClick(View v) {
		switch(v.getId())
		{
			case R.id.buttonStart : Intent i = new Intent(this, QRScanner.class);
									startActivity(i);
		}
	}

}

Apabila ada error, biarkan dahulu untuk sementara 😀 File MainActivity.java berfungsi untuk menampilkan layout yang tadi kita buat dan menghubungkan tombol dengan Activity kedua, yaitu QRScanner Activity.

Buatlah file baru bernama QRScanner.java dan copy paste kan kode berikut :

package id.web.twoh.qrproject;

import android.app.Activity;
import android.app.AlertDialog;
import android.content.DialogInterface;
import android.content.DialogInterface.OnClickListener;
import android.content.Intent;
import android.os.Bundle;
import android.view.Window;

import com.example.BarcodeTest.IntentIntegrator;
import com.example.BarcodeTest.IntentResult;

public class QRScanner extends Activity {
    /** Called when the activity is first created. */

	private String upc;
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        //jendela tanpa title
        this.requestWindowFeature(Window.FEATURE_NO_TITLE);
        //memulai pemindaian QRCode
        IntentIntegrator.initiateScan(this);
    }
    // cek hasil dari QRCode
    protected void onActivityResult(int requestCode, int resultCode, Intent data) {
    	switch(requestCode) {
    		case IntentIntegrator.REQUEST_CODE: {
    			if (resultCode != RESULT_CANCELED) {
    				IntentResult scanResult = IntentIntegrator.parseActivityResult(requestCode, resultCode, data);
    				// apabila ada hasil dari pemindaian
    				if (scanResult != null) {
    					// ambil isi dari QRCode
    					upc = scanResult.getContents();
    					//	tampilkan pada Alert Dialog
    					final AlertDialog.Builder builder=new AlertDialog.Builder(QRScanner.this);
						builder.setTitle("Hasil Scan");
						builder.setMessage(upc+"\n");
						builder.setIcon(android.R.drawable.ic_dialog_alert);
						// Tombol untuk simpan data
						builder.setPositiveButton("Simpan", new OnClickListener() {
							@Override
							public void onClick(DialogInterface dialog, int which) {
									// Buat simpan ke database atau ke mana
									// doSomething();
									QRScanner.this.finish();
									IntentIntegrator.initiateScan(QRScanner.this);

							}
						});
						// Tombol untuk coba lagi/keluar
						builder.setNegativeButton("Coba Lagi", new OnClickListener() {
							@Override
							public void onClick(DialogInterface dialog, int which) {
								// TODO Auto-generated method stub
								QRScanner.this.finish();
								IntentIntegrator.initiateScan(QRScanner.this);
							}

						});
						// tampilkan alert box
						builder.show();
    				}
    		break;
    			}
    		}
    	}

    }
}

Yups, itulah kode untuk QRScanner.java, kelas tersebut berfungsi untuk memanggil Barcode Scanner yang nantinya akan melakukan proses scanning QRCode. Apabila ada QRCode yang terdeteksi, maka hasilnya akan dimunculkan melalui Alert Dialog. Dan dari situ ada dua aksi yang bisa kita ambil, apakah ingin menyimpan hasil, atau ingin mencoba scanning lagi.

Yang terakhir adalah file AndroidManifest.xml, jangan lupa untuk mendaftarkan QRScanner sebagai Activity baru, kodenya sebagai berikut :

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="id.web.twoh.qrproject"
    android:versionCode="1"
    android:versionName="1.0" >

    <uses-sdk
        android:minSdkVersion="8"
        android:targetSdkVersion="8" />

    <application
        android:allowBackup="true"
        android:icon="@drawable/ic_launcher"
        android:label="@string/app_name"
        android:theme="@style/AppTheme" >
        <activity
            android:name="id.web.twoh.qrproject.MainActivity"
            android:label="@string/app_name"
            android:theme="@android:style/Theme.NoTitleBar"
            >
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
        <activity
            android:name="id.web.twoh.qrproject.QRScanner"
            android:label="@string/app_name"
            android:theme="@android:style/Theme.NoTitleBar"
            >
		</activity>
    </application>

</manifest>

Demo Aplikasi

Langsung saja untuk demo aplikasinya :

Nampak halaman depan aplikasinya, mantap jaya 😀

Tampilan apabila aplikasi dibuka, klik tombol, maka akan masuk ke bagian pemindaian QR Code. Ini adalah tampilan aplikasi ketika ada data QRCode yang berhasil ditangkap.

Aplikasi mendeteksi adanya QRCode saat Scanning

Dan aplikasi otomatis akan menampilkan alert dialog apabila telah selesai mendeteksi QR Code.

Menampilkan data scan menggunakan Alert Dialog

That’s all. Aplikasi QRCode scanner ini sangat berguna untuk membuat aplikasi kehadiran, atau aplikasi pencatatan inventoris barang. Semoga berguna 🙂

Seperti biasa, tinggalkan komentar apabila masih ada yang kurang dimengerti 😉