通过react-native-camera调用原生相机,及自定义样式

GitHub地址:

https://github.com/react-native-community/react-native-camera

安装:

npm install react-native-camera --save
react-native link react-native-camera

配置:

1.修改...\android\app\src\main\AndroidManifest.xml,增加摄像头处理权限

<uses-permission android:name="android.permission.RECORD_AUDIO"/>
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />

2.设置gradle版本,编辑 android/gradle/grade-wrapper.properties:

distributionBase=GRADLE_USER_HOME
distributionPath=wrapper/dists
zipStoreBase=GRADLE_USER_HOME
zipStorePath=wrapper/dists
distributionUrl=https\://services.gradle.org/distributions/gradle-4.4-all.zip

3.修改android/build.gradle

buildscript {
repositories {
jcenter()
google()
}
dependencies {
classpath 'com.android.tools.build:gradle:3.1.0' // NOTE: Do not place your application dependencies here; they belong
// in the individual module build.gradle files
}
} allprojects {
repositories {
mavenLocal()
jcenter()
google()
maven { url "https://jitpack.io" }
maven { url "https://maven.google.com" }
maven {
// All of React Native (JS, Obj-C sources, Android binaries) is installed from npm
url "$rootDir/../node_modules/react-native/android"
}
}
} subprojects {
project.configurations.all {
resolutionStrategy.eachDependency { details ->
if (details.requested.group == 'com.android.support'
&& !details.requested.name.contains('multidex') ) {
details.useVersion "26.1.0"
}
}
}
}

添加功能实现代码:

ReactNative常用组件库 react-native-camera 相机的更多相关文章

  1. ReactNative常用组件库 victory-native 图表

    victory-native 是不错的图表组件,支持很多种图表 地址: https://github.com/FormidableLabs/victory-native 先安装 react-nativ ...

  2. Vue-ui常用组件库整理

    Vue-ui常用组件库整理 查看全部整理内容==> element-ui Element 是由饿了么UED设计.饿了么大前端开发的一套基于 Vue 2.0 的桌面端组件库. 这款是我用了很久的, ...

  3. react native camera

    最近在尝试用react native camera iOS版本很方便就调试通过了,react的试用非常方便 android版本要单独试用fork的 屏蔽了lint的报错后也可以调试通过 参考这篇文章填 ...

  4. React-Native 常用组件学习资料链接

    以下链接是自己开发RN工程时参考的一些不错的资料,给喜欢学习的朋友分享以下. React-Native组件用法详解之ListViewhttp://www.jianshu.com/p/1293bb8ac ...

  5. react-native 常用组件的用法(二)

    ScrollView组件 能够调用移动平台的ScrollView(滚动视图)的组件,同时还集成了触摸锁定的“响应者”系统.注意一定要给scrollview一个高度,或者是他父级的高度. 常用方法 on ...

  6. Web移动端的常用组件库

    normalize http://necolas.github.io/normalize.css/ 最受欢迎的css reset 保留有用的默认值,这个区别于其他的CSS resets 标准化大范围的 ...

  7. vue.js 常用组件库

    vux github ui demo:https://github.com/airyland/vux Mint UI 项目主页:http://mint-ui.github.io/#!/zh-cndem ...

  8. react-native 常用组件的用法(一)

    1.View组件 View是一个支持Flexbox布局.样式.一些触摸处理.和一些无障碍功能的容器,并且它可以放到其它的视图里,也可以有任意多个任意类型的子视图. View的设计初衷是和StyleSh ...

  9. ReactNative常用组件汇总

    导航组件react-navigation: https://github.com/react-community/react-navigation 网络请求asios: https://github. ...

随机推荐

  1. python机器学习工具包scikit-learn

    scikit-learn这个非常强大的python机器学习工具包 http://scikit-learn.org/stable/modules/generated/sklearn.svm.SVC.ht ...

  2. Problem of Uninstall Cloudera: Cannot Add Hdfs and Reported Cannot Find CDH's bigtop-detect-javahome

    1. Problem We wrote a shell script to uninstall Cloudera Manager(CM) that run in a cluster with 3 li ...

  3. 475. Heaters

    static int wing=[]() { std::ios::sync_with_stdio(false); cin.tie(NULL); ; }(); class Solution { publ ...

  4. Yii2 upload

    http://webtips.krajee.com/advanced-upload-using-yii2-fileinput-widget/ http://webtips.krajee.com/upl ...

  5. Geronimo 叛逆者: 使用集成软件包:Codehaus 的 Woodstox(转载)

    XML 解析器通常是高性能.健壮应用程序的关键.传统的 XML 解析技术包括文档对象模型(Document Object Model,DOM)和 Simple API for XML (SAX).现在 ...

  6. How to generate HMAC-SHA1 in C#?

    using (HMACSHA1 m = new HMACSHA1(Encoding.UTF8.GetBytes("AKIDZfbOA78asKUYBcXFrJD0a1ICvR98JM&quo ...

  7. 升级windows 10后网络连接异常

    升级 windows 10,QQ无法连接,显示“登陆超时,请检查网络或者防火墙设置”.打开360软件助手,准备升级QQ试试,360软件助手也显示网络异常. 解决方法: 右键点击开始菜单,命令提示符(管 ...

  8. VUE 学习笔记 三 模板语法

    1.插值 a.文本 数据绑定最常见的形式就是使用“Mustache”语法 (双大括号) 的文本插值 <span>Message: {{ msg }}</span> v-once ...

  9. oracle数据导出导入(exp/imp)

    1.本地数据库导入导出 1.导出 (运行---cmd中操作)exp 用户名/密码@数据库实例名file=本地存放路径eg: exp jnjp/jnjp@ORCL file=C:/jnjp.dmp 2. ...

  10. WPF里面多线程访问UI线程、主线程的控件

    如果出现以下错误:调用线程无法访问此对象,因为另一个线程拥有该对象. 你就碰到多线程访问UI线程.主线程的控件的问题了. 先占位.