android native 相册,React Native - 使用CameraRoll将图片保存到本地相册

背景：

在使用react-native-image-zoom-viewer保存图片时，报错cannot read property 'savetocameraroll'。

查找之后发现react-native-image-zoom-viewe保存图片使用的是CameraRollapi。所以我们需要在xcode中添加静态库依赖。

解决方案：

IOS端:

1.首先打开你的项目目录/node_modules/react-native/Libraries/CameraRoll/ 找到RCTCameraRoll.xcodeproj这个文件。

找到文件夹

2.然后把它拖到xcode的Libraries目录下。

拖到libraries目录下

3.然后点击项目标签在General标签中找到Linked Frameworks and Libraries 点击下边的+号把libRCTCameraRoll.a加进来

image.png

image.png

然后再返回你的项目中保存图片应该就不会错了。

RN代码(IOS)

写一下CameraRoll保存图片使用promise

savePhote =()=>{

let promise = CameraRoll.saveToCameraRoll('图片url');

promise.then(function (result) {

Toast.info("保存成功")

}).catch(function (error) {

Toast.info("保存失败")

});

}

ios端的配置写完了。在添加一下安卓端的；

Android 的保存使用CameraRoll配合 react-native-fs 进行实现保存图片

具体实现代码:

const RNFS = require('react-native-fs'); //文件处理

const storeLocation = `${RNFS.DocumentDirectoryPath}`;

let pathName = new Date().getTime() + "文件名.png"

let downloadDest = `${storeLocation}/${pathName}`;

const ret = RNFS.downloadFile({fromUrl:saveImageUrl,toFile:downloadDest});

ret.promise.then(res => {

if(res && res.statusCode === 200){

var promise = CameraRoll.saveToCameraRoll("file://" + downloadDest);

promise.then(function(result) {

console.log("图片已保存至相册")

}).catch(function(error) {

console.log("保存失败")

})

}

})

别忘加权限: