CODEWITHSUNDEEP
androidkotlin
Szomti
Szomti

Reputation: 57

How to make completely transparent status bar?

I want to make so my status bar is transparent, but also without icons on it. I managed to make it so that bar disappeared, but then it left a line that isn't filled with the background. I want to change that so i can actually see the background without any icons being in the way.

Also, I'm testing it on Xiaomi Redmi Note 8T

Code (with the result seen on the 1st picture)

MainActivity.kt

import android.os.Bundle
import android.view.View
import androidx.appcompat.app.AppCompatActivity
import androidx.appcompat.app.AppCompatDelegate

class MainActivity : AppCompatActivity() {

    override fun onWindowFocusChanged(hasFocus: Boolean) {
        super.onWindowFocusChanged(hasFocus)
        if (hasFocus) hideSystemUI()
    }

    private fun hideSystemUI() {SYSTEM_UI_FLAG_IMMERSIVE_STICKY
    window.decorView.systemUiVisibility = 
                (View.SYSTEM_UI_FLAG_IMMERSIVE_STICKY
                or View.SYSTEM_UI_FLAG_LAYOUT_STABLE
                or View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION
                or View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
                or View.SYSTEM_UI_FLAG_HIDE_NAVIGATION
                or View.SYSTEM_UI_FLAG_FULLSCREEN)
    }

    override fun onCreate(savedInstanceState: Bundle?) {

        AppCompatDelegate.setDefaultNightMode(AppCompatDelegate.MODE_NIGHT_NO)

        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
    }
}

Both themes.xml

<resources xmlns:tools="http://schemas.android.com/tools">
    <style name="Theme.TestingSystemModes" parent="Theme.Design.NoActionBar">
        <item name="android:forceDarkAllowed" tools:targetApi="q">false</item>
    </style>
</resources>

Here is how it looks with that line:

enter image description here

I want it to look like in the picture below, but without that status bar's icons:

enter image description here

EDIT: I think, it's phone that makes it like that ( in the center there is a camera ) and probably the black line is made to blend in the camera. That's why, whatever i did it didn't disappear. Still, thanks a lot to everyone who tried to help me.

Upvotes: 2

Views: 809

Answers (3)

Vin Norman
Vin Norman

Reputation: 3292

The problem:

Phone's can now have a "cut-out" (for notched phones etc. etc.), and when you hide the status bar properly, the phone thinks "ok, I need to make the former status bar just a black cut-out so it doesn't look silly."

The solution:

There's actually four things you need to do:

  1. Tell Android you don't want status bars in the app (hide them). There is now a correct, backwards compatible way of doing this which I will detail below.
  2. Tell Android to draw the app behind the cut-out area.
  3. Tell Android that your layout should NOT fit the system window (if you don't do this, it will STILL put your layout within the space where the status bar used to be)
  4. Manually adjust the bottom insets, as when you tell Android your layout should not fit the system window (step 3), unfortunately that's going to include the Navigation Bar, so if you don't adjust for this then your layout will be under the nav bar which may be undesirable.

The Code:

The below is a neat little extension function that will cover steps 1 and 3... (hide the status bars, set decorFitsSystemWindows to false). This allows, in your activity to simply put window.setInImmersiveMode()

fun Window.setInImmersiveMode() {
    val windowInsetsController = ViewCompat.getWindowInsetsController(decorView) ?: return
    windowInsetsController.systemBarsBehavior = WindowInsetsControllerCompat.BEHAVIOR_SHOW_TRANSIENT_BARS_BY_SWIPE
    windowInsetsController.hide(WindowInsetsCompat.Type.statusBars())
    WindowCompat.setDecorFitsSystemWindows(this, false)
}

You need to change your themes.xml to tell Android to draw behind these cutouts, with this line (api 27 and above only, hence the tools:targetApi part):

<item name="android:windowLayoutInDisplayCutoutMode" tools:targetApi="o_mr1">shortEdges</item>

And finally, there's a slightly more complex bit of code to handle setting up the bottom insets for your layout - again I've made it into an extension function so you can call view.setupInsets():

fun View.setupInsets() {
    ViewCompat.setOnApplyWindowInsetsListener(this) { view, windowInsets ->
        val insets = windowInsets.getInsets(WindowInsetsCompat.Type.systemBars())
        view.layoutParams = (view.layoutParams as FrameLayout.LayoutParams).apply {
            bottomMargin = insets.bottom
        }
        WindowInsetsCompat.CONSUMED
    }
}

Upvotes: 2

jayu pipaliya
jayu pipaliya

Reputation: 23

you can use below lines to make it transparent or can set fix color getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_STATE_HIDDEN | WindowManager.LayoutParams.SOFT_INPUT_ADJUST_RESIZE); getWindow().setStatusBarColor(ContextCompat.getColor(ContactUsActivity.this,R.color.white));// set status background white

Upvotes: 0

Chandan kushwaha
Chandan kushwaha

Reputation: 951

Set these properties in your theme. Thats all

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

Upvotes: 0

Related Questions