Jetpack Compose: Can't make statusBar completely transparent

qfunz 0
Viewed 56

I have a screen, which contains a Map and I want to make a statusBar completely transparent.

What I've tried:

implementation "com.google.accompanist:accompanist-systemuicontroller:0.26.1-alpha"

@Composable
fun MapMainScreen() = Column(
    modifier = Modifier.fillMaxSize()
) {
    val controller = rememberSystemUiController()
    controller.setStatusBarColor(color = Color.Transparent)
    controller.setNavigationBarColor(color = Color.Transparent)
    controller.setSystemBarsColor(color = Color.Transparent)
    
    Map()
}

Also, I've tried to play with window in MainActivity before and in setContent call:

WindowCompat.setDecorFitsSystemWindows(window, false)
window.setFlags(
    WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS,
    WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS
)

I want to see a result like in Google Maps, but now my statusBar has a White-Gray color instead of Transparent

enter image description here

enter image description here

How can I fix this and make my statusBar Transparent?

android-statusbar android-jetpack-compose android
1 Answers

This is what Accompanist suggests in the doc:

// Remember a SystemUiController
val systemUiController = rememberSystemUiController()
val useDarkIcons = !isSystemInDarkTheme()

DisposableEffect(systemUiController, useDarkIcons) {
    // Update all of the system bar colors to be transparent, and use
    // dark icons if we're in light theme
    systemUiController.setSystemBarsColor(
        color = Color.Transparent,
        darkIcons = useDarkIcons
    )

    // setStatusBarColor() and setNavigationBarColor() also exist

    onDispose {}
}

Also the latest version is : 0.26.3-beta

Code Poet0
Related