react-native-sili-video-compression v1.2.1
react-native-video-compression
Getting started
$ npm install react-native-sili-video-compression --save
Mostly automatic installation
$ react-native link react-native-sili-video-compression
Manual installation
Open the
package.json
file and under dependencies ➜Add "react-native-sili-video-compression" : 1.0.6
You should add a comma before the line to keep the JSON format of it.
Open the terminal in the project ➜
Type npm install
.
iOS
- In XCode, in the project navigator, right click
Libraries
➜Add Files to [your project's name]
- Go to
node_modules
➜react-native-video-compression
and addRNVideoCompression.xcodeproj
- In XCode, in the project navigator, select your project. Add
libRNVideoCompression.a
to your project'sBuild Phases
➜Link Binary With Libraries
- Run your project (
Cmd+R
)<
Android
Usage
Import Library
import CompressModule from 'react-native-sili-video-compression';
Add External File read write permission into your Manifest.xml
.
Add xmlns:tools="http://schemas.android.com/tools"
to your <Manifest/>
tag in your Manifest.xml
.
Manifest.xml
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
...
...>
Add these 2 line to your <application/>
tag.
<application
android:name=".MainApplication"
android:label="@string/app_name"
...
android:requestLegacyExternalStorage="true" //Add this
tools:replace="android:allowBackup" //Add this
/>
Add Event Emitter for progress update
const EVENT_NAME = new NativeEventEmitter(NativeModules.CompressModule);
this.subscription = EVENT_NAME.addListener(
CompressModule.VIDEO_COMPRESS_PROGRESS_EMITTER,
(value)=> console.log(value));
Add success listener
var successCall = (fileName, size, path, message) => {
// Do your work
console.log(message);
};
Success method properties
Property | Type | Description |
---|---|---|
fileName | String | File name with absolute path : '/storage/emulated/0/Download/20201003_095653.mp4' |
size | Long | Size in Bytes |
path | String | Absolute file path of compressed file : '/storage/emulated/0/Download/20201003_095653.mp4' |
message | String | Compress comprete message |
Add Failure listener
var errorCall = (errorMessage) => {
// Do your work
console.log(errorMessage);
};
Failure method properties
Property | Type | Description |
---|---|---|
errorMessage | String | Error message with reason |
Compression methode for predefined levels
//Check for External file access permission before video conversion
if (granted === PermissionsAndroid.RESULTS.GRANTED) {
CompressModule.compressVideo('/storage/emulated/0/Download/20201003_095653.mp4', CompressModule.LOW,
errorCall, successCall);
// console.log(CompressModule.LOW);
}
compressVideo() request Params
Property | Type | Description |
---|---|---|
inputFilePath | String | Absolute path for input file : '/storage/emulated/0/Download/20201003_095653.mp4' |
compressLevel | Constant | LOW/MEDIUM/HIGH |
errorCallback | CallBack | ErrorCallback object to handle error events |
successCallback | CallBack | SuccessCallback object to handle error events |
Predefined 3 level of compress can be done.
Constant | Description |
---|---|
CompressModule.LOW | compress level 10% and reduce Height and Width to 50% |
CompressModule.MEDIUM | compress level 50% and reduce Height and Width to 50% |
CompressModule.HIGH | compress level 100% and reduce Height and Width to 50% |
Compression methode by using percentage
//Check for External file access permission before video conversion
if (granted === PermissionsAndroid.RESULTS.GRANTED) {
CompressModule.compressVideoWithQuality('/storage/emulated/0/Download/20201003_095653.mp4', reduceVideoQualityToPercent, reduceHeightWidthToPercent,
errorCall, successCall);
// console.log(CompressModule.LOW);
}
compressVideoWithQuality() request Params
Property | Type | Description |
---|---|---|
inputFilePath | String | Absolute path for input file : '/storage/emulated/0/Download/20201003_095653.mp4' |
reduceVideoQualityToPercent | Float | value should be in between 0 to 1, default value is 0.5 |
reduceHeightWidthToPercent | Float | value should be in between 0 to 1, default value is 0.5 |
errorCallback | CallBack | ErrorCallback object to handle error events |
successCallback | CallBack | SuccessCallback object to handle error events |
VERY IMPORTANT FOR ANDROID Close the Emitter subscription if not using it or in task completion or task failed
this.subscription.remove();
License
MIT
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago
5 years ago