qr code - Ionic cordova-plugin-qrscanner has no camera preview -
i run simple demo use cordova-plugin-qrscanner, can scan qrcode no camera preview.
related code blow:
import { component } '@angular/core'; import { navcontroller } 'ionic-angular'; import { androidpermissions } '@ionic-native/android-permissions'; import { qrscanner, qrscannerstatus } '@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 permission this.qrscanner.prepare() .then((status: qrscannerstatus) => { if (status.authorized) { // camera permission 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 user scan something, observable callback called } else if (status.denied) { alert('denied'); // camera permission permanently denied // must use qrscanner.opensettings() method guide user settings page // can grant permission there } else { // permission denied, not permanently. can ask permission again @ 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>
run ionic project on android click button nothing happened , no camera preview show.
i test project again , find can scan qrcode , result test, no camera preview.
i search problem, says should set body , elements transparent. try not work.
android. nothing appears on screen. #35
anyone help?
in top level index.html:
<ion-app style="background: none transparent;"></ion-app>
in camera display page html file:
<ion-content style="background: none transparent;">
Comments
Post a Comment