react-native - 将 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% }