Running out of options | Unable to detect QR code similar to the built-in camera app in the phone about react-native-vision-camera

[Dingenis]

hey @neilanthonyte, did you follow the guide on the website regarding QR scanning? From your code I can't see if you pass in the codeScanner into the Camera component.

[neilanthonyte]

hi @Dingenis thanks for the response . . yes I did . . here is the component

const codeScanner = useCodeScanner({
    codeTypes: ['qr', 'ean-13'],
    onCodeScanned: (codes) => {
      onScanFinished({data: codes[0].value});
      onClose();
    }
  })

<Camera 
                  exposure={camera.current ? 1 : 0}
                  ref={camera}
                  focusable={true}
                  codeScanner={codeScanner} 
                  device={device} 
                  format={format}
                  enableDepthData={true}
                  enableHighQualityPhotos={true}
                  pixelFormat='native'
                  style={StyleSheet.absoluteFill}
                  isActive={show} />

[Dingenis]

Mhh weird! Maybe you could use a different QR/barcode to scan? Could be that this specific code doesn't work too well.

[neilanthonyte]

yeah that's what I thought @Dingenis the weird thing is that . . i tried QR code checker and it managed to scan the code and get the value.

the QR code also works when I scan it using the built-in camera app on the phone

[Dingenis]

Mhhh I get that 🤔 Maybe you could check if the QR scanner in your app works at all by just trying to scan a bunch of codes from the internet. That way, you could narrow down the cause.

[neilanthonyte]

hi @Dingenis yes upon testing several QR codes it works with the normal QR code design (white background) . . our current QR code design has black background

. . could that be the reason why the scanner can't detect the QR code? if so do you have an idea as to why the built-in camera app can detect the QR code with black background?

[Dingenis]

hey @neilanthonyte, I am not sure. This library uses Google MLKit for QR/barcodes, maybe it could be related to this: googlesamples/android-vision#62

[xulihang]

There should be a white quiet zone around the QR code or the library may not be able to detect it.

You can also use other advanced barcode reader to read it like this one: https://github.com/tony-xlh/vision-camera-dynamsoft-barcode-reader/

[neilanthonyte]

@Dingenis yep definitely related . . :) thanks so much for the reference.

[neilanthonyte]

@xulihang thank you so much for the response . . I will definitely try your suggestion and post an update here on the result.

[mrousavy]

Hey - I use the MLKit library under the hood. If you enabled it in gradle.properties (as the guide in the docs suggests) and it still doesn't work, there is nothing I can do.

Maybe try using one of the Frame Processor plugins, those are more flexible and might detect more stuff or work in different environemnts - the goal of the CodeScanner is to be a simple easy to use installation.