How to hide the status bar and draw on it

Question

I know it sounds duplicate but it is not. I have read a whole article about implementing what I want at android studio official site but no help.

My goal is to draw behind the system bars like this photo: ( I also want the hide the system bars which in this picture does not happen )

In other words I want to open my app in an immersive/fullscreen mode which is required in almost every app.

But whenever I try to draw behind the status bar (the bar that shows notification and battery etc.), the status bar and its items reveal themselves meaning the content I drew behind the status bar is obscured by the content of the status bar.

and whenever I try to hide the status bar, my content do not appear behind it. it is like a paradox.

To draw behind the system bars I use this method, as the above link suggests:

WindowCompat.setDecorFitsSystemWindows(getWindow(), false);

To hide the system bars I use this:

windowInsetsController.hide(WindowInsetsCompat.Type.systemBars());

But whenever I do each of them, it undoes the other one.

Answer 1

Fixed here. Just needed to handle devices with cutouts.

Answer 2

hello @YoloWex you just need to use a Fullscreen theme in your app theme style.xml and make sure the "android:windowFullscreen" is set to true

 <style name="Theme.myApp" parent="Theme.AppCompat.Light.NoActionBar.FullScreen">

    <item name="android:windowNoTitle">true</item>
    <item name="android:windowActionBar">false</item>
    <item name="android:windowFullscreen">true</item>
    <item name="android:windowContentOverlay">@null</item>

    <!-- Primary brand color. -->
    <item name="colorPrimary">@color/purple_500</item>
    <item name="colorPrimaryVariant">@color/purple_700</item>
    <item name="colorOnPrimary">@color/white</item>
    <!-- Secondary brand color. -->
    <item name="colorSecondary">@color/teal_200</item>
    <item name="colorSecondaryVariant">@color/teal_700</item>
    <item name="colorOnSecondary">@color/black</item>
    <!-- Status bar color. -->
    <item name="android:statusBarColor" tools:targetApi="l">?attr/colorPrimaryVariant</item>
    <!-- Customize your theme here. -->
</style>