视频记录器组件,扩展自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-recorder react-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> ); }