Take photo and video with same component react native

Viewed 35

My goal is to be able to take a photo when tapped, and a video when pressed down and held.

Currently, my code takes a photo. But when I try trigger a recording event with onLongPress, I can't seem to get it to work.

Any ideas what I'm doing wrong?

const onLongPressButton = () => {
    setLongPressed(true);
  };

 
  useEffect(() => {
    if (longPressed == true) {
      const startRecord = async () => {
        console.log("RECORDING");
        if (cameraRef.current) {
          setRecording(true);
          const recordedVideo = await cameraRef.current.recordAsync();
          setVideo(recordedVideo);
          setLongPressed(true);
        }
      };
      startRecord();
    }
  }, [longPressed]);

  const stopRecord = async () => {
    setLongPressed(false);

    console.log("STOP RECORDING");
    setRecording(false);
    await cameraRef.current.stopRecording();
  };



  const handlePhoto = async () => {
    console.log("Photo");

    if (cameraRef.current) {
      let photo = await cameraRef.current.takePictureAsync({});
      console.log(photo.uri);
    }
  };

And here is my component:

<Circle
     onPress={handlePhoto}
     onLongPress={onLongPressButton}
     onPressOut={stopRecord}
     delayLongPress={200}
              />
0 Answers
Related