Full Screen Background Image behaves differently from network and local storage

问题

I am trying to stretch a background-image to full screen.
Images seem to behave differently when fetched from Network and from Local storage.

This function does not stretch the image as requested (there is a white margin of around 70 pixels from the right): This is my render() fundtion:

  var BackgroundImage = require('./images/logo_og.png');

  render(){
    return(
      <View style={[{flex: 1, alignItems: 'stretch'}]}>
      <Image source={BackgroundImage} style={[{flex: 1}]} >
      </Image>
    </View>
  );

The same render function works well displaying the image being fetched from the network:

  render(){
    return(
      <View style={[{flex: 1, alignItems: 'stretch'}]}>
      <Image source={{uri:'https://facebook.github.io/react/img/logo_og.png'}} style={[{flex: 1}]} >
      </Image>
    </View>
  );

any idea what is going on?

回答1:

Similar issue was reported here. Try setting the Image's width to null:

<Image source={BackgroundImage} style={[{flex: 1, width: null}]} >

来源：https://stackoverflow.com/questions/40706127/full-screen-background-image-behaves-differently-from-network-and-local-storage