通过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. Java的类名与文件名必须一致

    1.Java保存的文件名必须与类名一致:2.如果文件中只有一个类,文件名必须与类名一致:3.一个Java文件中只能有一个public类:4.如果文件中不止一个类,文件名必须与public类名一致:5. ...

  2. MYISM表并发写请求过多 导致无法被读取解决方案

    MyISAM锁调度是如何实现的呢,这也是一个很关键的问题.例如,当一个进程请求某个MyISAM表的读锁,同时另一个进程也请求同一表的写锁,此时MySQL将会如优先处理进程呢?通过研究表明,写进程将先获 ...

  3. ORA-00054、ORA-08002

    https://docs.oracle.com/cd/B10501_01/server.920/a96525/e7500.htm ORA-00054 resource busy and acquire ...

  4. Swift实现UIKit Dynamic动画

    iOS7引入了UIKit Dynamics,可以帮助开发者开发出更接近真实世界的动画效果.之前,用户如果要做出这样的效果,需要话很多的时间在物理计算和Core Animation上.现在,所有的一切都 ...

  5. 目前主流编译器对C++11特性的支持情况

    目前主流编译器对C++11特性的支持情况 1. GCC编译器(从编译器GCC4.8.X的版本完全支持) (1)目前C++11特性,之前成为C++0X特性,从GCC4.3的后续版本中逐步对C++11进行 ...

  6. CodeForces - 589D —(思维题)

    Welcoming autumn evening is the best for walking along the boulevard and npeople decided to do so. T ...

  7. SqlServer 的一个坑

    以前一直以为sqlserver 在做ddl 操作的时候是锁表的,而oracle 是锁行,感觉oracle 要比sqlserver 先进一些,但是这是我的认识错误.其实sqlserver 也是可以锁行的 ...

  8. Windows 以及 Xcode下编译调试 libcurl 源码

    curl 这个工具大家都很熟悉. 前几天因为要跟踪curl的实现细节, 不得不设法搭建curl的调试工程. 我们分别在windows visual studio 和 mac 上的 xcode 下搭建调 ...

  9. oracle 批量删除触发器

    --生成删除触发器的语句 select 'drop trigger "'||trigger_name||'";' from all_triggers  where TRIGGER_ ...

  10. HighCharts使用总结

    1.常用属性 chart: type:areaspline(线面图).arearange(区间图) zoomType: 缩放类型(沿着'xy'轴缩放) alignTicks:设置坐标轴刻度对齐. 当有 ...