2. 程式人生 > >phonegap安卓環境下使用BarcodeScanner外掛掃描二維碼

phonegap安卓環境下使用BarcodeScanner外掛掃描二維碼

阿新 • • 發佈：2019-01-15

後記:有網上的朋友說PG到了3.X之後資料夾的規劃有了變化，需要配置的地方也發生了變化，因為之前也為PG3.5版本裝過一次BarcodeScanner外掛，所以現將這些補充到最後面，希望能夠幫到大家。

由於一直在使用phoneGap來開發安卓應用，而對於原生Java小白的我最近這幾天一直陷入瞭如何使用phonegap的BarcodeScanner外掛這件事情上，可以說查遍了百度和Google，雖然只是一個小小的二維碼的功能，但是這裡面還是讓我學到了許多開發安卓應用的內容，一起共勉吧。

首先，告訴大家的是

1、我使用的phonegap版本是2.9.0，當然對於phonegap版本的東西我也不太瞭解，不過可以保證的是phonegap2.0.0之後的按照我這種辦法來實現二維碼是沒有問題的。

2、phonegap的外掛都是放在github上託管的，大家可以Google一下或者到http://www.github.com搜尋下載

下載外掛之後是這樣名字的壓縮包


解壓之後會看到


這裡面最最重要的東西在 src 資料夾中


圖片中劃紅線的檔案可以說是有很多學問在裡面了，我們在開發任何專案的時候都會將一些公用的檔案封裝好，然後就可以在任何地方使用，而這種思想在開發Android應用的時候同樣適用，只不過在Android這裡這種思想有一個名字叫做 Android Library，也就是圖片這個LibraryProject就是已經給我們提供好的一個實現二維碼的Android Library，但是這樣的資料夾我們又不能直接拿來用，我們需要在ADT當中將這個LibraryProject引入到我們的一個公共二維碼專案中去，具體的安裝方法，檢視 

http://www.yelanxiaoyu.com/app/android%E5%BC%80%E5%8F%91/%E5%A6%82%E4%BD%95%E6%B7%BB%E5%8A%A0android-library.html

好了，當你已經將這個LibraryProject加入到專案中去後，結果會是這個樣子的


還是重申一遍，這個叫做CaptureActivity的專案作為一個實現二維碼功能的公共專案存在，我可以在Project1中使用這個CaptureActivity，也可以在Project2中使用這個CaptureActivity，也就是它作為一個公共專案存在，在其他專案中可以隨時使用它。

接下來就開始看我們如何來實現二維碼功能了，首先新建一個專案，比如叫做QRcode


將安卓專案配置成phonegap專案，引入phonegap-x.x.x.jar xml資料夾 phonegap-x.x.x.js，具體的操作步驟可以檢視我的另一篇文章，當然這裡說的有點多餘。

配置完成之後是這個樣子的


START#############################################

然後將CaptureActivity引入，右鍵QRcode專案，看到properties，點選左側Android，右側下面有個add,會看到之前已經引入的CaptureActivity，(isLibrary一定不要點)，點選OK。



將下載下來的資料夾中的這些內容移動到專案目錄中去,看下圖


這個BarcodeScanner.java會報錯，

報錯1: 

將這行程式碼改為 package com.example.qrcode; 即可，也就是

報錯2:

解決辦法很簡單，按住Ctrl+shift + o 就可以將需要的包導進來了,這下就不會有錯誤了。

也差不多接近尾聲了，需要配置一個非常重要的東西，叫做 AndroidManifest.xml,在它的<application>標籤中新增如下程式碼

  1. <!-- ZXing activities -->
  2.     <activityandroid:name="com.google.zxing.client.android.CaptureActivity"
  3.           android:screenOrientation="landscape"
  4.           android:clearTaskOnLaunch="true"
  5.           android:configChanges="orientation|keyboardHidden"
  6.           android:theme="@android:style/Theme.NoTitleBar.Fullscreen"
  7.           android:windowSoftInputMode="stateAlwaysHidden"
  8.           android:exported="false">
  9.   <intent-filter>
  10.     <actionandroid:name="com.phonegap.plugins.barcodescanner.SCAN"/>
  11.     <categoryandroid:name="android.intent.category.DEFAULT"/>
  12.   </intent-filter>
  13. </activity>
  14. <activityandroid:name="com.google.zxing.client.android.encode.EncodeActivity"android:label="@string/share_name">
  15.   <intent-filter>
  16.     <actionandroid:name="com.phonegap.plugins.barcodescanner.ENCODE"/>
  17.     <categoryandroid:name="android.intent.category.DEFAULT"/>
  18.   </intent-filter>
  19. </activity>
  20. <activityandroid:name="com.google.zxing.client.android.HelpActivity"android:label="@string/share_name">
  21.     <intent-filter>
  22.             <actionandroid:name="android.intent.action.VIEW"/>
  23.         <categoryandroid:name="android.intent.category.DEFAULT"/>
  24.     </intent-filter>
  25. </activity>

