如何在反应原生相机中使用捕获的图像

问题描述：

我可以让react-native-camera模块访问相机并保存图像。但是，我无法弄清楚如何将这个图像显示给用户。如何在反应原生相机中使用捕获的图像

我在想什么：

我在这里拍照。这会产生什么看起来是一个.jpg文件assets-library://....

_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中，然后进行渲染？

答

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

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

答

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

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

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

文档链接库的位置：

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

它是如此简单：

You can find the RCTImage.xcodeproj in your node_modules/react-native/Libraries/CameraRoll

Drag and drop this file inside Libraries folder in your XCode project.

After that, click in your main project, and find in the right pane "Build Phases".

Inside "Link Binary With Libraries", drag and drop the file called "libRCTCameraRoll.a" from left pane -> Libraries -> RTCCameraRoll.xcodeproj -> Products

如何在反应原生相机中使用捕获的图像

相关推荐