如何将捕获的图像与 react-native-camera 一起使用

Posted 2023-03-11

【中文标题】如何将捕获的图像与 react-native-camera 一起使用

【英文标题】：How do I use a captured image with react-native-camera

【发布时间】：2015-10-15 17:40:00

【问题描述】：

我可以让react-native-camera 模块访问相机并保存图像。但是，我不知道如何向用户显示此图像。

我正在尝试什么：

我在这里拍照。这会在assets-library://.... 中生成看起来像.jpg 的文件

    _takePicture() 
        var self = this;
        this.refs.cam.capture(function(err, data) 
          this.setState(photo: data);
          console.log(err, data);
          // data is "assets-library://asset/asset.JPG?id=########-####-####-####-##########&ext=JPG"
          console.log('just took a picture');
        ); 
    

但是，如果我尝试渲染图像：

    render: function() 
      return(
         <Image style=styles.image source=uri: this.state.photo/>
      );
    

我收到此错误：

No suitable image URL loader found for assets-library://asset/asset.JPG?id=.......

如何拍摄照片，将其保存到我的应用程序的当前state，然后进行渲染？

【参考方案1】：

解决方案是启用 save to disk option 与保存到 cameraRoll 选项：

<Camera
  captureTarget=Camera.constants.CaptureTarget.disk
  // Rest of Camera options here
/>

【讨论】：

Camera.constants 即将推出。有什么解决办法吗？

【参考方案2】：

所以，我使用@YPCrumble 答案有一段时间了。

但现在我必须将图像保存在我的相机胶卷中。

如果有人想继续保存在相机胶卷中，您必须手动链接 RTCCameraRoll 库。

此处链接库的文档：

https://facebook.github.io/react-native/docs/linking-libraries-ios.html#manual-linking

就这么简单：

您可以在您的 node_modules/react-native/Libraries/CameraRoll

将此文件拖放到 XCode 项目的 Libraries 文件夹中。

之后，单击您的主项目，然后在右侧窗格中找到 “构建阶段”。

在“Link Binary With Libraries”中，拖放名为 左侧窗格中的“libRCTCameraRoll.a”-> 库-> RTCCameraRoll.xcodeproj -> 产品