Overlay 中的键盘覆盖了一半的屏幕答案

【问题标题】：Keyboard cover half of the screen in OverlayOverlay 中的键盘覆盖了一半的屏幕
【发布时间】：2019-06-27 10:41:11
【问题描述】：

我的应用中有一个覆盖组件上的 TextInput。打开键盘时，屏幕会覆盖一半，包括 TextInput。我确实尝试了 KeyboardAvoidingView 组件，但无法让 TextInput 完全可见。当在 react-native 中启用键盘时，我需要一些关于如何在 Overlay 中移动组件的建议

【问题讨论】：

标签： react-native

【解决方案1】：

如果你发布了代码，它会更容易回答，但仍然

keyboardAvoidview 解决了视图需要移开虚拟键盘的常见问题。它可以根据键盘的位置自动调整其位置或底部填充

只需将其添加到您的最大视图下即可

<KeyboardAvoidingView style={styles.container} behavior="padding" enabled>
 all ur ui inside this...
</KeyboardAvoidingView>

【讨论】：

【解决方案2】：

有一个叫keyboardVerticalOffset的道具，也就是用户屏幕顶部和 React Native 视图之间的距离。

<KeyboardAvoidingView style={styles.container} behavior="padding" enabled keyboardVerticalOffset={offsetValue}>
  ... your UI ...
</KeyboardAvoidingView>;

keyboardVerticalOffset 的值在某些用例中可能不为零。但是对于您的情况，请尝试增加一些价值。

如果您想了解更多关于在 react native 中处理键盘的信息check this

【讨论】：