javascript - React Native - 使背景图像避免键盘

Question

我有一个用于页面的“全屏”背景图片:

container = {
    flex: 1,
    width: null,
    height: null
}

<View ...>
    ...
    <Image ... styles={container}>
        ...
        <TextInput ... />
        ...
    </Image>
</View>

但是，您可能会注意到，点击文本输入会打开键盘并且 View 高度会发生变化。由于图像被设置为覆盖，它也会随着 View 尺寸的变化而调整。我想要父 View 的高度和 <Image>不受键盘影响，只有 <Image> 的内容应该被键盘向上推。

我知道有一个 <KeyboardAvoidingView> 可用，但我不确定如何使用它，或者它是否能处理这种情况。

任何想法都会很棒。谢谢。

Answer 1

我在 React Native 中喜欢这样做并且它有效:

backgroundImage: {
    position: 'absolute',
    left: 0,
    top: 0,
    width: Dimensions.get('window').width,
    height: Dimensions.get('window').height,
},