這裡的配置也就是使用外部CaptureActivity那個公共專案的關鍵，當然還需要在Manifest中寫入許可權，將

  1. <uses-permissionandroid:name="android.permission.CAMERA"/>
  2.     <uses-permissionandroid:name="android.permission.VIBRATE"/>
  3.     <uses-permissionandroid:name="android.permission.ACCESS_COARSE_LOCATION"/>
  4.     <uses-permissionandroid:name="android.permission.ACCESS_FINE_LOCATION"/>
  5.     <uses-permissionandroid:name="android.permission.ACCESS_LOCATION_EXTRA_COMMANDS"/>
  6.     <uses-permissionandroid:name="android.permission.INTERNET"/>
  7.     <uses-permissionandroid:name="android.permission.RECEIVE_SMS"/>
  8.     <uses-permissionandroid:name="android.permission.RECORD_AUDIO"/>
  9.     <uses-permissionandroid:name="android.permission.RECORD_VIDEO"/>
  10.     <uses-permissionandroid:name="android.permission.MODIFY_AUDIO_SETTINGS"/>
  11.     <uses-permissionandroid:name="android.permission.READ_CONTACTS"/>
  12.     <uses-permissionandroid:name="android.permission.WRITE_CONTACTS"/>
  13.     <uses-permissionandroid:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
  14.     <uses-permissionandroid:name="android.permission.ACCESS_NETWORK_STATE"/>
  15.     <uses-permissionandroid:name="android.permission.GET_ACCOUNTS"/>
  16.     <uses-permissionandroid:name="android.permission.BROADCAST_STICKY"/>
  17.     <uses-featureandroid:name="android.hardware.camera"/>
  18.     <uses-featureandroid:name="android.hardware.camera.autofocus"/>

加入到</application>之後

END###############################################

配置res/xml/config.xml檔案，在<plugins>標籤中新增

  1. <plugin name="BarcodeScanner" value="com.example.qrcode.BarcodeScanner"/>    

其中com.example.qrcode也就是，之後的BarcodeScanner也就是那個引入的Java檔案。

START#############################################

具體的配置過程就完成了，接下來需要通過JS來使用了，在assets檔案中有個www資料夾(沒有的建立一下)，將phone-x.x.x.js和 下載下來的資料夾中的barcodescanner.js引入到www資料夾中，實際上下載下來的這個barcodescanner.js是用不了的，我把我的這個JS檔案貼到這裡，可以複製之後然後自己新建一個barcodescanner.js


barcodescanner.js

