How to remove Android System navigation bar?

ionic-v1
1

Hi,

I’d like to remove/hide this android navigation bar when an Ionic app is launched.
Is there a way to do it? In native Android app, I saw you can handle this in Java.

Alternatively, an other solution would consists on rooting my device, and remove this bar for all the system (ie. in any app, this bar will completely disapear ). But this seems really overkill to me.

OS : Android 4.4.2
Thanks !!

2

By default, I don’t think you can, but there is this plug in which looks promising.

.run(function($ionicPlatform) {
  $ionicPlatform.ready(function() {
    window.AndroidFullScreen.immersiveMode(successFunction, errorFunction);

    function successFunction() {
      console.log("It worked!");
    }

    function errorFunction(error) {
        console.log(error);
      }
      // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
      // for form inputs)
    if (window.cordova && window.cordova.plugins.Keyboard) {
      cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
    }
    if (window.StatusBar) {
      StatusBar.styleDefault();
    }
  });
})
3

Thanks, I tried it. Unfortunately, there is currently a annoying bug:

When going to home screen then resuming the app, the status bar is always displayed (tested on Android 4.4.2).
I opened an issue on the git repo.

4

Is there a fix for this? I’m trying to display content that is hiding behind that navigation bar.

5

Also working on a project where we have this exact program. The system navigation bar overlaps content in our app, very annoying.

6

I know this is an old issue, but I had the same kind of question. I needed to run an app in fullscreen mode (immersive). The documentation of the plugin mentioned states: “Since the release of android@5.0.0, setting in config.xml will use immersive mode, where available, even without this plugin.”

Therefore for anyone who runs by this issue; maybe setting the preference <preference name="Fullscreen" value="true" /> is enough for you. Try it out. It will set immersive mode if possible and will automatically hide and show buttons on interaction.

3 Likes
7

works wonderful, thanks!

8

Reading this old thread, it seems to me as if the confic.xml solution only works for 5+ Android versions. So for older phones, you still need the Plugin, right? Does anyone knowh whether the bug reported above (disabled nav bar reappears on app resume) has been fixed? Thanks in advance, if you know about this and can help out quickly.

9

having the same problem the tab bar is hidden by the navigation bar
any help?