Image is not rendering in iOS

[Yandamuri]

Image is not rendering in iOS. I tried in

iPhone 6(iOS 12.5.2), iPhone SE(iOS 14.4.2), Emulator - iPhone 12 Pro

Are there any settings to be enabled specific for iOS?

[iMonk777]

I've had the same issue on IOS. I manage to fix it by using the renderImage prop, and render my own image component. @Yandamuri

[Yandamuri]

@iMonk777 Able to render image , but it's size is very small as shown below,

And this is how I rendered

  return (
        <View style={{flex: 1}}>
            <ImageViewer 
                                   imageUrls={images}
                                   renderImage={() => <Image style={{height: '100%', width: '100%'}} resizeMode={'contain'} source={{uri:`${axios.defaults.baseURL}${url}`, headers}} />}
                                   enableImageZoom={true}
                                   backgroundColor={TEXT_HEADERBLACK}
                                   maxOverflow={0}
                                   renderIndicator={() => <></>}
                             />
        </View>
);

What changes should I do to make image fit to the screen?

[iMonk777]

Tried the same code as yours @Yandamuri , And it works for me. It is probably related to your image resolution? Maybe try a bigger resolution image from google, just for testing. Also, if you have an array of images, the URL for each image can be taken from the source, like below

 renderImage={({ source }) => (
                            <Image
                                source={source} //here my source is an object {uri: 'my image link'}
                                style={styles.image}
                            />
                        )}

[Yandamuri]

@iMonk777 I have tried multiple hd images like 750 × 1334 But still result is same. Strange thing is Images are rendering as expected in android. Problem is with iOS only. Tried in both Simulator and real device. But result is same.

Did you try in iOS?

Any guess that why it is not working in iOS?