如何在显示react-native模式时隐藏statusBar？

Question

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

我的设置是如下，但预期它不会工作：

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

Answer 1

这是一个已知的问题而且似乎是没有官方/做出反应的方式来解决它。您可以按照这里的讨论：

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> 

现金去Traviskn和mbashiq谁提出上述修正。我建议你订阅issue。

Answer 2

根据该文档，你应该能够隐藏不论是iOS状态栏，并采用了Android这个

import {StatusBar} from 'react-native'; 
StatusBar.setHidden(true);