通过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. sql时间戳转日期格式

    FROM_UNIXTIME(ctime, '%Y-%m-%d %H:%i:%s')

  2. iOS's GCD Note

    [iOS's GCD Note] 1.默认有四种全局concureent queue,如下: 通过以下函数来引用: 2.官方文档上并发队列有3种,实际上main就是serial. 1)serial,用 ...

  3. Gym 101201H Paint (离散化+DP)

    题意:给定 n 个区间,让你选出一些,使得每个选出区间不交叉,并且覆盖区间最大. 析:最容易想到的先是离散化,然后最先想到的就是 O(n^2)的复杂度,dp[i] = max(dp[j] + a[i] ...

  4. 从《数据挖掘概念与技术》到《Web数据挖掘》

    从<数据挖掘概念与技术>到<Web数据挖掘> 认真读过<数据挖掘概念与技术>的第一章后,对数据挖掘有了更加深刻的了解.数据挖掘是知识发展过程的一个步骤.知识发展的过 ...

  5. 团队-Forward-团队一阶段互评

    学号:2015035107105得分:4原因:代码不规范,有一些错误,需要我们的帮助. 学号:2015035107109得分:7原因:与队员沟通少,代码衔接有问题. 学号:2015035107113得 ...

  6. handsontable-developer guide-load and save

    不过handsontable不能用jquery取对象 var $$ = function(id) { return document.getElementById(id); }, container ...

  7. 凭借对KMP算法的了解,用java实现了一下,结果和java自带的字符串indexOf比,性能差了十倍。。。

    public class KMP { private char[] source = {'a','b','c','b','c','a','b','a','b','d','d','e','f','g', ...

  8. Android-Gson解析JSON数据(JSON对象/JSON数组)

    上一篇博客,Android-解析JSON数据(JSON对象/JSON数组),介绍了使用 org.json.JSONArray;/org.json.JSONObject; 来解析JSON数据: Goog ...

  9. jconsole连接远程tomcat

    windows(Windows操作系统下的远程监控) 1.编辑文件:在进入到了tomcat中的bin的目录中,进行打开catalina.bat进行编辑文件. 2.添加代码:找到文件中的如下代码 rem ...

  10. Caliburn.Micro 资源随时添加

    Caliburn.Micro – Hello World http://buksbaum.us/2010/08/01/caliburn-micro-hello-world/ http://blog.c ...