如何在Ionic 2中更改状态栏的颜色

时间:2017-09-05 23:05:17

标签: colors ionic2 header statusbar

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

当我将其构建为apk并安装在我的Android手机上时,此图显示了我的状态栏

enter image description here

但我想这样做(如果可能的话)

enter image description here

2 个答案:

答案 0 :(得分:4)

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

要更改颜色,您可以在构造函数中尝试 app.component.ts

(假设你已经在你的ctor上注射了statusBar: StatusBar

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

不确定如何减少它的不透明度,就像你展示的例子一样。也许:

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

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

答案 1 :(得分: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/