oblador/react-native-record-screen

react-native-record-screen

react-native-record-screen

A screen record module for React Native.

• Support iOS >= 11.0 (Simulator is not work)

• Support Android

  • minSdkVersion = 26
  • compileSdkVersion = 33
  • targetSdkVersion = 31
  • use HBRecorder

Installation

npm install react-native-record-screen

iOS

1. Add the permission strings to your Info.plist

<key>NSCameraUsageDescription</key>
<string>Please allow use of camera</string>
<!-- If you intend to use the microphone -->
<key>NSMicrophoneUsageDescription</key>
<string>Please allow use of microphone</string>

2. pod install

npx pod-install

3. Add ReplayKit.framework at Link Binary With Libraries

Android

1. Add the permissions to your AndroidManifest.xml

<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.WRITE_INTERNAL_STORAGE" />
<uses-permission android:name="android.permission.FOREGROUND_SERVICE" />
<!-- If you intend to use the microphone -->
<uses-permission android:name="android.permission.RECORD_AUDIO" />

Usage

Recording full screen

import RecordScreen, { RecordingStartResponse } from 'react-native-record-screen';

// recording start
const res = RecordScreen.startRecording().catch((error) => console.error(error));
if (res === RecordingStartResponse.PermissionError) {
  // user denies access
}

// recording stop
const res = await RecordScreen.stopRecording().catch((error) =>
  console.warn(error)
);
if (res) {
  const url = res.result.outputURL;
}

Setting microphone

default true.

// mic off
RecordScreen.startRecording({ mic: false }).catch((error) =>
  console.error(error)
);

// recording stop
const res = await RecordScreen.stopRecording().catch((error) =>
  console.warn(error)
);
if (res) {
  const url = res.result.outputURL;
}

Adjusting bitrate / frame rate

RecordScreen.startRecording({
  bitrate: 1024000, // default 236390400
  fps: 24, // default 60
})

Clean Sandbox

RecordScreen.clean();

License

MIT