在 ionic 3 的初始屏幕期间更改状态栏颜色答案

【问题标题】：change status bar color during splash screen in ionic 3在 ionic 3 的初始屏幕期间更改状态栏颜色
【发布时间】：2018-08-16 05:24:21
【问题描述】：

我已经用过了

cordova-plugin-splashscreen

在 config.xml 中

<preference name="SplashStatusBarBackgroundColor" value="#b83500" />
<preference name="SplashNavigationBarBackgroundColor" value="#b83500" />
<platform name="android">
    ...
</platform>

这是行不通的并在component.ts中

this.statusBar.backgroundColorByHexString('#b83500');

但在启动画面后会发生变化。

那么，如何在启动画面期间更改状态栏颜色。

【问题讨论】：

状态栏需要两种不同的颜色吗？
不，只有 #b83500 但在我的应用程序中。

标签： ionic-framework ionic3 statusbar

【解决方案1】：

删除启动画面插件并从

安装此版本的插件

ionic cordova plugin rm cordova-plugin-splashscreen
ionic cordova plugin add https://github.com/goinnn/cordova-plugin-splashscreen.git#4.0.0#colors

然后，您可以在 configx.xml 文件中添加您已经提到的首选项。但是，请务必将它们放在 android 部分中

<platform name="android">
    <preference name="SplashStatusBarBackgroundColor" value="#b83500" />
    <preference name="SplashNavigationBarBackgroundColor" value="#b83500" />
    ...
</platform>

这会解决你的问题。

请记住，这将导致 ios 版本出现问题，因为这是插件本身的旧版本。然而，它在 android 上完美运行。

这只会改变初始屏幕上状态栏的颜色。要保持颜色变化，您需要在 app.component.ts 文件中保留以下代码。

this.statusBar.backgroundColorByHexString('#b83500');

【讨论】：

【解决方案2】：

对于Android，在styles.xml 中添加以下内容（我显示的是白色背景的状态栏）

    <style name="AppTheme.NoActionBar" parent="Theme.AppCompat.NoActionBar">
        <item name="android:statusBarColor">@android:color/white</item>
    </style>

    <style name="AppTheme.NoActionBarLaunch" parent="AppTheme.NoActionBar">
        <item name="android:statusBarColor">@android:color/white</item>
    </style>

【讨论】：