search

capacitor-community / barcode-scanner

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

Scanner on dark mode not working #154

Closed cristiantorres91 closed 2 years ago

cristiantorres91 commented 2 years ago

If in android I have the dark mode active when I activate the scanner the screen is black

thegnuu commented 2 years ago

This is most certainly not an issue caused by the plugin. Ionic adds a css variables (--ion-background or something) which sets a background that will prevent the camera view from being visible... Please check your DOM tree and verify that all backgrounds are transparent.

If you are using another framework I need a repo to reproduce your issue, otherwise it will be really hard for me to help you.

marcos-iov42 commented 2 years ago

Same issue on iOS. Since this dark mode is enabled out of the box at least on Ionic 6, I believe this library should take that into consideration and make it work when BarcodeScanner.hideBackground(); is called.

thegnuu commented 2 years ago

I don't think so. This is a capacitor plugin, not an ionic plugin. It can be used with every possible js framework/lib on top of it, even if capacitor is built/maintained by the ionic team and they use it as default.

So adding framework specific code should not be part of the plugin itself and should be handled by every dev the way they need it, the same way they have to build the ui the way they want.

We just updated the readme for issues like this, but adding code only useful for some frameworks should not be done. Especially since this css stuff can easily be changed (even without the need of breaking changes) within those frameworks, wich would add some sort of dependencies which are not required for the plugin itself.

marcos-iov42 commented 2 years ago

Understood. Fair enough, I guess anyway it's as easy as doing: document.body.style.background = 'transparent';

Thank you very much.

thegnuu commented 2 years ago

You are right, it's not a hard task to do - as long as you know what the cause of the issue is.

The only "problem" I have with adding it to the plugin itself is that we basically need to double-check everything on every ionic release, wich is completely outside of the capacitor release cycle. This is kind of an overhead for an easily solvable problem, especially since you cannot use this plugin out of the box anyways because of the missing UI. But it would absolutely make sense to write some better "getting started" especially for ionic. The docs are not perfect by any means at the moment, I think I have to rewrite the whole thing in the upcoming days to clear some things.

cristiantorres91 commented 2 years ago

This is most certainly not an issue caused by the plugin. Ionic adds a css variables (--ion-background or something) which sets a background that will prevent the camera view from being visible... Please check your DOM tree and verify that all backgrounds are transparent.

If you are using another framework I need a repo to reproduce your issue, otherwise it will be really hard for me to help you.

I understand thanks

thegnuu commented 2 years ago

Guys I added this to the readme, this should help in the future for this issue :)

https://github.com/capacitor-community/barcode-scanner#ionic-css-variables