尝试更改 Ionic 应用程序状态栏文本颜色

Question

似乎有多个线程在讨论这个问题，但没有任何真正的解决方案。我希望这会是简单的事情。基本上，我想要做的就是更改状态栏文本颜色，因为我的标题/导航栏/状态栏是深蓝色。默认文本颜色为黑色，我只想将其更改为白色，就这么简单。

我在哪里进行这些更改？我已经安装了状态栏插件，我的配置文件在下面（在某些线程中没有建议任何更改）。

<preference name="webviewbounce" value="false" />
<preference name="UIWebViewBounce" value="false" />
<preference name="DisallowOverscroll" value="true" />
<preference name="android-minSdkVersion" value="16" />
<preference name="BackupWebStorage" value="none" />
<preference name="StatusBarStyle" value="default" />
<preference name="SplashScreen" value="screen" />
<preference name="orientation" value="portrait" />
<preference name="SplashMaintainAspectRatio" value="true" />
<preference name="FadeSplashScreenDuration" value="300" />
<preference name="ShowSplashScreenSpinner" value="false" />
<preference name="AutoHideSplashScreen" value="false" />
<preference name="CordovaWebViewEngine" value="CDVWKWebViewEngine" />
<preference name="SplashScreenDelay" value="3000" />

我该如何解决这个问题？

Answer 1

这取决于状态栏背景，如果您使用深色背景，您可以这样做：

platform.ready().then(() => {
    // Okay, so the platform is ready and our plugins are available.
    // Here you can do any higher level native things you might need.
        StatusBar.styleLightContent();
});

我在 app.component.ts 的构造函数上有这个

要测试更多选项，您可以在此处查看文档

Answer 2

对于白色背景的黑色文本，您可以使用以下代码。

initializeApp() {
    this.platform.ready().then(() => {
         this.statusBar.backgroundColorByName('white');
         this.statusBar.styleDefault();
         this.splashScreen.hide();     
    });
}  

检查此链接中的输出

对于黑色背景的白色文本，您可以尝试以下代码。

initializeApp() {
    this.platform.ready().then(() => {
         this.statusBar.backgroundColorByName('black');
         this.statusBar.styleLightContent()
         this.splashScreen.hide();     
    });
}  

在此处检查代码输出