react-native-image-size (iOS + Android)

Android 4.0 (API level 14) introduced the ability to get original image size.

iOS uses Image.getSize https://facebook.github.io/react-native/docs/image#getsize

Installation

Download via NPM

1npm i -S react-native-image-size

Download via Yarn

1yarn add react-native-image-size

Afterward make sure to rebuild app, not just refresh bundler.

Linking (for React Native <= 0.59 only, React Native >= 0.60 skip this as auto-linking should work)

-- Automaticaly --

Link, either via react-native link or manually

1react-native link react-native-image-size

-- Manually --

android/settings.gradle

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

android/app/build.gradle

1dependencies {
2  ...
3+  implementation project(':react-native-image-size')
4  ...
5}

android/app/src/main/java/.../MainApplication.java

1+import com.existfragger.rnimagesize.RNImageSizePackage;
2...
3@Override
4protected List<ReactPackage> getPackages() {
5  return Arrays.<~>asList(
6-    new MainReactPackage()
7+    new MainReactPackage(),
8+    new RNImageSizePackage()
9  );
10}

How to use

1import ImageSize from 'react-native-image-size'
2...
3ImageSize.getSize(uri).then(size => {
4    // size.height
5    // size.width
6})

You can also use async/await, if you would prefer.

1import ImageSize from 'react-native-image-size'
2...
3foo = async () => {
4  const { width, height } = await ImageSize.getSize(uri);
5  // do stuff with width and height
6}