About this project
# react-native-image-crop-picker
A React Native module for selecting images and videos from the device gallery or camera, with support for cropping, compression, multiple selection, and various customization options. It works on both iOS and Android.
## Features
- **Gallery and Camera**: Open the system picker or camera directly.
- **Cropping**: Enable cropping with customizable dimensions, circular overlay, free-style crop, and rotation gestures (Android).
- **Multiple Selection**: Select multiple images or videos at once.
- **Compression**: Compress images by max width/height/quality, and videos by preset (iOS).
- **Media Type**: Filter by photo, video, or any.
- **Base64 and EXIF**: Optionally include base64 data and EXIF metadata in the response.
- **Cleanup**: Remove temporary files created during selection.
- **Customization**: Extensive options for UI colors, text, and behavior (e.g., crop frame, guidelines, toolbar).
## Installation
```bash
npm i react-native-image-crop-picker --save
```
For iOS, run `cd ios && pod install`. Add usage descriptions to `Info.plist` (e.g., `NSPhotoLibraryUsageDescription` for photo library access). For Android, add necessary permissions to `AndroidManifest.xml` (e.g., camera, storage).
## Usage
```javascript
import ImagePicker from 'react-native-image-crop-picker';
// Single image with cropping
ImagePicker.openPicker({ width: 300, height: 400, cropping: true })
.then(image => console.log(image))
.catch(error => console.log(error));
// Multiple images
ImagePicker.openPicker({ multiple: true })
.then(images => console.log(images));
// Video only
ImagePicker.openPicker({ mediaType: 'video' })
.then(video => console.log(video));
// Camera
ImagePicker.openCamera({ width: 300, height: 400, cropping: true })
.then(image => console.log(image));
// Crop an existing file
ImagePicker.openCropper({ path: 'file-path.jpg', width: 300, height: 400 })
.then(image => console.log(image));
```
## Options
Key options include `cropping`, `width`, `height`, `multiple`, `mediaType`, `includeBase64`, `includeExif`, `compressImageMaxWidth`, `compressImageMaxHeight`, `compressImageQuality`, `freeStyleCropEnabled`, `cropperCircleOverlay`, and many more. See the README for the full list.
## Response
Each selected asset includes properties like `path`, `width`, `height`, `mime`, `size`, `duration` (for videos), `data` (if base64), `exif`, and `cropRect`. iOS also provides `localIdentifier`, `sourceURL`, `creationDate`, and `modificationDate`.
## Notes
- For React Native new architecture, use version >= 0.50.0.
- On Android, avoid setting `cropping` to `true` when selecting videos, as it may hide videos in the gallery.
- The module creates temporary files; use `clean()` or `cleanSingle(path)` to remove them.
## License
MIT (implied by repository, but not explicitly stated in the provided README).
Comments
0 Rating appears after 10 ratings
Sign in to join the discussion.