react-native-beautiful-video-recorder 视频记录器组件

来源:互联网 发布:sql join用法 编辑:程序博客网 时间:2024/05/21 14:06

视频记录器组件,扩展自react-native-camera。适配iOS和Android。

https://github.com/phuochau/react-native-beautiful-video-recorder

特性:

  • 在iOS和Android上记录视频
  • 在iOS上将MOV转换为MP4。因此Android&iOS都会返回MP4格式。

安装

npm i --save react-native-beautiful-video-recorderreact-native link

配置

iOS

使用iOS 10或者更高的版本,你需要将"Privacy - Camera Usage Description"键添加到项目的info.plist。这将会在'your_project/ios/your_project/Info.plist'中找到。添加下列代码:

<key>NSCameraUsageDescription</key><string>Your message to user when the camera is accessed for the first time</string><!-- Include this only if you are planning to use the microphone for video recording --><key>NSMicrophoneUsageDescription</key><string>Your message to user when the microsphone is accessed for the first time</string>

Android

在Android Manifest中添加权限

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

使用方法

import VideoRecorder from 'react-native-beautiful-video-recorder';....start = () => {this.videoRecorder.open((data) => {console.log('captured data', data);});}render() {return (<View>......  <TouchableOpacity onPress={this.start}>  <Text>Start</Text>  </TouchableOpacity>  <VideoRecorder ref={(ref) => { this.videoRecorder = ref; }} compressQuality={'medium'} /> // quality will be 'low', 'medium' or 'high'</View>);}
0 0
原创粉丝点击