3.6.17 gives me a black screen.
3.6.16 works.

When I wrap the Camera component with SafeAreaView then it works (no black screen). Weird.

same here

same here, but then it works when I flip the camera

When I wrap the Camera component with SafeAreaView then it works (no black screen). Weird.

That worked for me too, thanks

I have the same issue, and I found out that when I turn on the flash it somehow refreshes/activates the camera itself and the image from it shows up.

@mrousavy I did some digging, it seems the even though we set the Camera as "isActive" the camera module is showing isActive=false in the logs

Successfully updated CameraSession Configuration! isActive: false

Turning on flash actually refreshes the camera view and removes the black screen to show the preview.

When I wrap the Camera component with SafeAreaView then it works (no black screen). Weird.

I had the same problema on versions 3.6.17 and 3.6.16 as well.

but when I tried. to wrap with SafeAreaView:

<SafeAreaView style={StyleSheet.absoluteFill}>
          <Camera
            ref={ref}
            video
            format={format}
            device={devices}
            isActive={true}
            style={StyleSheet.absoluteFill}
          />
        </SafeAreaView>
        

OBS: without absolutFill the screen turn on White. Weird!

Same issue on 3.6.16
Sometimes it works with no black screen but sometimes it shows black screen
@mrousavy

When I wrap the Camera component with SafeAreaView then it works (no black screen). Weird.

I had the same problema on versions 3.6.17 and 3.6.16 as well.

but when I tried. to wrap with SafeAreaView:

<SafeAreaView style={StyleSheet.absoluteFill}>
          <Camera
            ref={ref}
            video
            format={format}
            device={devices}
            isActive={true}
            style={StyleSheet.absoluteFill}
          />
        </SafeAreaView>
        

OBS: without absolutFill the screen turn on White. Weird!

I am on version 3.5.1 because of the crash issue and this is still a persistent issue.

When I wrap the Camera component with SafeAreaView then it works (no black screen). Weird.

I had the same problema on versions 3.6.17 and 3.6.16 as well.

but when I tried. to wrap with SafeAreaView:

<SafeAreaView style={StyleSheet.absoluteFill}>
          <Camera
            ref={ref}
            video
            format={format}
            device={devices}
            isActive={true}
            style={StyleSheet.absoluteFill}
          />
        </SafeAreaView>
        

OBS: without absolutFill the screen turn on White. Weird!

It seems this also does not work as expected, sometimes it loads the camera and other times its just a black screen

Found a temporary fix for this issue, You need to update line number 42 in CameraConfiguration.Kt to
var isActive: Boolean = true
and line number 208 in CameraView.kt to
config.isActive = true;

This seems to fix the issue for now, not sure if there will be any unintended consequences but seems to be working fine.

Found a temporary fix for this issue, You need to update line number 42 in CameraConfiguration.Kt to var isActive: Boolean = true and line number 208 in CameraView.kt to config.isActive = true;

This seems to fix the issue for now, not sure if there will be any unintended consequences but seems to be working fine.

the config.isActive = true; for me make no sense, bacause config.isActive check isActive && isAttachedToWindow. Changing config.isActive = isActive it's enough. The problem is isAttachedToWindow is changing the state. start with true (correctly) but change for false (this is the reason that works wrappign the code witn "SafeAreaView". I did a PR (#2299) right now to change this line that I said.

Found a temporary fix for this issue, You need to update line number 42 in CameraConfiguration.Kt to var isActive: Boolean = true and line number 208 in CameraView.kt to config.isActive = true;
This seems to fix the issue for now, not sure if there will be any unintended consequences but seems to be working fine.

the config.isActive = true; for me make no sense, bacause config.isActive check isActive && isAttachedToWindow. Changing config.isActive = isActive it's enough. The problem is isAttachedToWindow is changing the state. start with true (correctly) but change for false (this is the reason that works wrappign the code witn "SafeAreaView". I did a PR (#2299) right now to change this line that I said.

Even though this fixes the camera preview, barcode or QR code scanning does not work as code scanner is being turned into null for some reason. I added a temporary fix for it by adding the scanning parameters manually in line number 348 in CameraSession.kt

`// val codeScanner = configuration.codeScanner as? CameraConfiguration.Output.Enabled<CameraConfiguration.CodeScanner>

var scannerOptions : List<CodeType> = listOf(CodeType.CODE_39,CodeType.CODE_128,CodeType.QR,CodeType.EAN_13);
// CodeScanner Output
val codeScanner = CameraConfiguration.Output.Enabled.create(
  CameraConfiguration.CodeScanner(scannerOptions)
)`

@android-imdad when I replace from.

// val codeScanner = configuration.codeScanner as? CameraConfiguration.Output.Enabled<CameraConfiguration.CodeScanner>

to

var scannerOptions : List = listOf(CodeType.CODE_39,CodeType.CODE_128,CodeType.QR,CodeType.EAN_13);
// CodeScanner Output
val codeScanner = CameraConfiguration.Output.Enabled.create(
CameraConfiguration.CodeScanner(scannerOptions)
)

getting error

node_modules/react-native-vision-camera/android/src/main/java/com/mrousavy/camera/core/CameraSession.kt: (361, 97): Unresolved reference: CodeType

@android-imdad when I replace from.

// val codeScanner = configuration.codeScanner as? CameraConfiguration.Output.Enabled<CameraConfiguration.CodeScanner>

to

var scannerOptions : List = listOf(CodeType.CODE_39,CodeType.CODE_128,CodeType.QR,CodeType.EAN_13); // CodeScanner Output val codeScanner = CameraConfiguration.Output.Enabled.create( CameraConfiguration.CodeScanner(scannerOptions) )

