Versucht, die Textfarbe der ionischen App-Statusleiste zu ändern

Question

Es scheint eine Vielzahl von Threads zu geben, die dies diskutieren, aber keine wirkliche Lösung. Ich hatte gehofft, es wäre etwas Einfaches. Im Grunde genommen möchte ich nur die Textfarbe der Statusleiste ändern, da meine Kopfzeile/Navigationsleiste/Statusleiste dunkelblau ist. Die Standardtextfarbe ist schwarz und ich möchte sie nur in Weiß ändern, so einfach ist das.

Wo mache ich diese Änderungen? Ich habe bereits das Statusleisten-Plugin installiert und meine Konfigurationsdatei ist unten (dies ist ohne irgendwelche Änderungen in einigen Threads vorgeschlagen).

<preference name="webviewbounce" value="false" /> 
<preference name="UIWebViewBounce" value="false" /> 
<preference name="DisallowOverscroll" value="true" /> 
<preference name="android-minSdkVersion" value="16" /> 
<preference name="BackupWebStorage" value="none" /> 
<preference name="StatusBarStyle" value="default" /> 
<preference name="SplashScreen" value="screen" /> 
<preference name="orientation" value="portrait" /> 
<preference name="SplashMaintainAspectRatio" value="true" /> 
<preference name="FadeSplashScreenDuration" value="300" /> 
<preference name="ShowSplashScreenSpinner" value="false" /> 
<preference name="AutoHideSplashScreen" value="false" /> 
<preference name="CordovaWebViewEngine" value="CDVWKWebViewEngine" /> 
<preference name="SplashScreenDelay" value="3000" /> 

Wie kann ich das lösen?

Answer 1

Es ist auf der Statusleiste Hintergrund hängt, wenn Sie einen dunklen Hintergrund verwenden könnten Sie dies tun:

platform.ready().then(() => { 
    // Okay, so the platform is ready and our plugins are available. 
    // Here you can do any higher level native things you might need. 
     StatusBar.styleLightContent(); 
}); 

Ich habe dieses auf den Konstruktor meiner app.component.ts

Um zu testen, weitere Optionen können Sie die doc überprüfen here

Answer 2

In app.js Datei gelten diese:

.run(function($ionicPlatform) { 
    $ionicPlatform.ready(function() { 
    // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard) 
    if (window.cordova && window.cordova.plugins.Keyboard) { 
     cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true); 
    } 
    if (window.StatusBar) { 
     // org.apache.cordova.statusbar required 
     // StatusBar.styleDefault(); 
     StatusBar.style(1) 
    } 
    }); 
}) 

Weitere Optionen sind:

• StatusBar.style(1) // Licht
• StatusBar.style(2) // Schwarz, durchscheinend
• StatusBar.style(3) // Schwarz, opak
• Statusbar.styleColor ('black')
• Statusbar.styleHex('#FF0000')// Rot