🐛 V4 No supported surface combination is found when attaching all use-cases

[Hyperhire]

What's happening?

When i comment the frameProcessor={frameProcessor} in Camera component, camera works fine. But when i include the frameprocessor, below error is coming out.

Reproduceable Code

const device = useCameraDevice(isFrontCamera ? 'front' : 'back');

const frameProcessor = useFrameProcessor(
    frame => {
      'worklet';
      if (!model) return;
      console.log('hello');
    },
    [model],
  );
...
  if (device == null) return <NoCameraErrorView />;

<Camera
              ref={camera}
              style={
                Platform.OS === 'ios' ? styles.cameraIos : styles.cameraAndroid
              }
              device={device}
              format={format}
              onError={onError}
              onStarted={onStarted}
              onStopped={onStopped}
              frameProcessor={frameProcessor}
              isActive={isCameraActive}
              resizeMode="cover"
              pixelFormat="yuv"
              enableHighQualityPhotos
              photo
              enableZoomGesture
            />

Relevant log output

ERROR  [unknown/unknown: No supported surface combination is found for camera device - Id : 0.  May be attempting to bind too many use cases. Existing surfaces: [] New configs: [androidx.camera.core.streamsharing.StreamSharingConfig@d493db8, androidx.camera.core.impl.ImageAnalysisConfig@ffce81b, androidx.camera.core.impl.ImageCaptureConfig@9d3022a]]

Camera Device

[{"formats": [[Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object]], "hardwareLevel": "full", "hasFlash": true, "hasTorch": true, "id": "0", "isMultiCam": false, "maxExposure": 20, "maxZoom": 8, "minExposure": -20, "minFocusDistance": 7.000000066757203, "minZoom": 1, "name": "0 (BACK) androidx.camera.camera2", "neutralZoom": 1, "physicalDevices": ["wide-angle-camera"], "position": "back", "sensorOrientation": "landscape-left", "supportsFocus": true, "supportsLowLightBoost": true, "supportsRawCapture": false}, {"formats": [[Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object]], "hardwareLevel": "limited", "hasFlash": false, "hasTorch": false, "id": "1", "isMultiCam": false, "maxExposure": 20, "maxZoom": 8, "minExposure": -20, "minFocusDistance": 10, "minZoom": 1, "name": "1 (FRONT) androidx.camera.camera2", "neutralZoom": 1, "physicalDevices": ["wide-angle-camera"], "position": "front", "sensorOrientation": "landscape-right", "supportsFocus": true, "supportsLowLightBoost": true, "supportsRawCapture": false}, {"formats": [[Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object]], "hardwareLevel": "limited", "hasFlash": false, "hasTorch": false, "id": "2", "isMultiCam": false, "maxExposure": 20, "maxZoom": 8, "minExposure": -20, "minFocusDistance": 0, "minZoom": 1, "name": "2 (BACK) androidx.camera.camera2", "neutralZoom": 1, "physicalDevices": ["ultra-wide-angle-camera"], "position": "back", "sensorOrientation": "landscape-left", "supportsFocus": true, "supportsLowLightBoost": true, "supportsRawCapture": false}, {"formats": [[Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object], [Object]], "hardwareLevel": "limited", "hasFlash": false, "hasTorch": false, "id": "3", "isMultiCam": false, "maxExposure": 20, "maxZoom": 8, "minExposure": -20, "minFocusDistance": 10, "minZoom": 1, "name": "3 (FRONT) androidx.camera.camera2", "neutralZoom": 1, "physicalDevices": ["wide-angle-camera"], "position": "front", "sensorOrientation": "landscape-right", "supportsFocus": true, "supportsLowLightBoost": true, "supportsRawCapture": false}]

Device

Samsung S20

VisionCamera Version

4.0.0@beta.10

Can you reproduce this issue in the VisionCamera Example app?

Yes, I can reproduce the same issue in the Example app here

Additional information

• [ ] I am using Expo
• [X] I have enabled Frame Processors (react-native-worklets-core)
• [X] I have read the Troubleshooting Guide
• [X] I agree to follow this project's Code of Conduct
• [X] I searched for similar issues in this repository and found none.

[bglgwyng]

