Simbaclaws commented on issue #189:
URL: 
https://github.com/apache/cordova-plugin-statusbar/issues/189#issuecomment-750866061


   Dear @aacassandra, personally because of this bug I decided to use a 
different native runtime then cordova since I was using ionic framework version 
4+. Nowadays some cordova plugins tend to have issues with newer versions of 
operating systems from android and iOS.
   
   I'm using a native runtime for web apps called: 
[capacitor](https://capacitorjs.com/)
   
   Currently I'm using [status 
bar](https://capacitorjs.com/docs/apis/status-bar) from capacitor in order to 
style my status bar correctly across newer and older versions of ios and 
android.
   
   Here are 2 services that I made in ionic angular to get information about 
the platform you're using and to set the statusbar according to the current 
platform you are on in either a "dark" or "light" mode.
   
   Information service using capacitor:
   ```
   import { Injectable } from '@angular/core';
   import { Plugins } from '@capacitor/core';
   import { Platform } from '@ionic/angular';
   
   const { Device } = Plugins;
   
   @Injectable({
     providedIn: 'root'
   })
   export class InformationService {
   
     constructor(
       private platform: Platform
     ) { }
   
     async givePlatform() {
       return this.platform.ready().then(async ()=>{
         const info = await Device.getInfo();
         return info.platform;
       });
     }
   }
   ```
   
   statusbar service using capacitor:
   ```
   import { InformationService } from './information.service';
   import { Injectable } from '@angular/core';
   import { Plugins, StatusBarStyle } from '@capacitor/core';
   
   const { StatusBar } = Plugins;
   
   @Injectable({
     providedIn: 'root'
   })
   export class StatusbarService {
   
     constructor(
       private info: InformationService
     ) { }
   
     changeStatusBar(color) {
       this.info.givePlatform().then((platform) => {
         if (platform !== 'web') {
           if (color === 'dark') {
             StatusBar.setStyle({
               style: StatusBarStyle.Dark
             });
             if (platform === 'android') {
               StatusBar.setBackgroundColor({
                   color: '#121212'
               });
             } else if (platform === 'ios') {
               StatusBar.setBackgroundColor({
                 color: '#000000'
               });
             }
           } else if (color === 'light') {
             StatusBar.setStyle({
               style: StatusBarStyle.Light
             });
             StatusBar.setBackgroundColor({
               color: '#ffffff'
             });
           }
           StatusBar.setOverlaysWebView({
             overlay: false
           });
       }});
     }
   }
   ```
   
   In my case my app's theme had different dark colors for ios and android, 
hence I made a platform check that changed the bar color based on the platform. 
You can change this if you like.
   
   Be weary (all of this is ionic 4+ with angular)
   
   This might not be related to the current cordova plugin issue we're having, 
but this is how I solved it on my app.


----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

For queries about this service, please contact Infrastructure at:
[email protected]



---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]

Reply via email to