Search code examples
react-nativeexpoimage-manipulation

Expo ImageManipulator won't return desired result


I'm trying to use Expo ImageManipulator to resize an image selected from device.

The result I'm getting is a weird object like this, so it doesn't work:

{"_h": 0, "_i": 0, "_j": null, "_k": null}

Why would it be so?

Here's my code:

...
import { manipulateAsync, SaveFormat } from "expo-image-manipulator";

const resizeImage = async (image) => {
    return await manipulateAsync(
      image.uri,
      [
        {
          resize: {
            width: 300,
          },
        },
      ],
      {
        format: SaveFormat.JPEG,
      }
    );
  };

Solution

  • Your resizeImage function is an async function. While calling this function you will either need to await (in a try-catch block) the function call or use Promise Chaining

    1st Method:

    const yourFunction = async () => {
      try {
        const desiredResult = await resizeImage(yourImage);
        console.log(desiredResult);
      } catch (e) {
        console.log(e);
      }
    };
    
    

    2nd Method:

    resizeImage(yourImage)
      .then(desiredResult => console.log(desiredResult))
      .catch(error => console.log(error));