getting error

node_modules/react-native-vision-camera/android/src/main/java/com/mrousavy/camera/core/CameraSession.kt: (361, 97): Unresolved reference: CodeType

use the following import

import com.mrousavy.camera.types.CodeType

Even after all this the scanner is still crashing, so I switched to react-native-camera-kit (only downside is, I can't get the type of code scanned but works perfectly for my use case

https://github.com/teslamotors/react-native-camera-kit

@M4Tdev solution works for now (using flash as a new isActive flag on Android) for both camera and barcode scanner. I've noticed that I had to set an small delay when setting isActive to true in some android devices.

<Camera
  // all other properties
   isActive={isCameraActive}
   flash={isCameraActive}
   />

I have the flash in a state, when changing the state the camera activates correctly.

                `const [flash, setFlash] = useState('on');
                  ......
                  <Camera fps={25}
                    torch={flash === 'on' ? 'on':'off'}
                    onInitialized={() => setTimeout(()=>setFlash('off'),800)}
                    style={[StyleSheet.absoluteFill, styles.cam]}
                    device={device} 
                    isActive={isActive} 
                    codeScanner={codeScanner} 
                    lowLightBoost={false} />`

Initializing isActive as false and switching it to true a second after the Camera mounts work on my test devices as well:

  const [isActive, setIsActive] = useState(Platform.OS === 'ios')

  useEffect(() => {
    if (Platform.OS === 'ios') {
      return
    }

    if (permissionsGranted && device) {
      const timeout = setTimeout(() => setIsActive(true), 1e3)
      return () => clearTimeout(timeout)
    }

    setIsActive(false)
  }, [device, permissionsGranted])

  return appState === 'active' && isActive

@fontesrp can you share full screen code here. it will help to understand all

@fontesrp can you share full screen code here. it will help to understand all

Something like that. I actually had another issue with the camera on Android, but it was also fixed by setting isActive to true after a short delay.

const [isCameraInitialized, setIsCameraInitialized] = useState(false);
const [isActive, setIsActive] = useState(Platform.OS === 'ios');

const isFocused = useIsFocused();
const isForeground = useIsForeground();

useEffect(() => {
      if (Platform.OS === 'ios') {
          return () => {};
      }

      let timeout: NodeJS.Timeout;

      if (isCameraInitialized) {
          timeout = setTimeout(() => setIsActive(true), 150);
      }

      setIsActive(false);
      return () => {
          clearTimeout(timeout);
      };
  }, [isCameraInitialized]);

const onInitialized = useCallback(() => {
    setIsCameraInitialized(true);
}, []);

<Camera
    ...
    isActive={isActive && isFocused && isForeground && isCameraInitialized}
    onInitialized={onInitialized}
/>

3.5.1 Currently works for me, this is really weird to deal with.

setTimeout solved this issue.
However, since I need to use the camera frequently, 1 second is too annoying...

setTimeout solved this issue.

However, since I need to use the camera frequently, 1 second is too annoying...

You can reduce the timeout to 150ms. This is enough to avoid the problem

When I tested with 500ms on S23, it didn't work, so I restored it to 1 second.

When I tested with 500ms in S23, it didn't work, so I restored it to 1 second.

Try setting a timeout after the camera is initialized (onInitialized() method)

#2291 (comment)

Try setting a timeout after the camera is initialized (onInitialized() method)

#2291 (comment)

When I used onInitialized, solved it. thank you! :).

I tried almost every workaround here and this always appeared on random devices.
I downgraded to the previous version : "react-native-vision-camera": "^3.6.16".

Encountered the same issue where "Camera" doesn't appear to register "isActive," resulting in a black screen.
After almost ripping my only hair strand i saw this thread and downgraded to "3.6.16". Now it works flawlessly again, thank you all. 👍
Downgraded from "3.6.17" to "3.6.16".

Downgraded from "3.6.17" to "3.6.16". It works.

Downgraded from "3.6.17" to "3.6.16" also works.

ping, need hot-fix

phone: Google Pixel 4

Hey! Thanks for reporting this issue.

I've been working the past days on making sure the Camera lifecycle is safely handled and released when needed to make sure this crash doesn't occur anymore.

I just created a PR for this - can you please this to see if that fixes the issue for you? #2339

If this fixes your issue, please consider 💖 sponsoring me on GitHub 💖 to support me / thank me for building VisionCamera and continuously improving it.

If this does not fix your issue, please clone the repo, check out the branch fix/blackscreen (the PR above), run the Example app, reproduce your issue there and share the adb logcat logs with me (upload to pastebin or gist) so I can investigate this further.

Thank you! 🙏

I just wanna add, this is not fixed in the latest 2.x.x version.
I solved this by rerendering camera component by changing key prop on every focus.

I just wanna add, this is not fixed in the latest 2.x.x version.

Yes, because main branch is V3 since almost half a year

@mrousavy I understand, but we just couldn't easily update to the latest version, and we needed solution asap. Maybe someone else is in a similar situation...

@mrousavy , Why we needs SetTimeOut for set camera active , The camera screen remains black , if we do not use settimeout function and not works less than One Second delay , Please Have a look Once .

On 3.8.2 this is still an issue

Hello, not sure if what I am experiencing is realted to this error but I created an app using the example in the readme and got this problem where everything is black except for sources of light like a lightbulb I am adding a screenshot down below. Any idea what could be happening? Here is the code I am using

I want to clarify that my camera is working just fine