react-native-vision-camera doesn't appears after initialization

Question

react-native-vision-camera doesn't appears after initialization

I was expecting Camera or something like this but screen stucks on Loading

I've tried a lot of things but couldn't solve the problem. Documentation didn't give any of useful information

import { Alert, StyleSheet, View } from "react-native";
import { Camera, useCameraDevices } from "react-native-vision-camera";
import { Loading } from "../components/Loading/Loading";

export const CameraScreen: FC = () => {
  const devices = useCameraDevices();
  const device = devices.back;

  if (device == null) return <Loading />;

  return (
    <View style={style.screen}>
      <Camera
        device={device}
        isActive={true}
        style={StyleSheet.absoluteFill}
      />
    </View>
  );
};

const style = StyleSheet.create({
  screen: {
    flex: 1,
    backgroundColor: "#222",
  },
  camera: {
    flex: 1,
    alignItems: "center",
    justifyContent: "flex-end",
  },
});```

Did you grant the app permission to access the camera? – caslawter Jul 12 '22 at 09:07 — caslawter, Jul 12 '22 at 09:07

score 1 · Answer 1 · answered Jan 31 '23 at 15:09

Put cameraRef on component.

const cameraRef = React.useRef(null);

<Camera
  ref={cameraRef} /* use cameraRef.current.takePhoto(): Promise<dataPhoto> */
  photo={true} /* or video={true} */
  device={device}
  isActive={true}
  style={StyleSheet.absoluteFill}
/>

See oficial docs.

react-native-vision-camera doesn't appears after initialization

1 Answers1