mirror of
https://github.com/status-im/react-native-image-crop-picker.git
synced 2025-02-23 02:48:12 +00:00
react-native-image-crop-picker
iOS/Android image picker with support for multiple images and cropping
NOTE: This library is result of one-night hacking, so please use it with caution. Don't assume there are no bugs. It is tested just on simple cases.
Result
iOS



Android



Usage
Import library
import ImagePicker from 'react-native-image-crop-picker';
Call single image picker with cropping
ImagePicker.openPicker({
width: 300,
height: 400,
cropping: true
}).then(image => {
console.log(image);
});
Call multiple image picker
ImagePicker.openPicker({
multiple: true
}).then(images => {
console.log(images);
});
Response Object
Property | Type | Description |
---|---|---|
path | string | Selected image location |
width | number | Selected image width |
height | number | Selected image height |
mime | string | Selected image MIME type (image/jpeg, image/png) |
size | number | Selected image size in bytes |
Install
npm install react-native-image-crop-picker --save
iOS
pod 'react-native-image-crop-picker', :path => '../node_modules/react-native-image-crop-picker/ios'
Android
// file: android/settings.gradle
...
include ':react-native-image-crop-picker'
project(':react-native-image-crop-picker').projectDir = new File(settingsDir, '../node_modules/react-native-image-crop-picker/android')
// file: android/app/build.gradle
...
dependencies {
...
compile project(':react-native-image-crop-picker')
}
// file: MainActivity.java
...
import com.reactnative.picker.PickerPackage; // import package
public class MainActivity extends ReactActivity {
/**
* A list of packages used by the app. If the app uses additional views
* or modules besides the default ones, add more packages here.
*/
@Override
protected List<ReactPackage> getPackages() {
return Arrays.<ReactPackage>asList(
new MainReactPackage(),
new PickerPackage() // Add package
);
}
...
}
How it works?
It is basically wrapper around few libraries
Android
- Native Image Picker
- uCrop
iOS
- QBImagePickerController
- RSKImageCropper
License
MIT
Languages
Objective-C
64%
Java
29.5%
JavaScript
4.4%
Ruby
1.3%
Starlark
0.8%