在屏幕底部选择一些TextInput框时，KeyboardAvoidingView不会将视图移动到足够高的位置

Question

这适用于使用react-native创建的iOS应用。我在包含几个KeyboardAvoidingView字段的表单中使用TextInput。我观察到，当选择了朝向屏幕底部的TextInput字段时，视图的移动不足以容纳键盘。

我创建了一个演示此行为的小吃（下面的链接）。我还观察到，在某些情况下，视图在一个iPhone上移动得足够高，而在另一个iPhone上移动得不够。最初，报告了iPhone 6S Plus的问题，其中用户报告视图没有移动到足以容纳键盘，在这种情况下，他们无法看到他们输入的输入框。当我试图创造一个小吃来重现这个问题时，我发现即使在iPhone 5s上我也可以重现它。

https://snack.expo.io/ry15dng2-

在上面的小吃中，如果您点击值为TextInput的{​​{1}}框，您会看到键盘与输入框重叠，并且不清晰可见。 我很抱歉小吃的质量。我只是尝试创建一个最小的例子来重现问题。

如何解决此问题？

Answer 1

我也遇到过这个问题（在Android上）。它们的关键是this prop in the KeyboardAvoidingView：

/**
 * This is the distance between the top of the user screen and the react native view,
 * may be non-zero in some use cases. The default value is 0.
 */
keyboardVerticalOffset: PropTypes.number.isRequired,

视图不会自动识别应用程序框架顶部与您正在渲染的KeyboardAvoidingView顶部之间的偏移量，因此如果该数字非零，则它不会自动移动。< / p>

要解决此问题，请添加明确的keyboardVerticalOffset（如果已知），如此...

<KeyboardAvoidingView behavior={"position"} keyboardVerticalOffset={Constants.statusBarHeight}>

...或将KeyboardAvoidingView移动到组件树的根目录，以使其上方没有偏移。