A React Native module that can create scaled versions of local images (also supports the assets library on iOS).

$ yarn add github:appfolio/react-native-image-utils

$ react-native link react-native-image-utils

If using cocoapods in the ios/ directory run

$ pod install

1. In XCode, in the project navigator, right click Libraries ➜ Add Files to [your project's name]
2. Go to node_modules ➜ react-native-image-utils ➜ ios and add AEImageUtils.xcodeproj
3. In XCode, in the project navigator, select your project. Add libAEImageUtils.a to your project's Build Phases ➜ Link Binary With Libraries
4. Run your project (Cmd+R)<

1. Open up android/app/src/main/java/[...]/MainApplication.java

• Add import com.appfolio.react.imageutils.AEImageUtilsPackage; to the imports at the top of the file
• Add new AEImageUtilsPackage() to the list returned by the getPackages() method

2. Append the following lines to android/settings.gradle:

   include ':react-native-image-utils'
   project(':react-native-image-utils').projectDir = new File(rootProject.projectDir, 	'../node_modules/react-native-image-utils/android')
   

3. Insert the following lines inside the dependencies block in android/app/build.gradle:

     compile project(':react-native-image-utils')
   

import ImageUtils from 'react-native-image-utils';

ImageUtils.createResizedImage(imageUri, newWidth, newHeight, compressFormat, quality, rotation, outputPath).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.
});

A basic, sample app is available in the example folder. It uses the module to resize a photo from the Camera Roll.

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 <Image> component.