react-native - 显示 native 模式时如何隐藏状态栏？

Question

当显示模态窗口时，我想隐藏状态栏。

我的设置如下，但它不会按预期工作:

<StatusBar animated={true} hidden={true}  translucent={true}>

Answer 1

这是一个已知问题 并且似乎还没有官方/React 方法来修复它。您可以在此处关注讨论:

https://github.com/facebook/react-native/issues/7474

我在这个讨论中看到了一个帖子，它提出了一个隐藏它的技巧，但我还没有在我的项目中尝试过。如果它对你有用，你也可以为这个技巧点赞。

<View style={styles.outerContainer}
  <View style={styles.container}>
    <StatusBar hidden={true}/>
    <View style={styles.content}>
  </View>
  <Modal animation={fade} transparent={true}>
          {/*Modal Contents Here*/}
  </Modal>
</View>

更可靠的修复可能是更改原生 android 代码中的事件主题。

<resources>
    <!-- Base application theme. -->
    <style name="AppTheme" parent="Theme.ReactNative.AppCompat.Light.NoActionBar.FullScreen">
        <!-- Customize your theme here. -->
    </style>
    <style name="AppTheme.Launcher">
        <item name="android:windowBackground">@drawable/launch_screen</item>
    </style>
</resources>

积分转至 特拉维斯克 和 姆巴希克 谁提出了上述修复程序。我建议您订阅 issue .