How to hide status bar?


#1

Hi,
I need to play some video in Fullscreen. However, I am stuck with android transparent Status bar.

Screenshot

I tried a few ways to hide it, however, every single one of them is not working. The most recent solution included plugin to do the show() and hide().

Implemented like this

import statusBar = require("nativescript-status-bar");
.
.
.
constructor(){

  statusBar.hide();

}

What is the right way to hide or remove status bard from the android app using TNS + NG.


java.lang.NoSuchFieldError about system UI light status bar on Android platform
#2

This blogpost: https://bradmartin.net/2016/03/10/fullscreen-and-navigation-bar-color-in-a-nativescript-android-app/ explains the native android approach to do this.
Something like the following is what you’re looking for on Android in NativeScript. There are a bunch of other flags you can set on the window also if you want some specific behavior in addition to hiding the status bar.

  if (app.android && platform.device.sdkVersion >= '21') {
        var window = app.android.startActivity.getWindow();
        // set the status bar to Color.Transparent
        window.setStatusBarColor(0x000000);
 
        var decorView = window.getDecorView();
        decorView.setSystemUiVisibility(
            View.SYSTEM_UI_FLAG_LAYOUT_STABLE
            | View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION
            | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
            // | View.SYSTEM_UI_FLAG_HIDE_NAVIGATION // hide nav bar
            // | View.SYSTEM_UI_FLAG_FULLSCREEN // hide status bar
            | View.SYSTEM_UI_FLAG_IMMERSIVE_STICKY);
    }

#3

Hi @peter.staev
This works for me

const app = require("application")

// Hide Status bar android
    if (app.android) {
        const activity = app.android.startActivity;
        const win = activity.getWindow();
        win.addFlags(android.view.WindowManager.LayoutParams.FLAG_FULLSCREEN);
    }
// Show Status bar android
    if (app.android) {
        const activity = app.android.startActivity;
        const win = activity.getWindow();
        win.clearFlags(android.view.WindowManager.LayoutParams.FLAG_FULLSCREEN);
    }

#4

Thank you, very good