Question

我正在Ionic中构建一个渐进式Web应用程序，我想将其添加到主屏幕并更改iOS状态栏的背景颜色和文本颜色。

我做了什么

我安装了： "@ionic-native/status-bar": "^5.0.0"

在index.html中，我定义了：

  <meta name="apple-mobile-web-app-capable" content="yes"/>
  <meta name="apple-mobile-web-app-status-bar-style" content="default"/>

在app.component.ts中：

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

这里的问题是，由于我的iPhone处于黑暗模式，因此状态栏将为黑色。我想始终将状态栏背景设置为白色，将文本颜色设置为黑色，而不管我是否处于暗模式。

我已经尝试了很多东西，但是都没有用：

<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"/>

<meta name="apple-mobile-web-app-status-bar-style" content="translucent"/>

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

上面的第一个和第二个选项只会将状态栏的背景和文本颜色设置为白色（这意味着您根本看不到状态栏），而第三个选项则没有任何改变（背景仍然为黑色）。

Answer 1

您可以将以下设置添加到config.xml中，这是一种解决方法：

<config-file parent="UIUserInterfaceStyle" platform="ios" target="*-Info.plist">
    <string>Light</string>
</config-file>

基于@unamanic，位于https://github.com/apache/cordova-plugin-statusbar/issues/148

Ionic：无法在黑暗模式下更改iOS状态栏颜色

1 个答案: