React Native Turbo Modules that allow you to compress your photos by given URI and quality parameter
npm install react-native-photo-compressor
or
yarn add react-native-photo-compressor
Android configuration requires to enable the New Architecture:
- Open the android/gradle.properties file
- Scroll down to the end of the file and switch the newArchEnabled property from false to true.
bundle install
cd ios
RCT_NEW_ARCH_ENABLED=1 bundle exec pod install
import { compressPhoto, compressPhotos, getSizeInBytes, deletePhoto } from 'react-native-photo-compressor';
// ...
const compressedPhoto = await compressPhoto('file://some/photo.png', 50);
const remoteCompressedPhoto = await compressPhoto('http://remote/photo.png', 50);
const namedCompressedPhoto = await compressPhoto('file://some/photo.png', 50, 'myFileName', true);
const compressedPhotos = await compressPhotos(['file://some/photo_1.png', 'file://some/photo_2.png'], 50);
const photoSize = await getSizeInBytes('file://some/photo.png');
await deletePhoto('file://some/photo.png');
compressPhoto(uri: string, quality: number, fileName?: string, forceRewrite?: boolean): Promise<string>
Creates a compressed copy of the image at the given uri
inside a /RNPhotoCompressorImages
directory.
Also supports images from web url. In this case uri
should start with "http"
.
Argument | Info |
---|---|
uri | string, path to the photo, must contain file:// prefix |
quality | number, value from 0 to 100 (smaller number -> more compression) |
fileName? | string, optional name of the compressed photo |
forceRewrite? | boolean, optional flag to force the file to be overwritten if a file with the given name already exists. Default: false |
compressPhotos(photos: string[], quality: number, onProgress?: (progress: number) => void): Promise<string[]>
Creates a compressed copy of the images by uri from a given photos
array inside a /RNPhotoCompressorImages
directory.
Also supports images from web url. In this case uri
should start with "http"
.
Argument | Info |
---|---|
photos | string[], paths to the photo, must contain file:// prefix |
quality | number, value from 0 to 100 (smaller number -> more compression) |
rejectAll? | boolean, optional flag indicating whether to reject all if compression of one image fails, otherwise rejected images will return null. Default: true |
onProgress? | (progress: number) => void, optional callback that triggers when the image in the array has completed compression. progress returns the index of elements that have completed compression. |
Returns the size of the file in bytes at the given uri
.
SizeType
defines the format of the return value and can be either "kb"
or "mb"
(default: "b"
).
Deletes a compressed image at a given uri
.
Note: Only works for files inside a /RNPhotoCompressorImages
directory.
If you get this error when building iOS:
/Users/user/Desktop/testApp/ios/Pods/../../node_modules/react-native/scripts/codegen/generate-legacy-interop-components.js: Permission denied
- Open a terminal, run this command and copy the result
command -v node
- Open
.xcode.env
file in ios directory and replace
export NODE_BINARY=$(command -v node)
to
export NODE_BINARY=~/your/node/path
- Implement turbo module for Android
- Implement turbo module for iOS
- Add more configuration for turbo module (like deleting photos, specific urls and etc.)
- Refactor Android turbo module
If you want to add more functionality to this:
- Fork repo
- Implement wanted feature
- Create a PR into master
Or
- Create an issue
- Describe the feature you want
- Tag author
MIT
Made with create-react-native-library