This is the modified version of image cropping library https://github.com/meznaric/react-native-image-cropping
This is designed to work for local and network images, follow the installation as original library and replace the file ReactNativeImageCropping.m which should be enough to accept images.
let ReactNativeImageCropping = NativeModules.ReactNativeImageCropping;
ReactNativeImageCropping
.cropImageWithUrl(imagePath, 'PATH') // this can be 'PATH for local images and 'URL' for network images
.then(image => {
//Image is saved in NSTemporaryDirectory!
//image = {uri, width, height}
console.log(image.uri);
},
err => console.log(err));
Simple react-native image cropping library wrapper around siong1987/TOCropViewController
Supported only on iOS.
npm install react-native-image-cropping --save- In XCode, in the project navigator, right click
Libraries➜Add Files to [your project's name] - Go to
node_modules➜react-native-image-croppingand addReactNativeImageCropping.xcodeproj - In XCode, in the project navigator, select your project. Add
libReactNativeImageCropping.ato your project'sBuild Phases➜Link Binary With Libraries - Click
ReactNativeImageCropping.xcodeprojin the project navigator and go theBuild Settingstab. Make sure 'All' is toggled on (instead of 'Basic'). Look forHeader Search Pathsand make sure it contains both$(SRCROOT)/../react-native/Reactand$(SRCROOT)/../../React- mark both asrecursive. - Re-run your project (
Cmd+R)
If you get stuck open an issue. It's the first time I've published react native package and I may have not provided all necessary information.
const React = require('react-native');
const {ReactNativeImageCropping} = React.NativeModules;It is using RCTImageLoader so it should be able to crop any image that react knows how to load / display.
const originalImage = require('CrazyFlowers.jpg');
ReactNativeImageCropping
.cropImageWithUrl(originalImage.uri)
.then(image => {
//Image is saved in NSTemporaryDirectory!
//image = {uri, width, height}
},
err => console.log(b));Available aspect ratios:
- AspectRatioOriginal
- AspectRatioSquare
- AspectRatio3x2
- AspectRatio5x4
- AspectRatio4x3
- AspectRatio5x4
- AspectRatio7x5
- AspectRatio16x9Example:
let aspectRatio = ReactNativeImageCropping.AspectRatioSquare;
ReactNativeImageCropping
.cropImageWithUrlAndAspect(imageUrl, aspectRatio)
.then(image => {
//Image is saved in NSTemporaryDirectory!
//image = {uri, width, height}
},
err => console.log(b));