capacitor-community / barcode-scanner

A fast and efficient (QR) barcode scanner for Capacitor
MIT License
437 stars 167 forks source link

On the emulator or Device the camera starts, but is not visible, there is a white background on top #280

Open alysterlendira opened 1 year ago

alysterlendira commented 1 year ago

Describe the bug On the emulator or Device the camera starts, but is not visible, there is a white background on top

Screenshots image

Version Ionic v7 Vuejs 3

Smartphone (please complete the following information):

Additional context Add any other context about the problem here.

JanMisker commented 1 year ago

Did you make all DOM elements have a transparent background?

muuvmuuv commented 1 year ago

Same here, iOS and browser works

alysterlendira commented 1 year ago

the development team should add a css class when running the scan to add a z-index. works fine in browser

JanMisker commented 1 year ago

The browser implementation is (very) different from the mobile devices so it's not a good comparision. On mobile the camera preview is behind the webview so make sure that all dom elements have transparent background, including html and body. Use chrome or safari inspector to connect to the device and traverse the dom tree.

nmifzal commented 7 months ago

The browser implementation is (very) different from the mobile devices so it's not a good comparision. On mobile the camera preview is behind the webview so make sure that all dom elements have transparent background, including html and body. Use chrome or safari inspector to connect to the device and traverse the dom tree.

Just added html, body { background-color: transparent !important; } and it works.