当前位置: 首页 > article >正文

React-Native 中使用 react-native-image-crop-picker 在华为手机上不能正常使用拍照功能

背景:

React-Native 0.66 中使用 react-native-image-crop-picker 在安卓 华为手机上不能正常使用拍照功能, 其他品牌正常

代码如下: 

import ImagePicker from 'react-native-image-crop-picker';



ImagePicker.openCamera(photoOptions)
  .then(image => {
     callback(image);
  })

原因分析及解决办法:

通过在 openCamera中增加 catch 捕获异常发现, 在华为手机上调用拍照时有报错, 

 1. Error: Cannot launch camera

poromiseMethodwrapper@http://localhost :8081/index .bundle?xxx

==>  在 android/app/src/main/AndroidManifest.xml  中增加  android:requestLegacyExternalStorage="true" 配置

2. 再继续调试发现另外报错 

Failed to find configured root that contains /storage/emulated/0/Android/data/com.jgpdapro/files/Pictures/image-4488cf2d-8a66-4254-a9d6-f198bb1515781214910780677416114.jpg

promiseMethodWrapper@http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.jgpdapro&modulesOnly=false&runModule=true:2084:45

http://localhost:8081/index.bundle?platform=android&dev=true&minify=false&app=com.jgpdapro&modulesOnly=false&runModule=true:171700:57

==> 在 android/app/src/main/AndroidManifest.xml  中增加 android.support.FILE_PROVIDER_PATHS 配置

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
  package="com.xxx">


    <application
      android:name=".MainApplication"
      android:label="@string/app_name"
      android:usesCleartextTraffic="true"
      android:icon="@mipmap/ic_launcher"
      android:roundIcon="@mipmap/ic_launcher_round"
      android:allowBackup="false"
      android:requestLegacyExternalStorage="true" 
      android:theme="@style/AppTheme">
        <provider
            android:name="androidx.core.content.FileProvider"
            android:authorities="${applicationId}.provider"
            android:exported="false"
            android:grantUriPermissions="true">
            <meta-data
                android:name="android.support.FILE_PROVIDER_PATHS"
                android:resource="@xml/file_paths" />
        </provider>
    </application>
</manifest>

在 android/app/src/main/res/xml/下新增 file_paths.xml

<?xml version="1.0" encoding="utf-8"?>
<paths xmlns:android="http://schemas.android.com/apk/res/android">
    <external-path
        name="external_pictures"
        path="Android/data/com.xxx/files/Pictures/" />
</paths>

测试结果:


http://www.kler.cn/news/317888.html

相关文章:

  • SQL常用技巧总结
  • ​‌GAS系统​
  • 【Kubernetes】常见面试题汇总(三十六)
  • OMRON欧姆龙通讯模块CI541V1
  • 网络安全:构建数字世界的坚固防线
  • MVCC机制解析:提升数据库并发性能的关键
  • Golang如何优雅的退出程序
  • MyBatis错误处理与日志
  • golang学习笔记31——golang 怎么实现枚举
  • 力扣2563.统计公平数对的数目
  • 【chromedriver编译-绕过selenium机器人检测】
  • st7735 stm32f103 lvgl调试记录3,spi篇
  • vue3ElementPlus使两个日期联动控制(限制结束时间为开始时间的一个月)
  • fastadmin本地安装插件提示”请从官网渠道下载插件压缩包(code:2)(code:1)“
  • iPhone 16 开始支持全新的 JPEG XL 格式
  • API 架构(RPC和RESTful)
  • 跳转页面(持续更新...)
  • 软件架构设计原则
  • mysql如何替换数据库所有表中某些字段含有的特定值
  • 虚拟机centos_7 配置教程(镜像源、配置centos、静态ip地址、Finalshell远程操控使用)
  • 目标检测基本知识
  • 线性dp 总结详解
  • Vue3:$refs和$parent实现组件通信
  • 【树莓派】python3程序获取CPU和GPU温度
  • 无人机之战斗机的详解!
  • 单片机学到什么程度才可以去工作?
  • WebGL纹理与材质
  • 【C++二叉树】236.二叉树的最近公共祖先
  • 使用three.js+vue3完成无人机上下运动
  • 汽车售后诊断ECU参数分析