[javascript] view plaincopy在CODE上檢視程式碼片派生到我的程式碼片
  1. /** 
  2.  * cordova is available under *either* the terms of the modified BSD license *or* the 
  3.  * MIT License (2008). See http://opensource.org/licenses/alphabetical for full text. 
  4.  * 
  5.  * Copyright (c) Matt Kane 2010 
  6.  * Copyright (c) 2011, IBM Corporation 
  7.  */
  8. cordova.define("cordova/plugins/barcodescanner"

    相關推薦

    phonegap安卓環境下使用BarcodeScanner外掛掃描二維碼

    後記:有網上的朋友說PG到了3.X之後資料夾的規劃有了變化，需要配置的地方也發生了變化，因為之前也為PG3.5版本裝過一次BarcodeScanner外掛，所以現將這些補充到最後面，希望能夠幫到大家。 由於一直在使用phoneGap來開發安卓應用，而對於原生Java小白的我最近這幾天一直

    window環境下利用MFC生成二維碼並顯示在對話方塊上

    要達成如題的目的，首先要對以下知識做一些瞭解： 1.MFC建立對話方塊工程以及在對話方塊下的空間操作。 2.MFC載入圖片以及顯示圖片。 3.二維碼的相關知識。 首先，瞭解bmp圖片格式。 BMP格式介紹 BITMAP結構體引數介紹 然後，瞭解什麼是二維碼以及實現過程。 二維碼介

    unity 3D 在安卓環境下使用assetbundle打包Image中shader丟失問題

    最近經常做一些2D專案，因為畫面很重要，所以加了很多特效。有時候我們已經把所需要的shader新增至editor-project setting -graphics-always included shaders ，用assetbundle打包之後還是會丟失。今天找到處理方法

    Unity在安卓環境下通過adb列印語句

    Unity除錯的時候，有的時候需要在安卓手機上進行真機除錯，我們可以把應用直接安裝在手機上，然後連著電腦，將列印語句輸出在cmd中。 一，安裝安卓sdk,配置環境變數 在Path中加入兩個地址： D

    Unity 安卓環境下保持裝置螢幕喚醒

    我們都知道在遊戲中都應該有保持螢幕喚醒這一功能，不然你的遊戲在玩家的裝置上難免會出現長時間不操作螢幕自動睡眠，這不論是對玩家而言是一大槽點，對遊戲開發者而言也是一個低階錯誤。 我們知道，在android開發中，只要在配置檔案中加段程式碼就能保證螢幕長時間喚醒，那麼在Unit

    ionic3 掃描二維碼之後，安卓返回，連續觸發兩次

    constructor( public appCtrl: App, public platform: Platform) { this.registBackClick(); }

    Cordova各個外掛使用介紹系列（二）—$cordovaBarcodeScanner掃描二維碼與生成二維碼

    這是一個用來掃描二維碼的cordova外掛，在做專案的時候想實現類似於微信的掃一掃功能，就想到了cordova的$cordovaBarcodeScanner外掛，用很少量的程式碼就可以實現了，下面來看一下具體的實現步驟： 一、掃描二維碼： 1、首先需要有一個簡單

    cordova呼叫相機掃描二維碼外掛及相機外掛

    cordova外掛網址一.掃描二維碼在此說明，cordova打包6.3版本以前的Android是可以的，本人用cordova測試7.0，未成功，以下是6.0的教程1.進入外掛網站搜尋掃描二維碼外掛  BarcodeScanner  找到如圖選項，開啟連線2.開啟頁面中找到如下

    修改基於zxing庫的cordova掃描二維碼外掛BarcodeScan掃碼介面的UI

    最近在做一些混合式的APP開發，主要用到了ionic+cordova兩個框架。關於混合式APP和ionic和cordova就是用開發web的一套東西開發APP應用，就不多說這些了，這不是這篇文章的重點，感興趣的同學可以自己瞭解一下。現在在團隊中主要負責一些cor

    掃描二維碼自動識別手機APP下載地址

    新浪 推廣 amp 需要 android 通過 來源 中文版 blog 原文地址https://www.baidufe.com/item/92457b4d0bfde1effa40.html 移動互聯網發展迅速，各種APP的開發都太瘋狂了，一般稍大點兒的應用，都會準備多個版本

    微信掃描二維碼登錄網站技術原理

    js對象 hit 適合 ace pass 文件 head src get 微信掃描二維碼登錄網站 網站應用微信登錄開發指南 微信掃描二維碼登錄網站是微信開放平臺下網站應用的一種接口實現的功能。微信開放平臺的網址是 https://open.weixin.qq.com 準

    H5端掃描二維碼

    拍照功能 測試 ima -s 拍照 環境 掃描 背景 navi 一、背景介紹 　　前段時間做了個H5的webapp項目，由於目前所在的公司是做WMS、OMS、TMS相關的物流行業，昨天項目經理提了個需求：能否實現二維碼掃描功能。 　　實現這個功能項目的價格可以加5萬以上，所

    掃描二維碼，有你想要!

    cnblogs mage 掃描 image http blog img ima jpg 掃描二維碼，有你想要!

    android精選源碼，知乎閱讀瀑布流loading彈窗掃描二維碼簡潔的MVP

    android精選源碼 瀑布流 知乎閱讀 loading彈窗 掃描二維碼 Android知乎閱讀與網易音樂功能源碼Android用瀑布流展示美女圖片源碼一個簡潔好看的loading彈窗QRCode 掃描二維碼、掃描條形碼、相冊獲取圖片後識別、生...一個Android 輕量級簡單易用的Lo

    方案優化：網站實現掃描二維碼關註微信公眾號，自動登陸網站並獲取其信息

    用戶 class his onerror 就會 openid display 要點 rac 上一篇 《網站實現掃描二維碼關註微信公眾號，自動登陸網站並獲取其信息》 中已經實現用戶掃碼登陸網站並獲取其信息 但是上一篇方案中存在一個問題，也就是文章末尾指出的可以優化的地方（可

    幾種掃描二維碼工具的User-Agent

    HR iphone 微博 3.3 -a web IE and one 微信： user-agent: Mozilla/5.0 (iPhone; CPU iPhone OS 10_3_3 like Mac OS X) AppleWebKit/603.3.8 (KHTML,

    PC 商城掃描二維碼登錄

    掃碼 新的 eight 技術 ID inf 掃描二維碼 idt height 需求分析: 掃碼入口,在pc登錄首頁新增二維碼登錄入口 點擊掃碼入口顯示二維碼 二維碼有效時間為一分鐘 超時後顯示二維碼失效,點擊刷新後生成新的二維碼 在

    vue中，使用手機釘釘掃描二維碼登錄

    indexof ons 開發 java ava asc dingding erro zepto 最新項目要做一個，使用手機釘釘掃描二維碼登錄pc系統的功能，手機掃碼二維碼後，會彈出一個確定登錄的頁面，點擊確定之後，pc端就會登錄進去 第一步：查看釘釘開發平臺 釘釘開發平

    魅族未開啟相機許可權使用zxing掃描二維碼閃退

    魅族未開啟相機許可權使用zxing掃描二維碼閃退 遇到一個糟心的事，魅族手機未開啟相機許可權，一開啟二維碼掃描頁就閃退，偏偏這個時候，電腦不識別手機，不能除錯，都不知道怎麼回事。型號萬能的公司還有另外一部魅族手機，列印了錯誤日誌。也就是一個空指標異常。 問題找出來了，就是

    掃描二維碼---第三方

    佈局一個button’按鈕 MainActivity package wanghuiqi.bawie.com.qr_code; import android.content.Intent; import android.support.v7.app.AppCompa