当键盘以react-native显示时,自动滚动视图

时间:2016-05-27 10:54:02

标签: react-native react-native-scrollview

当我将焦点放在TextInput框中时,如何自动滚动视图并显示键盘,使得TextInput框不会隐藏在键盘后面? 这个问题已经在StackOverflow上被问了几次,我实现了解决方案here,这是大多数答案中建议的一般解决方案。此解决方案在iPhone模拟器中运行良好,但在实际手机上无法正常工作。是否有其他人遇到过这个问题,解决方案在实际手机上无法正常工作?

在添加此解决方案后我注意到的第二件事是,现在如果我专注于TextInput框并且显示键盘,如果我按下按钮或尝试聚焦到不同的TextInput框,则第一次触摸总是消耗到隐藏键盘并且未按下按钮或其他TextInput框未聚焦。用户必须进行两次操作有点烦人。还有其他人观察过这个问题吗?

如果您对如何解决这些问题有任何意见,请告诉我?

1 个答案:

答案 0 :(得分:4)

我假设你正在使用this solution。我遇到了同样的问题并进行了一些调整(see gist)。我解决了你描述的两个问题。 keyboardShouldPersistTaps解决了你的第二个问题。

我还没有找到间距在模拟器中工作的确切原因,但在真实设备上却没有。它与时间有关。原始代码在输入焦点上设置超时,并尝试在50ms后向下滚动。将其增加到例如500ms也使它在设备上工作,但我真的不喜欢添加我不理解的魔法超时。我改变了它,所以onFocus我查找元素滚动并存储引用。当onKeyboardDidShow触发时,我使用引用。