与 Expo 配合使用的 React Native 图像裁剪工具答案

【问题标题】：React Native image cropping tool that works with Expo与 Expo 配合使用的 React Native 图像裁剪工具
【发布时间】：2018-08-17 14:32:09
【问题描述】：

是否有人知道在 Expo 设置中工作的 React Native 的图像裁剪工具。非常受欢迎的react-native-image-crop-picker 没有。有其他选择吗？我似乎找不到任何东西。

【问题讨论】：

你试过docs.expo.io/versions/latest/sdk/imagemanipulator???
我要裁剪的图像不是来自相机或相机胶卷，它们是我从服务器获取的图像，因此您链接到的 Expo 图像操纵器将无法工作。跨度>

标签： react-native expo

【解决方案1】：

您可以使用Expo#FileSystem 下载图像，然后使用Expo#ImageManipulator 裁剪缓存的图像这是一个示例

/*
 * @param link {string} URI of the image on the server
 * @param name {string} Name of the image with extension
 */
_downloadAndCrop = (link, name, cropSize = { width: 200, height: 200 }) => {
    FileSystem.downloadAsync(
       link,
       name
   )
   .then(({ uri }) => {
       console.log('Finished downloading to ', uri);
       //Your new cropped image
       const cropImage = ImageManipulator.manipulate(uri, [
                             crop: { 
                                 originX: 0, 
                                 originY: 0, 
                                 width: cropSize.width, 
                                 height: cropSize.height 
                             }
                         }], {});
   })
   .catch(error => {
       console.error(error);
   });
}

【讨论】：

【解决方案2】：

您可以使用纵横比 4:3、16:9、1:1 等等

import { ImagePicker } from 'expo';

您是从画廊获取照片吗？

const photo = await ImagePicker.launchImageLibraryAsync({
   allowsEditing: true,
   aspect: [4, 3],
});

【讨论】：

我正在从服务器获取图像，因此很遗憾 Expo 图像操纵器无法工作。