🐛 VisionCamera component displayed previous screen's view

[kofkgoing]

What were you trying to do?

I want to replace react-native-camera with react-native-vision-camera.
I am almost done. but I've got one weird problem.

Even if I disabled useFrameProcessor.
I also tried with removing photo={true}, device={device} or setting isActive={true}.

This problem is only for Android.

Reproduceable Code

const Camera = (...) => {
  ...
  return isReady && device ? (
    <VisionCamera
      onInitialized={onInitialized}
      onError={onError}
      device={device}
      isActive={isReady}
      torch={torch}
      zoom={0}
      photo={true}
      style={style}
      frameProcessor: frameProcessor,
      frameProcessorFps: frameProcessorFps ? frameProcessorFps : undefined,
      format: format,
    />
  ) : null
}

QRCodeScanScreen = (...) => {
  <View style={styles.container}>
        <Camera
          isActive={cameraReady}
          deviceType={deviceType}
          style={styles.viewfinder}
          //handleQRCode={this.onRead}
          frameProcessorFps={5}
          torch={flashlight ? 'on' : 'off'} />
   ...
  </View>
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: 'black',
  },
  viewfinder: {
    width: appScreen.width,
    height: appScreen.height,
  },
}

export default Routes = {
  MainScreen,
  QRCodeScanScreen,
}

const MainStack = createStackNavigator(Routes)
const AppNavigator = createDrawerNavigator(
  {
    MainScreen: {
      screen: MainStack,
  },
  mode: 'card',
})

What happened instead?

Camera displayed previous screen's map view for little time.
Map is previous screen(MainScreen).
When I removed Camera from screen, it solved.

vision-camera-bug.mp4

I had to cover camera 1 second after onInitialized with timeout. (My solution...)

Relevant log output

I can't see any logs while running app.

Device

LM-V500N
(Android 11, V500N30c)

VisionCamera Version

2.12.0

Additional information

• I am using Expo
• I have read the Troubleshooting Guide
• I agree to follow this project's Code of Conduct
• I searched for similar issues in this repository and found none.

[mrousavy]

Hey, I'm sorry I don't understand what the problem is.

[hirbod]

@kofkgoing are you using enableFreeze from react-native-screens by any chance?

[2sem]

@kofkgoing are you using enableFreeze from react-native-screens by any chance?

Thanks apply.
There is no enableFreeze in my source.
And even I can see the object moving in MainScreen through QRCodeScanScreen's VisionCamera.
because The object is my location in the map and it is updated every 5 seconds.

I guess this is caused by conflicting with Map Component.
I will check it tomorrow.

[2sem]

Hey, I'm sorry I don't understand what the problem is.

Thanks reply.
I will draw for you later. I don't have time now.

[kofkgoing]

@kofkgoing are you using enableFreeze from react-native-screens by any chance?

I appended Text component on MapView of MainScreen.
But VisionCamera displayed only MapView, not Text.

I guess this is caused by some graphic api issue. (need clear context or clear rect??).
(I tried to use backgroundColor, but backgroundColor style is not working to VisionCamera.)

• This problem is not occurred by react-native-image-crop-picker and react-native-camera.

[mrousavy]

Does this happen on iOS too?

[kofkgoing]

Does this happen on iOS too?

no, iOS doesn't have any problem.

[anagovitsyn]

I have the same problem, on iOS it displays red background for a moment, then camera opens. On android it displays one of the previous screen (previous bottom tab root's stack first screen) for a short time, then camera opens

[mrousavy]

This is weird. Maybe it has something to do with the Layer? What happens if you give the Camera component (and the View root) a backgroundColor of red?

[2sem]

I solved this problem by overlapping a black color view on Camera component for little time(0.5s).

[anagovitsyn]

This is weird. Maybe it has something to do with the Layer? What happens if you give the Camera component (and the View root) a backgroundColor of red?

The same code on android - shows for a moment MapView which was not event previous screen. Note that the problem is again with Map, as shown by the author of this issue. Though this time it's another Map - Yandex MapKit, not Google.

mobizen_20221221_115130.mp4

[zereight]

same problem..

[mrousavy]

Hey! I've rewritten the entire Android codebase of VisionCamera from CameraX to Camera2 in the efforts of ✨ VisionCamera V3.

I just now completed the Camera2 rewrite and I believe the core structure is running, but there might be some edge cases to iron out. Can you try and test the PR #1674 for me to see if you can still reproduce this issue here?

Here's an instruction on how you can test that: #1674 (comment)

If the issue cannot be reproduced with that version/PR anymore, then hoorayy, I fixed it! 🎉
Otherwise please let me know and I'll keep this issue open to keep track of it.

Thank you!