将resizeMode设置为“ repeat”的React Native ImageBackground没有覆盖整个元素（剩余空白）

Question

我正在尝试使用覆盖整个设备屏幕的单个ImageBackground元素创建“平铺”背景。我的问题是，即使ImageElement覆盖了整个屏幕（如附加图像上的红色边框所示），内部图像也仅覆盖了整个宽度，并在垂直方向留有空白。我已经检查过文档，但找不到任何相关内容。这是我的组件

      <ImageBackground source={require('../../images/linepattern.jpg')} style={[styles.container]}
  resizeMode='repeat' 
  imageStyle={{resizeMode : 'repeat', overflow : 'visible', backfaceVisibility: 'visible', flex : 1}}>

及其样式

container: {

flex : 1,
borderColor: 'red',
borderWidth:10

}

感谢您的帮助。

Answer 1

尝试一下

<ImageBackground 
  source={require('../../images/linepattern.jpg')}  
  style={styles.container}
  imageStyle={{resizeMode : 'repeat', overflow : 'visible', backfaceVisibility: 'visible', flex : 1, }}>

 ....

</ImageBackground>

然后

container:{height:'100%, width:'100% }