Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/emekalites/react-native-compress-image
compress image with react native
https://github.com/emekalites/react-native-compress-image
android compress image ios react react-native
Last synced: 11 days ago
JSON representation
compress image with react native
- Host: GitHub
- URL: https://github.com/emekalites/react-native-compress-image
- Owner: emekalites
- License: mit
- Created: 2017-09-29T21:13:13.000Z (over 7 years ago)
- Default Branch: master
- Last Pushed: 2022-04-25T17:12:48.000Z (over 2 years ago)
- Last Synced: 2024-12-20T20:41:53.499Z (19 days ago)
- Topics: android, compress, image, ios, react, react-native
- Language: Java
- Homepage:
- Size: 585 KB
- Stars: 23
- Watchers: 2
- Forks: 8
- Open Issues: 17
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# React Native Compress Image
[](https://badge.fury.io/js/react-native-compress-image)
[](https://badge.fury.io/js/react-native-compress-image)
React Native Compress Image for Android
**NOTE: The iOS side of this module will be included when i have figured it out.**
## Installation
`npm install --save react-native-compress-image`
`react-native link react-native-compress-image`
**NOTE: For Android, you will still have to manually update the AndroidManifest.xml (as below) in order to use Scheduled Notifications.**
## Android manual Installation
In your `AndroidManifest.xml`
```xml
```
In `android/settings.gradle`
```gradle
include ':react-native-compress-image'
project(':react-native-compress-image').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-compress-image/android')
```
in `android/app/build.gradle`
```java
dependencies {
compile project(':react-native-compress-image') // <--- Add package to dependencies
compile fileTree(dir: "libs", include: ["*.jar"])
compile "com.android.support:appcompat-v7:23.0.1"
compile "com.facebook.react:react-native:+"
....
}
```
in `MainApplication.java`:
```java
import com.emekalites.react.compress.image.ImageCompressPackage; // <--- Import Package
public class MainApplication extends Application implements ReactApplication {
private final ReactNativeHost mReactNativeHost = new ReactNativeHost(this) {
@Override
protected boolean getUseDeveloperSupport() {
return BuildConfig.DEBUG;
}
@Override
protected List getPackages() {
return Arrays.asList(
new MainReactPackage(),
new ImageCompressPackage() // <---- Add the Package
);
}
};
}
```
## Usage
```javascript
import CompressImage from 'react-native-compress-image';
CompressImage.createCompressedImage(imageUri, appDirectory).then((response) => {
// response.uri is the URI of the new image that can now be displayed, uploaded...
// response.path is the path of the new image
// response.name is the name of the new image with the extension
// response.size is the size of the new image
}).catch((err) => {
// Oops, something went wrong. Check that the filename is correct and
// inspect err to get more details.
});
CompressImage.createCustomCompressedImage(imageUri, appDirectory, maxWidth, maxHeight, quality).then((response) => {
// response.uri is the URI of the new image that can now be displayed, uploaded...
// response.path is the path of the new image
// response.name is the name of the new image with the extension
// response.size is the size of the new image
}).catch((err) => {
// Oops, something went wrong. Check that the filename is correct and
// inspect err to get more details.
});
```
## Sample App
A basic, sample app is available in [the `example` folder](https://github.com/emekalites/react-native-compress-image/tree/master/example). It uses the module to compress a photo from the Camera Roll.
## API
### `promise createCompressedImage(imageUri, appDirectory)`
The promise resolves with an object containing: `path`, `uri`, `name` and `size` of the new file. The URI can be used directly as the `source` of an [``](https://facebook.github.io/react-native/docs/image.html) component.
Option | Description
------ | -----------
imageUri | Path of image file whether jpeg or png
appDirectory | The folder or path to save the compressed image
### `promise createCustomCompressedImage(imageUri, appDirectory, maxWidth, maxHeight, quality)`
The promise resolves with an object containing: `path`, `uri`, `name` and `size` of the new file. The URI can be used directly as the `source` of an [``](https://facebook.github.io/react-native/docs/image.html) component.
Option | Description
------ | -----------
imageUri | Path of image file whether jpeg or png
appDirectory | The folder or path to save the compressed image
maxWidth | Image maximum width
maxHeight | Image maximum height
quality | Image quality
## Credits
[https://github.com/zetbaitsu/Compressor](https://github.com/zetbaitsu/Compressor)