键盘避免视图在选择屏幕底部的某些文本输入框时不会将视图移动到足够高的位置



这是针对使用React-Native创建的iOS应用程序。我以包含一些TextInput字段的形式使用KeyboardAvoidingView。我已经观察到,当TextInput字段朝屏幕底部选择时,视图的移动不足以容纳键盘。

我创建了一个零食,可以演示这种行为(下面的链接)。我还观察到,在某些情况下,该视图在一种iPhone上移动得足够高,但另一个iPhone则没有。最初,iPhone 6S的报告是报道了该问题,其中用户报告说,该视图的移动不足以容纳键盘,在这种情况下,他们看不到他们在输入输入框的内容。当我试图创建零食来复制问题时,我发现即使在iPhone 5s上也可以复制。

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

在上面的小吃中,如果单击带有值jugTextInput框,则应看到键盘重叠了输入框,并且看不到。我为小吃的质量感到抱歉。我只是试图创建一个最小的示例来重现问题。

如何解决此问题?

我也经历了这个问题(在Android上)。他们的关键是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顶部之间的偏移,因此如果该数字为nonzero,则不够移动。

要解决此问题,要么添加一个明确的 keyboardVerticalOffset,如果已知,这样...

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

...或将KeyboardAvoidingView移至组件树的根部,以便上方没有偏移。

最新更新