【问题标题】:Problem in creating asset of local static image using react-native-photos-framework使用 react-native-photos-framework 创建本地静态图像资产的问题
【发布时间】:2019-04-23 13:59:42
【问题描述】:

我正在使用react-native-photos-framework 创建用户定义的相册并将资产创建到设备原生图库中。

在我的应用程序中,我为用户提供了用户定义的相册创建功能。为此,我正在显示一个带有输入字段的简单模式,用户可以在其中输入专辑名称以及“确定”和“取消”按钮。

我想要什么?
我希望当用户在输入字段中输入专辑名称后单击“确定”按钮时,应在图库中创建一个键入的专辑,并且默认情况下应将一张图片(位于我的本地目录中)添加到该专辑中。

这是我使用的代码:

createAlbum() {
    RNPhotosFramework.createAlbum(this.state.createAlbumName).then((album) => {
      RCTCameraRollRNPhotosFrameworkManager.createAssets({
        images : [{ uri : '../assets/logo.png' }],
        album : album,
        includeMetadata : true 
      });
    }).catch((error)=>{
      alert("Error in creating album : \n"+JSON.stringify(error));
    });
}

如您所见,我首先创建的是在图库中成功创建的专辑,但资产并未复制到该专辑中。它给了我这个错误:

找不到图像文件:///Users/vision/Library/Developer/CoreSimulator/Devices/E5AA1780-A55C-4C67-95A5-222E4AS3PA23/data/Containers/Bundle/Application/5E37FAF5-15DD-483B-3BD6- C311C587SD8/CameraApp.app/../assets/imgs/logo.png

我还使用require() 来获取图像 uri,如下所示:

images : [{ uri : require('../assets/logo.png' )}],

但随后应用程序将崩溃。

这是我的项目结构:

请帮助我如何使用 react-native-photos-framework 创建本地静态图像资产。我是反应原生的新手!!!

【问题讨论】:

  • 我想我帮不上忙。对不起。
  • 没问题@hongdevelop 谢谢!!!

标签: react-native react-native-image


【解决方案1】:

如果有人也遇到这个问题,我已经使用this 回答了问题。

要解决问题先安装react-native-fs

然后将其导入您的项目中。

const RNFS = require('react-native-fs');

然后我使用RNFS.MainBundlePath 获取我的应用根路径并在我的实际路径前添加assets

代码如下:

createAlbum() {
    RNPhotosFramework.createAlbum(this.state.createAlbumName).then((album) => {
      RCTCameraRollRNPhotosFrameworkManager.createAssets({
        images : [{uri:RNFS.MainBundlePath+'assets/src/assets/imgs/logo.png'}],
        album : album,
        includeMetadata : true
      }).then((result)=>{
        alert(JSON.stringify(result));
      }).catch((error)=>{
        alert("Error in creating assets.\n"+JSON.stringify(error));
      });
    });
}

希望对某人有所帮助。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2016-05-23
    • 1970-01-01
    • 2020-08-10
    • 2022-09-25
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多