扫码页面黑屏

1) src -> index.js。修改代码如下

<ion-app style="background: none transparent;"></ion-app>


2)src -> theme -> variables.scss

// qrScannerion-app.cameraView, ion-app.cameraView ion-content, ion-app.cameraView .nav-decor {  background: transparent none !important;  .tabbar.show-tabbar{    opacity: 0;  }}[app-viewport],[overlay-portal],[nav-viewport],[tab-portal],.nav-decor {  display: none !important;  background: none transparent !important;}html,body.transparent-body,.transparent-body,.transparent-body ion-app,.transparent-body .app-root,.transparent-body ion-nav,.transparent-body .ion-page,.transparent-body .nav-decor,.transparent-body ion-content,.transparent-body .viewscan,.transparent-body .fixed-content,.transparent-body .scroll-content {  background-color: transparent !important;  background: transparent none!important;}    

多次扫码后摄像头发热的问题

this.qrScanner.hide(); // hide camerathis.qrScanner.destroy();  // destory camera 

QR Scanner安卓不能扫码条形码问题

此问题乃是编码格式的问题,扩充编码格式即可解决。
解决办法: 全局搜索formatList。找到QRScanner.java文件,定位到458行。

formatList.add(BarcodeFormat.UPC_A);formatList.add(BarcodeFormat.UPC_E);formatList.add(BarcodeFormat.EAN_13);formatList.add(BarcodeFormat.EAN_8);formatList.add(BarcodeFormat.CODE_39);formatList.add(BarcodeFormat.CODE_93);formatList.add(BarcodeFormat.CODE_128);formatList.add(BarcodeFormat.ITF);formatList.add(BarcodeFormat.DATA_MATRIX);


修改源代码后。要重新构建安卓平台

ionic cordova platform remove androidionic cordova platform add android

QR Scanner IOS不能扫码条形码问题

此问题乃是编码格式的问题,扩充编码格式即可解决。
解决办法:全局搜索metadataObjectTypes,找到QRScanner.swift文件,定位到156H

metaOutput!.metadataObjectTypes = [AVMetadataObjectTypeQRCode, AVMetadataObjectTypeEAN13Code, AVMetadataObjectTypeEAN8Code, AVMetadataObjectTypeCode128Code, AVMetadataObjectTypeInterleaved2of5Code]


定位到241H

if [AVMetadataObjectTypeQRCode, AVMetadataObjectTypeEAN13Code, AVMetadataObjectTypeEAN8Code, AVMetadataObjectTypeCode128Code, AVMetadataObjectTypeInterleaved2of5Code].contains(found.type) && found.stringValue != nil {    scanning = false    let pluginResult = CDVPluginResult(status: CDVCommandStatus_OK, messageAs: found.stringValue)    commandDelegate!.send(pluginResult, callbackId: nextScanningCommand?.callbackId!)    nextScanningCommand = nil}

cordova-plugin-crosswalk-webview插件与QR插件冲突,导致黑屏

src -> index.js。修改代码如下

<preference name="CrosswalkAnimatable" value="true" />

第一次进入扫描页面时页面没有透明,第二次正常

把代码放入ionViewDidEnter。当进入页面时触发

ionViewDidEnter() {   (window.document.querySelector('ion-app') as HTMLElement).classList.add('cameraView');         this.isShow = true;         var cs = (window.document.querySelector('ion-app') as HTMLElement).classList.contains('cameraView');        console.log(cs);    }}