1. 程式人生 > >android ZXing 二維碼的實現與demo

android ZXing 二維碼的實現與demo

android 的二維碼實現,現在越來越普遍,每一個app差不多都會擁有自己的二維碼,它就像身份的象徵,

但是如何實現那?下面我為大家詳細的講解一下。

整合二維碼的步驟;

整合預設的二維碼掃描頁面

1.新增依賴

compile 'cn.yipianfengye.android:zxing-library:2.2'
2.在清單檔案中新增許可權
 
<uses-permission android:name="android.permission.CAMERA" />
<uses-permission android:name="android.permission.VIBRATE"
></uses-permission>
<uses-permission android:name="android.permission.FLASHLIGHT" />
<uses-feature android:name="android.hardware.camera" />
<uses-feature android:name="android.hardware.camera.autofocus" /> 不要少新增,否則會報錯; 3.建立一個MyApp,在onCreate()方法中初始化:
     ZXingLibrary.initDisplayOpinion(this);
4.實現二維碼掃描 button1.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { Intent intent = new Intent(MainActivity.this, CaptureActivity.class); startActivityForResult(intent, REQUEST_CODE); } });
5.重寫onActivityResult()接收掃描結果
 if (requestCode == REQUEST_CODE) {
            //處理掃描結果(在介面上顯示)
            if (null != data) {
                Bundle bundle = data.getExtras();
                if (bundle == null) {
                    return;
                }
                if (bundle.getInt(CodeUtils.RESULT_TYPE) == CodeUtils.RESULT_SUCCESS) {
                    String result = bundle.getString(CodeUtils.RESULT_STRING);
                    Toast.makeText(this, "解析結果:" + result, Toast.LENGTH_LONG).show();
                } else if (bundle.getInt(CodeUtils.RESULT_TYPE) == CodeUtils.RESULT_FAILED) {
                    Toast.makeText(MainActivity.this, "解析二維碼失敗", Toast.LENGTH_LONG).show();
                }
            }
        }
 一個簡單的二維碼掃描完成了;

二.還可以自定義樣式;

步驟如下:

  • 在新的Activity中定義Layout佈局檔案
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/activity_second"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <Button
        android:id="@+id/second_button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="取消"
        android:layout_marginTop="20dp"
        android:layout_marginLeft="20dp"
        android:layout_marginRight="20dp"
        android:layout_marginBottom="10dp"
        android:layout_gravity="bottom|center_horizontal"
        />

    <FrameLayout
        android:id="@+id/fl_my_container"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        ></FrameLayout>

</FrameLayout>

啟動id為fl_my_container的FrameLayout就是我們需要替換的掃描元件。

  • 在Activity中執行Fragment的初始化操作
@Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_second);
        /**
         * 執行掃面Fragment的初始化操作
         */
        CaptureFragment captureFragment = new CaptureFragment();
        // 為二維碼掃描介面設定定製化介面
        CodeUtils.setFragmentArgs(captureFragment, R.layout.my_camera);
        
        captureFragment.setAnalyzeCallback(analyzeCallback);
        /**
         * 替換我們的掃描控制元件
         */ getSupportFragmentManager().beginTransaction().replace(R.id.fl_my_container, captureFragment).commit();
    }

其中analyzeCallback是我們定義的掃描回撥函式,其具體的定義:

/**
     * 二維碼解析回撥函式
     */
    CodeUtils.AnalyzeCallback analyzeCallback = new CodeUtils.AnalyzeCallback() {
        @Override
        public void onAnalyzeSuccess(Bitmap mBitmap, String result) {
            Intent resultIntent = new Intent();
            Bundle bundle = new Bundle();
            bundle.putInt(CodeUtils.RESULT_TYPE, CodeUtils.RESULT_SUCCESS);
            bundle.putString(CodeUtils.RESULT_STRING, result);
            resultIntent.putExtras(bundle);
            SecondActivity.this.setResult(RESULT_OK, resultIntent);
            SecondActivity.this.finish();
        }

        @Override
        public void onAnalyzeFailed() {
            Intent resultIntent = new Intent();
            Bundle bundle = new Bundle();
            bundle.putInt(CodeUtils.RESULT_TYPE, CodeUtils.RESULT_FAILED);
            bundle.putString(CodeUtils.RESULT_STRING, "");
            resultIntent.putExtras(bundle);
            SecondActivity.this.setResult(RESULT_OK, resultIntent);
            SecondActivity.this.finish();
        }
    };

你自定義樣式的佈局

my_camera
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >

    <SurfaceView
        android:id="@+id/preview_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        />

    <com.uuzuche.lib_zxing.view.ViewfinderView
        android:id="@+id/viewfinder_view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:inner_width="200dp"
        app:inner_height="200dp"
        app:inner_margintop="150dp"
        app:inner_corner_color="@color/scan_corner_color"
        app:inner_corner_length="30dp"
        app:inner_corner_width="5dp"
        app:inner_scan_bitmap="@drawable/scan_image"
        app:inner_scan_speed="10"
        app:inner_scan_iscircle="false"
        />

</FrameLayout>

可以發現其主要的區別就是在自定義的掃描控制元件中多了幾個自定義的掃描框屬性:

<declare-styleable name="innerrect">
        <attr name="inner_width" format="dimension"/><!-- 控制掃描框的寬度 -->
        <attr name="inner_height" format="dimension"/><!-- 控制掃描框的高度 -->
        <attr name="inner_margintop" format="dimension" /><!-- 控制掃描框距離頂部的距離 -->
        <attr name="inner_corner_color" format="color" /><!-- 控制掃描框四角的顏色 -->
        <attr name="inner_corner_length" format="dimension" /><!-- 控制掃描框四角的長度 -->
        <attr name="inner_corner_width" format="dimension" /><!-- 控制掃描框四角的寬度 -->
        <attr name="inner_scan_bitmap" format="reference" /><!-- 控制掃描圖 -->
        <attr name="inner_scan_speed" format="integer" /><!-- 控制掃描速度 -->
        <attr name="inner_scan_iscircle" format="boolean" /><!-- 控制小圓點是否展示 -->
    </declare-styleable>

在githup上有我已經為大家完成的預設樣式二維碼掃描,如果有想要自定義樣式的,新增我關注,並且評論告訴我。
二維碼整合demo地址: