我正在 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();
});
上面的第一个和第二个选项只是将状态栏背景和文本颜色设置为白色(这意味着您根本看不到状态栏),而第三个选项没有改变任何东西(背景仍然是黑色)。