Android項(xiàng)目實(shí)戰(zhàn)(二十八):使用Zxing實(shí)現(xiàn)二維碼及優(yōu)化實(shí)例
前言:
多年之前接觸過zxing實(shí)現(xiàn)二維碼,沒想到今日項(xiàng)目中再此使用竟然使用的還是zxing,百度之,竟是如此牛的玩意。
當(dāng)然,項(xiàng)目中我們也許只會(huì)用到二維碼的掃描和生成兩個(gè)功能,所以不必下載完整的jar包,使用簡化版的即可,下文可見。
這篇文章講述:
1、如果快速在項(xiàng)目中集成zxing,實(shí)現(xiàn)掃描和生成二維碼功能
2、根據(jù)項(xiàng)目需求去修改源碼實(shí)現(xiàn)我們的要求并進(jìn)行優(yōu)化
一、快速集成zxing二維碼
1、下載庫文件 :http://xiazai.jb51.net/201611/yuanma/ZXingBarCode_jb51.zip ,
下載完成后可以看到:
我們從這些文件中拷貝需要的到自己的項(xiàng)目中,下面開始:
?、?、res 目錄下 : raw文件夾 整個(gè)復(fù)制到個(gè)人項(xiàng)目相對(duì)位置
?、?、res --> values目錄下:ids.xml文件中的內(nèi)容全部復(fù)制到個(gè)人項(xiàng)目相對(duì)位置,個(gè)人項(xiàng)目沒有則直接復(fù)制文件到相對(duì)位置
?、邸es --> values目錄下:colors.xml文件中的內(nèi)容全部復(fù)制到個(gè)人項(xiàng)目的相對(duì)位置
?、?、res --> layout目錄下:camera.xml 布局文件復(fù)制到個(gè)人項(xiàng)目相對(duì)位置
?、荨es --> drawable_mdpi 目錄下:navbar.9.png圖片復(fù)制到個(gè)人項(xiàng)目相對(duì)位置,這張圖片是標(biāo)題欄背景圖片,這里建議先改成navbar.png 不要使用.9圖片
?、蕖ibs目錄下:zxing.jar文件復(fù)制到個(gè)人項(xiàng)目相對(duì)位置,并且右鍵點(diǎn)擊as library
⑦、src --> com目錄下:zxing 文件夾復(fù)制到個(gè)人項(xiàng)目相對(duì)位置 ,會(huì)報(bào)錯(cuò),修改R的目錄結(jié)構(gòu)即可
⑧、AndroidManifest.xml文件中 添加 (二維碼掃描activity,這個(gè)需要后面自己去修改,用于實(shí)現(xiàn)自己的要求)
<activity android:name="com.zxing.activity.CaptureActivity"/>
⑨、AndroidManifest.xml文件中 添加權(quán)限
<uses-permission android:name="android.permission.CAMERA" /> <uses-permission android:name="android.permission.VIBRATE" /> <uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" /> <uses-permission android:name="android.permission.MOUNT_UNMOUNT_FILESYSTEMS" /> <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
2、準(zhǔn)備工作完成了,下面開始寫demo
現(xiàn)在需求是一個(gè)主界面MainActivity.java 里面有兩個(gè)按鈕,分別跳轉(zhuǎn) 生成二維碼界面和 掃描二維碼界面
然后分別開始寫兩個(gè)activity功能的實(shí)現(xiàn):
①、 生成二維碼
先寫布局文件 ,一個(gè)圖片 , 一個(gè)開始生成按鈕 , 一個(gè)輸入框(二維碼需要根據(jù)文本信息生成,沒有文本信息無法生成)
activity_create.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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:orientation="vertical"
tools:context="com.maiji.zxingdemo.CreateActivity">
<ImageView
android:id="@+id/create_img"
android:layout_width="300dp"
android:layout_height="300dp"
android:scaleType="fitXY"
android:layout_gravity="center_horizontal"
/>
<Button
android:id="@+id/create_btn"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:text="開始生成二維碼"
/>
<EditText
android:id="@+id/create_edit"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
activity代碼: 代碼比較簡單 ,不在此解釋了
private ImageView create_img;
private Button create_btn;
private EditText create_edit;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_create);
initView();
initEvent();
}
private void initEvent() {
create_btn.setOnClickListener(this);
}
private void initView() {
create_img = (ImageView) findViewById(R.id.create_img);
create_btn = (Button) findViewById(R.id.create_btn);
create_edit = (EditText) findViewById(R.id.create_edit);
}
@Override
public void onClick(View v) {
switch (v.getId()){
case R.id.create_btn:
String content = "" ;
if (create_edit.getText().toString().equals("")){
Toast.makeText(this,"請(qǐng)輸入二維碼信息",Toast.LENGTH_SHORT).show();
return;
}
content = create_edit.getText().toString();
try {
//生成二維碼圖片,第一個(gè)參數(shù)是二維碼的內(nèi)容,第二個(gè)參數(shù)是正方形圖片的邊長,單位是像素
Bitmap qrcodeBitmap = EncodingHandler.createQRCode(content, 800);
if (qrcodeBitmap!=null) {
create_img.setImageBitmap(qrcodeBitmap);
}else{
Toast.makeText(this,"生成二維碼失敗",Toast.LENGTH_SHORT).show();
}
} catch (Exception e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
break;
}
}
public byte[] Bitmap2Bytes(Bitmap bm) {
ByteArrayOutputStream baos = new ByteArrayOutputStream();
bm.compress(Bitmap.CompressFormat.PNG, 100, baos);
return baos.toByteArray();
}
效果圖:

②、掃描二維碼
這個(gè)就更簡單了,只需要打開一個(gè)zxing提供的activity 然后獲取到掃描得到的字符串即可
看ScanActivity(掃描Activity)的關(guān)鍵代碼
private TextView zxing_content;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_scan);
zxing_content = (TextView) findViewById(R.id.zxing_content);
Intent startScan = new Intent(this,CaptureActivity.class);
startActivityForResult(startScan, 0); //實(shí)際打開了一個(gè)zxing提供給我們的掃描activity,當(dāng)然我們后面會(huì)對(duì)這個(gè)activity進(jìn)行一些優(yōu)化修改
}
/**
* 掃一掃,成功后返回值進(jìn)行判斷
*/
@Override
public void onActivityResult(int requestCode, int resultCode, Intent data) {
super.onActivityResult(requestCode, resultCode, data);
if (resultCode == -1) {
String result = data.getExtras().getString("result");
zxing_content.setText(result); //顯示掃描二維碼得到的數(shù)據(jù)
}
}
布局文件:
<?xml version="1.0" encoding="utf-8"?>
<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="com.maiji.zxingdemo.ScanActivity">
<TextView
android:id="@+id/zxing_content"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:textSize="30sp"
/>
</RelativeLayout>
效果圖:

二、修改源碼,實(shí)現(xiàn)項(xiàng)目的需求
1、修改掃描二維碼的界面
對(duì)應(yīng)的是 zxing-->activity-->CaptureActivity.java ,布局文件為 camera.xml
所以修改界面只需要在 camera.xml文件中修改即可。
無非就是把原來的“CANCEL”取消按鈕去掉,把頂部的標(biāo)題欄換一下。
布局里面有一個(gè) <SurfaceView>控件 用于顯示相機(jī)拍出的畫面預(yù)覽,這里可以根據(jù)需求改是全界面顯示還是顯示局部
<com.zxing.view.ViewfinderView>控件,即掃描框,默認(rèn)的是寬高比1:1.5,實(shí)際需要修改寬高,在下面介紹
2、修改掃描框的寬高
第1步操作做完之后會(huì)發(fā)現(xiàn),我們沒法修改掃描框的寬高。
修改掃描框?qū)捀吆芎唵?,找?zxing-->camera-->CameraManager.java 文件
這里較為頂部的代碼中看到:
private static final int MIN_FRAME_WIDTH = 240; private static final int MIN_FRAME_HEIGHT = 240; private static final int MAX_FRAME_WIDTH = 480; private static final int MAX_FRAME_HEIGHT = 480;
這四個(gè)屬性的值即掃描框的寬高,然后可以根據(jù)需求直接修改,當(dāng)然這個(gè)值在不同分辨率的設(shè)備上寬高不一致 , 有需要的話可以進(jìn)行一下單位轉(zhuǎn)換
public static int Dp2Px( Context context,float dp) {
final float scale = context.getResources().getDisplayMetrics().density;
return (int) (dp * scale + 0.5f);
}
效果圖: 我修改了掃描框的最小最大寬高分別一致,并且載camera.xml布局中刪去了“CANCEL”取消按鈕
3、給掃描框添加文字提示
看一下微信的掃描界面,會(huì)發(fā)現(xiàn)掃描框下面有一段文字提示。 那么我們這里沒有,需要添加
找到zxing-->view-->Viewfinderview.java
這里是自定義掃描框的類
找到代碼:
canvas.drawRect(frame.left + 2, middle - 1, frame.right - 1, middle + 2, paint); Collection<ResultPoint> currentPossible = possibleResultPoints;
在這兩行代碼之間我們畫上文字提示
canvas.drawRect(frame.left + 2, middle - 1, frame.right - 1, middle + 2, paint);
TextPaint textPaint = new TextPaint();
textPaint.setARGB(0xFF, 0xFF, 0xFF,0xFF); //字體顏色
textPaint.setTextSize(32); //字體大小
textPaint.setAntiAlias(true); //設(shè)置抗鋸齒,否則字跡會(huì)很模糊
StaticLayout layout = new StaticLayout("將二維碼放入框內(nèi),即可自動(dòng)掃描",textPaint,
frame.right-frame.left, Layout.Alignment.ALIGN_NORMAL,1.0F,0.0F,true);
canvas.translate(frame.left+5, (float) (frame.bottom + (float)30)); //繪制起始位置
layout.draw(canvas);
Collection<ResultPoint> currentPossible = possibleResultPoints;
然后在看下掃描界面效果圖:

4、解決掃描界面相機(jī)預(yù)覽拉伸變形問題
實(shí)現(xiàn)了上面幾步的優(yōu)化,仔細(xì)的同學(xué)可能會(huì)發(fā)現(xiàn),如果我們給SurfaceView設(shè)置全屏顯示(可以看到的相機(jī)畫面很多),會(huì)發(fā)現(xiàn)相機(jī)拍攝出來的預(yù)覽圖有些拉伸變形
原因:zxing橫屏變豎屏之后,Camera的代碼還是采用的橫屏代碼設(shè)置的參數(shù)
優(yōu)化方法:找到 zxing-->camera--> CameraConfigurationManager.java
initFromCameraParameters方法中,在 Log.d(TAG, "Screen resolution: " + screenResolution);這句之后增加
Point screenResolutionForCamera = new Point();
screenResolutionForCamera.x = screenResolution.x;
screenResolutionForCamera.y = screenResolution.y;
if (screenResolution.x < screenResolution.y) {
screenResolutionForCamera.x = screenResolution.y;
screenResolutionForCamera.y = screenResolution.x;
}
再將cameraResolution = getCameraResolution(parameters, screenResolution);更改為
cameraResolution = getCameraResolution(parameters, screenResolutionForCamera);
完成之后,在進(jìn)行掃描操作,這時(shí)候相機(jī)拍出來的預(yù)覽界面就正常顯示,不再有拉伸變形問題。
至此便給項(xiàng)目引入了一個(gè)可以使用的二維碼模塊功能了。
以上就是本文的全部內(nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
Android編寫Router路由框架實(shí)例過程詳解
為什么要用路由框架,路由框架哪些好處等等,在此就不做解釋2023-04-04
最常用的框架是ARouter,那是不是可以自己寫一個(gè)路由框架呢,不參考ARouter的方式
Android網(wǎng)絡(luò)工具類NetworkUtils詳解
這篇文章主要為大家詳細(xì)介紹了Android網(wǎng)絡(luò)工具類NetworkUtils,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2018-04-04
Android Studio 自定義Debug變量視圖的方法
這篇文章主要介紹了Android Studio 自定義Debug變量視圖的方法,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2018-07-07
ScrollView滾動(dòng)條顏色的設(shè)置方法
ScrollView滾動(dòng)條顏色的設(shè)置方法,需要的朋友可以參考一下2013-06-06
android 應(yīng)用退出時(shí)不播放動(dòng)畫的解決方法
在Android應(yīng)用中,默認(rèn)情況下,當(dāng)用戶點(diǎn)擊返回按鈕退出應(yīng)用時(shí),系統(tǒng)會(huì)為應(yīng)用添加一個(gè)默認(rèn)的退出動(dòng)畫效果,本文將介紹如何在Android應(yīng)用中禁止退出動(dòng)畫的播放,感興趣的朋友一起看看吧2024-05-05
簡單實(shí)現(xiàn)安卓里百度地圖持續(xù)定位
本文主要介紹了在安卓的百度地圖開發(fā)里面簡單實(shí)現(xiàn)持續(xù)定位的方法,具有一定的參考價(jià)值,下面跟著小編一起來看下吧2017-01-01
詳解Android如何實(shí)現(xiàn)自定義的動(dòng)畫曲線
最近在寫動(dòng)畫相關(guān)的篇章,經(jīng)常會(huì)用到 Curve 這個(gè)動(dòng)畫曲線類,那這個(gè)類到底怎么實(shí)現(xiàn)的?如果想自己來一個(gè)自定義的動(dòng)畫曲線該怎么弄?本文將為大家詳細(xì)解答2022-04-04

