bitpay / cordova-plugin-qrscanner

A fast, energy efficient, highly-configurable QR code scanner for Cordova apps and the browser.
MIT License
568 stars 772 forks source link

I used ionic2 installed this plugin can't display camera preview #24

Closed sundraya-app closed 7 years ago

sundraya-app commented 7 years ago

My develop environment

Cordova CLI: 6.2.0 Ionic Framework Version: 2.0.0-beta.10 Ionic CLI Version: 2.0.0-beta.32 Ionic App Lib Version: 2.0.0-beta.18 ios-deploy version: 1.8.6 ios-sim version: 5.0.8 OS: Mac OS X El Capitan Node Version: v4.4.5 Xcode version: Xcode 7.3.1 Build version 7D1014

bitjson commented 7 years ago

Did you make the background of your app transparent? With Ionic's default styling, the <body> element's background will cover the preview. Try inspecting your app with Safari or Chrome developer tools, and confirm you're not covering the preview.

KixS commented 7 years ago

Hi,

I'm having the same issue (but running ionic 1.2.4). I'm not being able to see the preview. The QRscanner.show is firing though with the following status. And it can even scan QRcodes.

authorized : true canChangeCamera : true canEnableLight : true canOpenSettings : true currentCamera : 0 denied : false lightEnabled : false prepared : true previewing : true restricted : false scanning : true showing : true

I don't understand where the preview is generated. Do I need to make everything transparent so I can even see my phone menu ?

bitjson commented 7 years ago

@KixS – the video preview is rendered completely behind the webview (the embedded web browser element where your app is being displayed). You'll need to make your app's background completely transparent to view it.

bitjson commented 7 years ago

@sundraya-app – were you able to get it working in your app?

KixS commented 7 years ago

@bitjson Thanks for the answer !

sundraya-app commented 7 years ago

Thank you for your reply. I try to make app's background transparent,but it doesn't work, I don't why, I have tried different ways,and at least it's still can not display camera preview,but my app installed this plugin can identify the QR code.My English is poor,I hope you can understand it.

bitjson commented 7 years ago

@KixS – glad that helped!

@sundraya-app – very happy to help if I can. Is your app's source code available on GitHub? What device(s) are you testing on?

hottom commented 7 years ago

you need set html and body to transparent.

bitjson commented 7 years ago

Closing this for now, please feel free to reopen if you're still having trouble @sundraya-app!