上传图片之前如何在图片选择器中裁剪图片

Question

我是本机反应的新手。我想在上传图片之前裁剪图片。我正在按照本教程https://reactnativecode.com/upload-image-to-server-using-php-mysql/#comment-5335进行操作。现在我在上传之前裁剪图像有问题。如何在编码中实现裁剪功能？谁能帮我？非常感谢你。

Answer 1

您可以尝试使用https://github.com/ivpusic/react-native-image-crop-picker，它可以在IOS和Android中裁剪所选图像。基本示例是

selectPhoto() {
    if (this.state.selectedOption === 'camera') {
        ImagePicker.openCamera({
            cropping: true,
            width: 500,
            height: 500,
            cropperCircleOverlay: true,
            compressImageMaxWidth: 640,
            compressImageMaxHeight: 480,
            freeStyleCropEnabled: true,
            includeBase64: true
        }).then(image => {
            this.setState({imageModalVisible: false})
            this.storeUploadedData(item, image);
        })
            .catch(e => {
                console.log(e), this.setState({imageModalVisible: false})
            });

        console.log('camera')
    } else {
        ImagePicker.openPicker({
            cropping: true,
            width: 300,
            height: 400,
            cropperCircleOverlay: true,
            freeStyleCropEnabled: true,
            avoidEmptySpaceAroundImage: true,
            includeBase64: true
        }).then(image => {
            this.setState({imageModalVisible: false})
        })
            .catch(e => console.log(e));
        console.log('gallery')
    }
}

但是这里存在一个缺点，您需要创建自己的弹出窗口以通过相机或图库选择图像。除此之外，该组件实际上是由它组成的。您可以在提到的链接中找到整个文档