如何在 Ionic 2 中使状态栏颜色可变

Posted 2023-04-18

【中文标题】如何在 Ionic 2 中使状态栏颜色可变

【英文标题】：How to make status bar color changeable in Ionic 2

【发布时间】：2018-02-14 07:28:42

【问题描述】：

我看到很多由 ionic 2 开发的应用程序支持状态栏颜色与标题相同的颜色，但我无法在我的应用程序中这样做

当我将它构建为 apk 并安装在我的 android 手机上时，此图像显示了我的状态栏

但我想这样做（如果可能的话）

【参考方案1】：

您可以参考以下文档： https://ionicframework.com/docs/native/status-bar/

要更改颜色，您可以在 constructor 中尝试 app.component.ts：

（假设你在你的ctor上注入了statusBar: StatusBar）

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

不确定如何像您展示的示例那样降低它的不透明度。也许：

this.statusBar.styleBlackOpaque()
//or
this.statusBar.styleBlackTranslucent()

让我们知道什么对您有用。

【讨论】：

您的案例/上面的示例使用了什么十六进制值？

你可以使用你的标题十六进制颜色，但尽量让它更暗

不需要透明一点吗？

我检查了其他 2 个代码，但没有任何反应 this.statusBar.styleBlackOpaque() //或 this.statusBar.styleBlackTranslucent()

如果我想将背景颜色更改为白色并将图标更改为黑色怎么办。我将背景颜色更改为白色，但图标仍然是白色。你能帮帮我吗？

【参考方案2】：

您对代码的回答

//set top status bar overlay
statusBar.overlaysWebView(true);
// set status bar to red
statusBar.backgroundColorByHexString('#f00');

访问此站点以获取链接并通过代码了解更多教程

获取完整代码

http://www.jawabadda.com/pages/technical-guru/how-to-change-color-top-status-bar-in-ionic/