Why image has padding in React Native on Android?

Question

I'am using background image for the React Native application screen and want to squeeze image to the right side. On iOS look's good but on Android image has a padding from the right side. Why this happening? How to fix this? Thank's in advance!

<View style={{width: '100%', height: '100%', backgroundColor: '#fff',}}>
    <Image style={{flex: 1, resizeMode: 'contain',}} source={require('./../styles/image/building.png')}/>
</View>

Answer 1

It's because you have different screen resolutions on one device vs the other. Your Android device my be wider. Change your resizeMode to 'cover'. I don't know how your containing View is positioned relative to its parent but it doesn't appear that your centering the image inside of it's view either. That's why the image padding is displayed on the right on wider devices.

<View style={{width: '100%', height: '100%', backgroundColor: '#fff', alignItems: 'center'}}>
    <Image style={{flex: 1, resizeMode: 'cover',}} source={require('./../styles/image/building.png')}/>
</View>