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

Posted 2023-02-25

【中文标题】与 Expo 配合使用的 React Native 图像裁剪工具

【英文标题】：React Native image cropping tool that works with Expo

【发布时间】：2018-08-17 14:32:09

【问题描述】：

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

【问题讨论】：

你试过docs.expo.io/versions/latest/sdk/imagemanipulator???

我要裁剪的图像不是来自相机或相机胶卷，它们是我从服务器获取的图像，因此您链接到的 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 图像操纵器无法工作。