React 原生状态栏样式无法覆盖原生 android 状态栏样式



我正在尝试在组件DidMount上将状态栏半透明性设置为false,但它似乎不起作用。 我这样做的原因不同(因为我使用的是react-native-bootsplash这要求我拥有原生样式(,但总的来说它似乎不起作用。

样式.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>

登录.js

componentDidMount(): void {
.
.
StatusBar.setTranslucent(false);
StatusBar.setBackgroundColor("#FFF");
}
.
.
.
render() {
const Navigation = this.props.navigation;
return (
<>
<StatusBar backgroundColor="white" barStyle="dark-content"/>
.
.
.
}

您可以定义 2 个状态栏,其中一个是正常的,另一个是半透明的。然后,您可以使用状态来控制它的情况。例如;

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>
);
}

最新更新