React本机状态条样式不能覆盖本机android状态栏样式

Question

我试图在componentDidMount上将状态条半透明设置为false，但它似乎不起作用。我这样做的原因是不同的(因为我使用的是react-native-bootsplash，这要求我拥有本地样式)，但总的来说，它似乎不起作用。

styles.xml

​

<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <!-- Customize your theme here. -->
    <item name="android:textColor">#000000</item>
    <item name="android:windowTranslucentStatus">true</item>
</style>

<style name="BootTheme" parent="AppTheme">
    <item name="android:background">@drawable/bootsplash</item>
</style>

​

Login.js

componentDidMount(): void {
    .
    .
    StatusBar.setTranslucent(false);
    StatusBar.setBackgroundColor("#FFF");
}
.
.
.
render() {
    const Navigation = this.props.navigation;

    return (
        <>
            <StatusBar backgroundColor="white" barStyle="dark-content"/>
    .
    .
    .
}

Answer 1

您可以定义两个状态条，一个是正常的，另一个是半透明的。然后，你可以用状态来控制它的情况。例如；

render() {

    return (

        <View>

            {
                this.state.translucency  ?

                    <View>
                        /* custom style for statusbar */
                        <View style={{backgroundColor: "black", height:statusBarHeight, opacity: 0.3}}/>
                        <StatusBar backgroundColor={statusbarColor} barStyle="light-content" />
                    </View>

                    :

                    <StatusBar />

            }

        </View>

    );

}