React-native 模态对话框隐藏自定义键盘答案

【问题标题】：React-native modal dialog hides custom keyboardReact-native 模态对话框隐藏自定义键盘
【发布时间】：2018-05-08 18:06:29
【问题描述】：

我们在 react-native 中使用了 custom keyboard，它工作正常（这仅适用于 android，此处不需要 iOS），但与模态对话框一起使用时会出现问题。

如下图所示，键盘在模态框下方弹出，无法输入任何值。我们尝试了几种模式组件的选项，包括默认的 react-native 模式组件，但它们都给出了相同的结果。

这个SO comment on a similar issue 让我觉得它可能与模式对话框上设置的标志有关，正如here 所解释的那样：

您通常希望在当前输入法之上显示一个对话框，因为它没有理由接受文本。您可以通过使用以下代码设置 WindowManager.LayoutParams.FLAG_ALT_FOCUSABLE_IM 窗口标志（假设您的 Dialog 采用输入焦点，这是默认设置）来做到这一点：

 getWindow().setFlags(WindowManager.LayoutParams.FLAG_ALT_FOCUSABLE_IM,
     WindowManager.LayoutParams.FLAG_ALT_FOCUSABLE_IM);

但是当我们使用标准的安卓键盘时，它会按预期显示在模式上方，所以这似乎不是问题。键盘实际上是作为一个单独的 RN 应用程序启动的：

rootView.startReactApplication(
    ((ReactApplication) activity.getApplication()).getReactNativeHost().getReactInstanceManager(),
            "CustomKeyboard",
            bundle);

final float scale = activity.getResources().getDisplayMetrics().density;
RelativeLayout.LayoutParams lParams = new RelativeLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, Math.round(216*scale));
lParams.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM, RelativeLayout.TRUE);
layout.addView(rootView, lParams);

然后在聚焦文本输入时显示：

activity.addContentView(keyboard, new ViewGroup.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT));

我不了解 android，但我怀疑我需要在创建内容视图时传递一些额外的参数，例如 these，以确保它可以超越我的模态。我在正确的轨道上吗？关于这些参数可能是什么的任何提示？

编辑：这是相关代码的一部分（我认为）。 react-native-modal 是 this one，但是使用 react-native 的默认模态组件会得到相同的结果：

import Modal from 'react-native-modal';
...(parent component code)...
render() {
    ...
    <Modal isVisible={this.state.isShowingDialog}>
    ...(modal box content, all inside a <View>)...
    </Modal>
    ...
}

【问题讨论】：

是否可以发布您正在使用的模态的 RN 代码
@IsmailIqbal 我用一些代码编辑了这个问题。希望对您有所帮助！

标签： android react-native modal-dialog

【解决方案1】：

如果您的活动具有此属性，则将其删除：

<activity 
    android:windowSoftInputMode="adjustResize">

【讨论】：

我们的代码中似乎没有这个属性。我检查了应用程序的AndroidManifest.xml，但它也不存在。