Cordova Android状态栏设置为透明

时间:2015-09-13 05:40:06

标签: android cordova phonegap-plugins

我正在尝试使用下面的插件将状态栏设置为透明。但我无法实现它,我可以将它改为不同的颜色,但不透明。 https://github.com/apache/cordova-plugin-statusbar

它也适用于我的Android 5.0.2,但不适用于5.0。

我试图忽略它们建议但不起作用的十六进制值,我尝试了下面的所有内容,没有一个将我的状态栏设置为透明。

<preference name="StatusBarBackgroundColor"/>

    <preference name="StatusBarStyle" value="lightcontent" />



if (cordova.platformId == 'android') {
StatusBar.styleBlackTranslucent();
}

3 个答案:

答案 0 :(得分:1)

我尝试了很长时间才能解决此问题。没有文档说明如何使状态栏对于Android包含的<ion-header>

填充物透明

这就是我如何解决它。在 app.component.ts 中的平台就绪后:

if (this.platform.is('android')) {
   Plugins.StatusBar.setOverlaysWebView({overlay: true});
   Plugins.StatusBar.setBackgroundColor({color: '#33000000'});
}

如果要使状态栏透明,请不要设置背景色。在我的情况下,它将是不透明度为20%的黑色状态栏。

black status bar with 20% opacity

并且不要忘记,当您在 app.module.ts 中导入其模块时,会强制Ionic进行状态栏填充。否则您的标头会粘在状态栏上:

IonicModule.forRoot({_forceStatusbarPadding: true})

版本:

  • ionic-native / status-bar:^ 5.0.0
  • capacitor / android:^ 2.1.0

答案 1 :(得分:0)

我刚发现它,在文档中没有提及,但它很简单:

<preference name="StatusBarBackgroundColor" value="transparent" />

瞧,它的工作:)

答案 2 :(得分:0)

使用 IONIC Native Status Bar Plugin

app.component.ts:

import { Platform } from '@ionic/angular';
import { StatusBar } from '@ionic-native/status-bar/ngx';
...
...
constructor(private platform: Platform, private statusBar: StatusBar){
  this.initializeApp();
}

initializeApp() {
  this.platform.ready().then(() => {
    this.statusBar.overlaysWebView(true);
    this.statusBar.backgroundColorByHexString('#33000000');
  });
}

app.module.ts:

IonicModule.forRoot({_forceStatusbarPadding: true})