I found the same error on another Samsung device SM-A326B.

[mrousavy]

Created a bug report on the CameraX issue tracker here: https://issuetracker.google.com/issues/332427167

[rodgomesc]

happening also on SM-A205G / Android 11

[rodgomesc]

anyone knows if there's a working version before CAMERAX 1.4.0-alpha04 to implement a quick workaround for now?

[mrousavy]

I found a fix will publish soon

[rodgomesc]

@mrousavy any updates on this?, i know you are really busy with other stuffs, i just want to let u know that i can work on that if you give me some context or guide me on the right direction here

[mrousavy]

just fixed this in https://github.com/mrousavy/react-native-vision-camera/commit/adcca77b04290852c2f6f0e0eb61d1494e8e7c68

sorry didn't see your comment earlier, thanks for offering help @rodgomesc ! ❤️

[mrousavy]

Hey - I think this is fixed, closing :)

[rodgomesc]

@mrousavy i can confirm that all errors related to this is gone on sentry after we applied this https://github.com/mrousavy/react-native-vision-camera/commit/adcca77b04290852c2f6f0e0eb61d1494e8e7c68

[mrousavy]

Great to hear 👍

[raslankiwan]

@mrousavy I'm facing the same issue on v4.5.1 when using skia frame processor at the same time with codeScanner on android. They work together perfectly on iOS, but on android I have to disable one of them to make it work. the error is in CameraSession+Configuration.kt when calling bindToLifecycle. The useCases array contains 2 items of typeImageAnalysisConfig so i guess this is the issue. Is there a way to make them work together? If not, is there an alternative to the built in code scanner, that can be called to process the drawable frame of Skia frame processor to detect the codes in it?

[rochfeu]

I have the same issue. I can use both frameProcessor and codeScanner on a Pixel 8 (android 14), however i have a black screen on a Galaxy A35 (android 13) with the error "No supported surface combination is found for camera device".

I had to create a frameProcessor containing 2 worklets (one of which is a code scanner) to make it work.

[DevHyperCoder]

@mrousavy I am on v4.5.3 and I can't use the inbuild codeScanner with the skiaFrameProcessor. I can use them seperately, but not together. It shows the following error:

androidx.camera.core.internal.CameraUseCaseAdapter$CameraException: java.lang.IllegalArgumentException: No supported surface combination is found for camera device - Id : 0.  May be attempting to bind too many use cases. Existing surfaces: [] New configs: [androidx.camera.core.impl.ImageCaptureConfig@a869003, androidx.camera.core.impl.ImageAnalysisConfig@12836a0, androidx.camera.core.impl.ImageAnalysisConfig@e7d3964, androidx.camera.video.impl.VideoCaptureConfig@5708a2b]]

@rochfeu can you please let me know how you created a worklet with the code scanner ?

[levymetal]

It took quite a bit of trial and error, but I was able to get this working by using scanCodes from @mgcrea/vision-camera-barcode-scanner within my own frame processor. Make sure you follow the instructions to install react-native-worklets-core. This can be used without ejecting from an Expo Managed Workflow.

Here's a stripped-down version of what I'm doing:

import {
  Camera,
  useCameraDevice,
  useSkiaFrameProcessor,
} from "react-native-vision-camera";
import { Worklets } from "react-native-worklets-core";
import { Barcode, scanCodes } from "@mgcrea/vision-camera-barcode-scanner";

export function Scanner() {
  const device = useCameraDevice("back");

  const processCodes = Worklets.createRunOnJS((codes: Barcode[]) => {
    for (const code of codes) {
      console.log(code.value);
    }
  });

  const frameProcessor = useSkiaFrameProcessor((frame) => {
    "worklet";
    const codes = scanCodes(frame, { barcodeTypes: ["qr"] });
    processCodes(codes);
    frame.render();
  }, []);

  return device ? (
    <Camera isActive device={device} frameProcessor={frameProcessor} />
  ) : null;
}

[alexstanbury]

 const codes = scanCodes(frame, { barcodeTypes: ["qr"] });

Unfortunately, the coordinates output from @mgcrea/vision-camera-barcode-scanner are incorrect, as they haven't updated the library to handle the latest vision camera changes to do with frame orientation.