你瞅啥呢

2022-03-02 关于 react-native 如何使用 react-native-image-crop-picker

前言:react-native项目(下称rn)中需要用到图片裁剪、从相册取照片以及调用手机相机,主要用到这个插件react-native-image-crop-picker。

安装:

yarn add react-native-image-crop-picker

插件地址:https://github.com/ivpusic/react-native-image-crop-picker

安装好后,需要对android包进行配置,否则会报错:TypeError: null is not an object (evaluating 'ImageCropPicker.openPicker')

配置步骤如下:

1.link到android库里:

react-native link react-native-image-crop-picker

2.打开相机权限(需要用到相机的时候),在项目名\android\app\src\main\AndroidManifest.xml里添加下面代码:

<uses-permission android:name="android.permission.CAMERA"/>

3.卸载原来的app,重新打包。

====================================  下面是使用方法  ====================================

复制代码
import ImagePicker from 'react-native-image-crop-picker';

···
ImagePicker.openPicker({
            width: 100,//宽度
            height: 100,//高度
            cropping: true,//是否裁剪
            cropperCircleOverlay: true,//裁剪图像时候,是否打开圆形裁剪覆盖
            includeBase64: false,//启用或禁用使用图像返回base64数据
}).then(async image => {
            let path = image.path;
            console.log('图片路径: '+path)
}).catch(err => {
            console.log(err);
})
复制代码

这里只对android进行配置,ios的。。可以参看这篇文章:https://www.jianshu.com/p/8420b08062c7

posted @   叶乘风  阅读(220)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· 开源Multi-agent AI智能体框架aevatar.ai,欢迎大家贡献代码
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· 没有Manus邀请码?试试免邀请码的MGX或者开源的OpenManus吧
点击右上角即可分享
微信分享提示