teslamotors / react-native-camera-kit

A high performance, easy to use, rock solid camera library for React Native apps.
MIT License
2.42k stars 577 forks source link

The Code Scanner Doesn't always work #623

Closed theprantadutta closed 6 months ago

theprantadutta commented 7 months ago

Describe the bug First of all, Thank you for creating this amazing library, and making our life a lot of easier. I have been trying this project for a while now, and what I have found is that, it works, when it works it's really fast, but it doesn't always work, which is weird, because right now, when I left the office yesterday, it was working perfectly, but now it doesn't, and this is not the first time this happened, I have wasted a lot of hours trying to fix what I was doing wrong only to realize it was not my problem at all, I think there is something wrong with this library internally,

To Reproduce Steps to reproduce the behavior:

  1. The following is my component
    
    interface ICameraScreenProps {
    children?: ReactNode
    navigation: NavigationProp<RootStackParamList, 'camera'>
    }

export const CameraScreen: React.FC = ({navigation}) => { const setScannedCode = useSetRecoilState(scannedQrCodeAtom)

const permission = useRecoilValue(cameraPermissionAtom) const closeCameraScreen = () => { cameraLog.info('Closing Camera Screen...') // TAKES YOU BACK ONE SCREEN // https://reactnavigation.org/docs/stack-actions/#pop navigation.dispatch(StackActions.pop(1)) }

const readQrCode = ( event: NativeSyntheticEvent<{codeStringValue: string}>, ) => { const code = event.nativeEvent.codeStringValue rootLog.info(The Scanned QR Code: ${code}) setScannedCode(code) closeCameraScreen() }

if (!permission) { return <SomethingWentWrong text={'Please Provide Camera Permission'} /> }

return ( <Camera scanBarcode={true} cameraType={CameraType.Back} style={[StyleSheet.absoluteFill, styles.cameraContainer]} onReadCode={readQrCode} showFrame={true} /> ) }

const styles = StyleSheet.create({ cameraContainer: { width: Dimensions.get('window').width, height: Dimensions.get('window').height, justifyContent: 'center', alignContent: 'center', zIndex: 9999, }, })


3. This doesn't throw any errors, it just doesn't scan the qr code at all.

**Expected behavior**
When I open the camera, it shows the frame and animation, and when it works, it's really fast and there is nothing wrong with it, but when it doesn't, it just kills all of my time and I don't know what is going on internally, and I just want to scan a qr code, maybe I am doing something wrong with my code, but what I can't get my head around is the fact that, why does it sometimes work, and why it doesn't in other time.

**Smartphone (please complete the following information):**
 - Device: [Samsung Tab A]
 - OS: [Android 11]

**Additional context**
I want to stress that, maybe it is my fault, but I wouldn't be creating an issue if it's anything wrong with my code, so am I doing anything wrong here, or is there a step I missed? also, why would it work sometimes, and why it wouldn't in other times,
roshikbangali commented 6 months ago

I am facing the same issue. After opening the scanner if I don't scan for the first time, the scanner is not able to detect it from the second time. However, if I scan on the first attempt it scans everything lightning fast. I have gone through each issues but could not find a reliable solution. Anyone here to help ??

theprantadutta commented 6 months ago

@roshikbangali try to find any performance issues in your code, I found out that one of my useEffect is causing some performance issues, also, try to scan the qr code from exactly above the qr code, I found out that works most of the time, otherwise my problems got fixed instantly.

odysseaspapadimas commented 5 months ago

I've noticed the barcode scanning stops working when navigating between Tab.Screens when using @react-navigation/bottom-tabs @roshikbangali Did you end up fixing it?

roshikbangali commented 5 months ago

I've noticed the barcode scanning stops working when navigating between Tab.Screens when using @react-navigation/bottom-tabs @roshikbangali Did you end up fixing it?

Yes, I have ended up fixing it. It is now working well.

odysseaspapadimas commented 5 months ago

I've noticed the barcode scanning stops working when navigating between Tab.Screens when using @react-navigation/bottom-tabs @roshikbangali Did you end up fixing it?

Yes, I have ended up fixing it. It is now working well.

Could you share how you solved it please?

roshikbangali commented 5 months ago

I've noticed the barcode scanning stops working when navigating between Tab.Screens when using @react-navigation/bottom-tabs @roshikbangali Did you end up fixing it?

Yes, I have ended up fixing it. It is now working well.

Could you share how you solved it please?

You have to manually restart the library every time you open that scanner page. So for that I used useFocused from react-navigation-native. When I am focussing on the screen I am calling an useEffect hook and on the useEffect hook I am passing the depedency array as [isFocused] enabling me to load the scanner fresh every time I open the page.

ballad89 commented 3 months ago

@roshikbangali I also experience this issue. Can you please give more clarity as to what you mean by "load the scanner" - is there a method you are calling for this?