我运行一个简单的演示来使用cordova-plugin-qrscanner,它可以扫描qrcode但没有摄像头预览. qrscannerDemo on Github 相关密码打击: import { Component } from '@angular/core';import { NavController } from 'ionic-angu
qrscannerDemo on Github
相关密码打击:
import { Component } from '@angular/core'; import { NavController } from 'ionic-angular'; import { AndroidPermissions } from '@ionic-native/android-permissions'; import { QRScanner, QRScannerStatus } from '@ionic-native/qr-scanner'; @Component({ selector: 'page-home', templateUrl: 'home.html' }) export class HomePage { constructor(public navCtrl: NavController, public androidPermissions: AndroidPermissions, public qrScanner: QRScanner) { } qrscanner() { // Optionally request the permission early this.qrScanner.prepare() .then((status: QRScannerStatus) => { if (status.authorized) { // camera permission was granted alert('authorized'); // start scanning let scanSub = this.qrScanner.scan().subscribe((text: string) => { console.log('Scanned something', text); alert(text); this.qrScanner.hide(); // hide camera preview scanSub.unsubscribe(); // stop scanning }); this.qrScanner.resumePreview(); // show camera preview this.qrScanner.show(); // wait for user to scan something, then the observable callback will be called } else if (status.denied) { alert('denied'); // camera permission was permanently denied // you must use QRScanner.openSettings() method to guide the user to the settings page // then they can grant the permission from there } else { // permission was denied, but not permanently. You can ask for permission again at a later time. alert('else'); } }) .catch((e: any) => { alert('Error is' + e); }); } }
<ion-header> <ion-navbar transparent> <ion-title> Ionic Blank </ion-title> </ion-navbar> </ion-header> <ion-content padding style="background: none transparent;"> <button ion-button (click)="qrscanner()">qrscanner</button> </ion-content>
我在android上运行离子项目,然后单击按钮但没有任何反应,没有相机预览显示.
我再次测试项目并发现它可以扫描qrcode并获得结果测试,但没有相机预览.
我搜索问题,有人说应该设置身体和任何元素透明.我尝试但不起作用.
Android. Nothing appears on screen. #35
AnyOne有帮助吗?
在顶级index.html:<ion-app style="background: none transparent;"></ion-app>
在相机显示页面的html文件中:
<ion-content style="background: none transparent;">