Hôm trước, mình đã có một bài viết hướng dẫn các bạn viết ứng dụng Scan QR code trong Android sử dụng thư viện Zxing của Google.

Tuy nhiên, sau một thời gian dài sử dụng, mình thấy thư viện Zxing không có thể lấy focus được, và mỗi lần đọc chỉ được một mã QR code hoặc Barcode khác. Nếu các bạn để camera ứng dụng của bạn có nhiều QR code thì ứng dụng sẽ nhận dạng rất lâu, hoặc thậm chí là không đọc được. Chính vì vậy, hôm nay mình sẽ giới thiệu cho các bạn sử dụng thư viện Vision Mobile để scan QR code.

Ứng dụng này chạy trên thư viện Google Services.

[Android] Scan Multiple Barcode (QR code) at same time

Dưới đây là giao diện demo của ứng dụng:

Thư viện ngoài chức năng đọc QR code, còn hỗ trợ đọc các loại barcode sau:

For 1D Bar Codes, these are:

EAN-13
EAN-8
UPC-A
UPC-E
Code-39
Code-93
Code-128
ITF
Codabar

For 2D Bar Codes, these are:

QR Code
Data Matrix
PDF 417

Đầu tiên các bạn cần import thư viện vào file  build.gradle.

dependencies {
        compile('com.github.KingsMentor:MobileVisionBarcodeScanner:v1.2') { transitive = true; }
}

Cấu hình ứng dụng đọc các loại barcode

<attr name="gvb_show_text" format="boolean" />
        <attr name="gvb_draw" format="boolean" />
        <attr name="gvb_multiple" format="boolean" />
        <attr name="gvb_touch" format="boolean" />
        <attr name="gvb_auto_focus" format="boolean" />
        <attr name="gvb_flash" format="boolean" />
        <attr name="gvb_rect_colors" format="reference" />
        <attr name="gvb_code_format" format="enum">
            <enum name="all_format" value="0"></enum>
            <enum name="code_128" value="1"></enum>
            <enum name="code_39" value="2"></enum>
            <enum name="code_93" value="4"></enum>
            <enum name="code_bar" value="8"></enum>
            <enum name="data_matrix" value="16"></enum>
            <enum name="ean_13" value="32"></enum>
            <enum name="ean_8" value="64"></enum>
            <enum name="itf" value="128"></enum>
            <enum name="qr_code" value="256"></enum>
            <enum name="upc_a" value="512"></enum>
            <enum name="upc_e" value="1024"></enum>
            <enum name="pdf417" value="2028"></enum>
            <enum name="aztec" value="4029"></enum>

 </attr>

- Tiếp theo, các bạn tạo layout Fragment cho Camera 

<fragment
            android:id="@+id/barcode"
            android:name="com.google.android.gms.samples.vision.barcodereader.BarcodeCapture"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            app:gvb_auto_focus="true"
            app:gvb_code_format="all_format"
            app:gvb_flash="false"
            app:gvb_rect_colors="@array/rect_color" />

- Tiếp theo các bạn tạo file color.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>

    <color name="color_green">#14808d</color>
    <color name="color_brown">#343838</color>
    <color name="color_orange">#f38a32</color>
    <color name="color_blue">#1479b7</color>
    <color name="divider_grey">#e4e4e5</color>

    <array name="rect_color">
        <item>@color/color_blue</item>
        <item>@color/color_brown</item>
        <item>@color/color_green</item>
        <item>@color/divider_grey</item>
        <item>@color/color_orange</item>
    </array>
</resources>

- Cài đặt barcode cho file MainActivity.java

BarcodeCapture barcodeCapture = (BarcodeCapture) getSupportFragmentManager().findFragmentById(barcode);
barcodeCapture.setRetrieval(this);

public class MainActivity extends AppCompatActivity implements BarcodeRetriever {

...


    // for one time scan
  @Override
    public void onRetrieved(final Barcode barcode) {
        Log.d(TAG, "Barcode read: " + barcode.displayValue);
        runOnUiThread(new Runnable() {
            @Override
            public void run() {
                AlertDialog.Builder builder = new AlertDialog.Builder(MainActivity.this)
                        .setTitle("code retrieved")
                        .setMessage(barcode.displayValue);
                builder.show();
            }
        });


    }

    // for multiple callback
    @Override
    public void onRetrievedMultiple(final Barcode closetToClick, final List<BarcodeGraphic> barcodeGraphics) {
        runOnUiThread(new Runnable() {
            @Override
            public void run() {
                String message = "Code selected : " + closetToClick.displayValue + "\n\nother " +
                        "codes in frame include : \n";
                for (int index = 0; index < barcodeGraphics.size(); index++) {
                    Barcode barcode = barcodeGraphics.get(index).getBarcode();
                    message += (index + 1) + ". " + barcode.displayValue + "\n";
                }
                AlertDialog.Builder builder = new AlertDialog.Builder(MainActivity.this)
                        .setTitle("code retrieved")
                        .setMessage(message);
                builder.show();
            }
        });

    }

    @Override
    public void onBitmapScanned(SparseArray<Barcode> sparseArray) {
        // when image is scanned and processed
    }

    @Override
    public void onRetrievedFailed(String reason) {
        // in case of failure
    }
}

- Các bạn có thể customize, khi scan qrcode thì hiển thị bitmap, tức là ô vuông nhận dạng QR code với câu lệnh sau

barcodeCapture.setShowDrawRect(true);

+ Do bài viết dài, nên mình chỉ giới thiệu, các bạn có thể download source code ở bên dưới.

DOWNLOAD SOURCE

Nếu thấy bài viết hay, các bạn hãy click like hoặc share để ủng hộ diễn đàn nhé. 

Have fun :)