ImageManipulator Multi-image process - Same image returned

#1

I am attempting to resize an array of images, but i keep getting the same image returned multiple times.

I’m wondering if this could be by design in the Native Module? Maybe some constant is being set and is preventing iteration? (not sure if that would even be possible).

Or is it something wrong with my code design?

Here’s just a few of the methods i’ve tried without success -
(Expo v27)
Method 1:

_start = async (images) => {
     
    let results = images.map(async (image) => { 
         var manipResult = await ImageManipulator.manipulate(
                          image.uri,
                          [{ resize: { height: 300 }}],
                          { format: 'jpeg', compress: 1}
                        )
             console.log(manipResult)   // same photo, different URIs
             return manipResult
              });

      Promise.all(results).then((completed) => {
        console.log(completed)   // same photo, different URIs
      });
}

Method 2:

// helper method constant:
const asyncForEach = async (array, callback) => {
  for (let index = 0; index < array.length; index++) {
    await callback(array[index], index, array)
  }
}

_start = async (images) => {
     let resized = []
     await asyncForEach(images, async (images) => {
        let manipResult = await ImageManipulator.manipulate(
                    images.uri,
                    [{ resize: { height: 300 }}],
                    { format: 'jpeg', compress: 1}
                  )
                   resized.push(manipResult)
            })
            console.log(resized);  // same photo, different URIs
}

Method 3:

_start = async (images) => {
     
 for (var asset of images){
      console.log(asset.uri) // Different photos
        let manipResult = await ImageManipulator.manipulate(
          asset.uri,
          [{ resize: { height: 300 }}],
          { format: 'jpeg', compress: 1}
        )
        console.log(await manipResult); // same photo, different URIs
      }
}
#3

Figured it out! This was my mistake.

Using: AssetUtils from ‘expo-asset-utils’ returns 2 URIs (uri & localUri),
“uri” is the duplicate for some reason, “localUri” is correct

I guess I will leave my post up for anyone who is interested in Async iteration patterns for multi-image processing?

1 Like
#4

glad you figured it out!

closed #5

This topic was automatically closed 15 days after the last reply. New replies are no longer allowed.