如何使用 react-native-camera 捕获图片

Posted 2023-03-11

【中文标题】如何使用 react-native-camera 捕获图片

【英文标题】：How To Capture Picture using react-native-camera

【发布时间】：2020-10-26 08:19:57

【问题描述】：

我尝试使用 react-native-camera 捕获图像，但失败了， 租用我的代码。

【参考方案1】：

您正在功能组件中访问“this”

类级组件：

takePicture = async () => 
    if (this.camera) 
      const options =  quality: 0.5, base64: true ;
      const data = await this.camera.takePictureAsync(options);
      console.log(data.uri);
    
  ;

<RNCamera
          ref=ref => 
            this.camera = ref;
          
          style=styles.preview
          type=RNCamera.Constants.Type.back
          flashMode=RNCamera.Constants.FlashMode.on
          androidCameraPermissionOptions=
            title: 'Permission to use camera',
            message: 'We need your permission to use your camera',
            buttonPositive: 'Ok',
            buttonNegative: 'Cancel',
          
          androidRecordAudioPermissionOptions=
            title: 'Permission to use audio recording',
            message: 'We need your permission to use your audio',
            buttonPositive: 'Ok',
            buttonNegative: 'Cancel',
          
          onGoogleVisionBarcodesDetected=( barcodes ) => 
            console.log(barcodes);
          
        />

对于功能组件

const cameraRef = useRef();

takePicture = async () => 
      const options =  quality: 0.5, base64: true ;
      const data = await cameraRef.takePictureAsync(options);
      console.log(data.uri);
  ;

<RNCamera
          ref=cameraRef
          style=styles.preview
          type=RNCamera.Constants.Type.back
          flashMode=RNCamera.Constants.FlashMode.on
          androidCameraPermissionOptions=
            title: 'Permission to use camera',
            message: 'We need your permission to use your camera',
            buttonPositive: 'Ok',
            buttonNegative: 'Cancel',
          
          androidRecordAudioPermissionOptions=
            title: 'Permission to use audio recording',
            message: 'We need your permission to use your audio',
            buttonPositive: 'Ok',
            buttonNegative: 'Cancel',
          
          onGoogleVisionBarcodesDetected=( barcodes ) => 
            console.log(barcodes);
          
        />

【讨论】：

它的工作 const data = await cameraRef.current.takePictureAsync(options);