react-native-image-crop-picker的使用

github:<github.com/ivpusic/rea…>

目前在RN中关于照相机和图像选择器的第三方库有两种，分别是react-native-image-picker和react-native-image-crop-picker。 它们都可以实现启动本地相册和照相机来采集图片，区别是后者有多个图像选择、裁剪、压缩等功能。

在开发中我使用的是react-native-image-crop-picker。关于如何安装配置等网上已经有很多的文章描述，本篇文章主要记录我在使用过程中遇到的问题及需要注意的地方，并非完整步骤和使用方法。

一、安装和配置

iOS平台

1、在安装过程中一定要注意自己的React-Native版本号，选择对应的库进行安装。github上在用法之上明确写了版本要求:

2、xcode中配置 在xcode打开项目，找到Libraries文件右击，现在下图圈出的选项。

选择需要的的.xcodeproj工程添加进来

手动添加以下两个框架

然后拖拽libimageCropPicker.a到tab栏BuildPhases下的Link Binary With Libraries中，如下图：

Android平台

android的配置按照github上步骤做就可以，一般不会有什么问题。配置的过程中也要注意一些版本问题。

二、使用

使用的时候需要注意一个权限的问题。 在info.plist中配置NSPhotoLibraryUsageDescription和NSCameraUsageDescription 代码中如下图：

xcode中如下图：

调用相机拍照的相关代码：

//拍照
    onCamera() {
        if (!ios()) {
            this.requestCamera()
        } else {
            this.getCamera()
        }
    }

    //调用相机拍照
    getCamera() {
        ImagePicker.openCamera({
            width: 400,
            height: 400,
            cropping: true
        }).then(image => {
            console.log(0)
        });
    }

    //安卓手机拍照
    async requestCamera() {
        try {
            const permissions=[
                PermissionsAndroid.PERMISSIONS.CAMERA,
            ]
            const granteds=await PermissionsAndroid.requestMultiple(permissions)
            if (granteds["android.permission.CAMERA"] === "granted") {
                this.getCamera()
            } else {
                console.log(0)
            }
        } catch (err) {
        }
    }