React Native：显示键盘后更新应用程序布局答案

【问题标题】：React Native: Update app layout after the keyboard is shownReact Native：显示键盘后更新应用程序布局
【发布时间】：2017-03-02 01:42:33
【问题描述】：

我现在正在解决键盘将应用程序推到视图之外的常见问题。

android:windowSoftInputMode="adjustResize" 设置不起作用。

现在我手动根据键盘调整视图大小，如下所示：

keyboardWillShow(e) {
    setTimeout(()=> {
        this.keyboardOffset = e.endCoordinates.height;
    }, 500)
}

keyboardWillHide(e) {
    this.keyboardOffset = 0;
}

///...

const resultingHeight = windowHeight - this.keyboardOffset - Navigator.NavigationBar.Styles.General.TotalNavHeight;

viewStyle = {
   height: resultingHeight
};

这几乎可行。但我的问题是应用程序被推到视图之外，然后keyboardWillShow 被触发并正确调整视图大小，然后什么也没有发生。显示键盘后，Android 不会更新布局。

编辑：SO 上的其他帖子没有帮助，因为 adjustResize 设置不起作用，我使用 react-native 而不是原生 android。

【问题讨论】：

这不是重复的。我也试过了，AndroidManifest 中的 windowSoftInputMode 都没有解决它。只是当我使用 android:windowSoftInputMode="adjustNothing" 时，视图不会消失，但同样的问题是键盘与 textInput 重叠......
如果您可以发布该视图的 xml 布局，如果您正在使用它，我可以尝试提供帮助（对不起，我什至不知道 react-native 的事情）。
android:windowSoftInputMode="adjustResize" 怎么样，啊。你已经试过了。比您在 xml 中的根布局具有错误的属性。如果你有RelativeLayout，设置这个<RelativeLayout android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true" >
@longilong 我没有描述布局的 xml。这是本机反应。
upps，对于垃圾邮件，抱歉，以前从未听说过该框架...

标签： android keyboard react-native

【解决方案1】：

如果我记得，keyboardwillShow 和 keyboardWillHide are not fired on Android。

这种行为应该是 Android 原生的，您是否尝试过如下设置 windowSoftInputMode 并且不监听事件？

android:windowSoftInputMode="adjustPan"

如果这不适合您，您可以查看KeyboardAvoidingView，0.34 的新功能。它似乎正在解决你想要完成的事情。

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

KeyboardAvoidingView Docs

【讨论】：

我尝试了 KeyboardAvoidingView。这几乎是一个可行的解决方案。我删除了 windowSoftInputMode 并为视图使用了行为“高度”。只剩下一个问题了。当键盘关闭时，视图不再调整为完整大小。
您能否在该场景中使用keyboardDidClose 并手动更改高度？
没问题，但我们仍在努力寻找可靠的解决方案 - 您是否能够使用 react-native 构建一个具有“预期”行为的 android 应用程序？

【解决方案2】：

KeyboardAvoidingView 的表现比我预期的要差，所以我用 ScrollView 创建了自己的解决方案，它包装了所有应用程序（高度在 Dimensions 的帮助下设置），然后在任何输入上单击 - 取决于输入在哪里（屏幕的下半部分/上半部分——在UIManager.measure 和TextInputState.currentlyFocusedField 的帮助下）我是否滚动视图——这对你有用吗？（在许多情况下，将视图调整为较小的高度不起作用（看起来不错））-我可以提供一些代码

【讨论】：

主要问题是整个应用程序随后被推出视图空间。滚动到文本输入不是问题。
这很有趣，可以分享一下你做的代码吗？