Immersive mode in android, only transparency

Question

I want to use the "immersive mode" in my app. I am following the documentation and working properly:

 private View mDecorView;
...

     @Override
        public void onWindowFocusChanged(boolean hasFocus) {
            super.onWindowFocusChanged(hasFocus);
            if (hasFocus) {
                mDecorView.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
                        | View.SYSTEM_UI_FLAG_FULLSCREEN
                        | View.SYSTEM_UI_FLAG_IMMERSIVE_STICKY);
            }
        }
...
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.test);
        mDecorView = getWindow().getDecorView();

    }

This enables immersive full-screen mode. My problem is that I want to use only FLAG_IMMERSIVE_STICKY, as the same result as the Trello app:

The bars are transparent and are always visible. I searched for information and different combinations, but I get the result I want. I appreciate any help.

Thank you!

Answer 1

The documentation also states that you have to set the UI Flags for the activity in the onCreate method. - https://developer.android.com/training/system-ui/immersive.html

Implement these two methods and call hideSystemUI in the onCreate method

// This snippet hides the system bars.
private void hideSystemUI() {
    // Set the IMMERSIVE flag.
    // Set the content to appear under the system bars so that the content
    // doesn't resize when the system bars hide and show.
    mDecorView.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);
}

// This snippet shows the system bars. It does this by removing all the flags
// except for the ones that make the content appear under the system bars.
private void showSystemUI() {
    mDecorView.setSystemUiVisibility(
            View.SYSTEM_UI_FLAG_LAYOUT_STABLE
            | View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION
            | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN);
}

This should hide the statusBar and the navigationBar. The documentation states that this should hide both, navigation and statusbar. For me it just hides the StatusBar.

I hope this helps.

Answer 2

Trello is using translucent bars [1], not immersive mode, with a custom transparent action bar background.

[1] https://developer.android.com/about/versions/android-4.4.html#TranslucentBars

Answer 3

The flags you're looking for are:

• WindowManager.LayoutParams.FLAG_TRANSLUCENT_STATUS and
• WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION

You can also use the flags in your theme using:

<item name="android:windowTranslucentStatus">true</item>
<item name="android:windowTranslucentNavigation">true</item>

Unfortunately, it won't immediately appear like the Trello app if your app uses an action bar. You'll have to use some tricks/hacks to make it look like the Trello app. In the case that your app uses action bars, you could save yourself the time and use this library instead*. Needless to say, this will only work on API 19+.

*Personally, I don't endorse use of transparent system bars just for the sake of extending action bar colors. I feel it should only be used if you have content to show underneath the system bars or if you have a full-screen activity.