react-native：android：带软菜单的模态高度

Question

在带有软底菜单栏的Samsung Galaxy S8上，我的全屏模态组件随机呈现全屏高度，或者为软菜单栏留出空间。此行为完全是随机的，仅限于Modal组件。我正在使用0.57.5的react-native的最新版本，但这已经发生在几个版本上。

我正在使用如下所示的全屏AppTheme风格：

<style name="AppTheme" parent="Theme.ReactNative.AppCompat.Light.NoActionBar.FullScreen">

状态栏也被隐藏，如下所示：

StatusBar.setHidden(true);

从屏幕截图中可以看出，在Modal决定不以全高渲染的情况下，背景会渗透。

有没有人遇到并修复过这样的问题？

Answer 1

对于其他任何人，如果您根据文档使用react-native-modal，则必须使用react-native-extra-dimensions-android。

React-Native在检测某些设备的正确设备宽度/高度时存在一些问题。如果您遇到此问题，则需要安装react-native-extra-dimensions-android。然后，提供真实的窗口高度（从react-native-extra-dimensions-android获得）到模态：

  render() {
  const deviceWidth = Dimensions.get("window").width;
  const deviceHeight = Platform.OS === "ios"
    ? Dimensions.get("window").height
    : require("react-native-extra-dimensions-android").get("REAL_WINDOW_HEIGHT");

  return (
  <Modal
    isVisible={this.state.isVisible}
    deviceWidth={deviceWidth}
    deviceHeight={deviceHeight}
  >
    <View style={{ flex: 1 }}>
      <Text>I am the modal content!</Text>
    </View>
  </Modal>
  )
}

https://github.com/react-native-community/react-native-modal