如何通过 Compose 删除原生导航栏高度?

Mar*_*ron 2 android android-jetpack-compose

我正在尝试消除屏幕底部的本机导航按钮和应用程序内容之间的微弱分隔线。

这就是我所拥有的 - 您可以看到我的应用程序的导航按钮和底部导航栏之间有一个非常微弱的分隔线。是海拔吗?阴影?

在此输入图像描述

但这就是我想要的(这是 Android Slack 应用程序)- 全部相同的颜色。 在此输入图像描述

在我的应用程序中,我明确将底部导航栏设置为白色,并使用accompanist库将导航栏设置为白色,如下所示:

BottomNavigation(
        modifier = Modifier
            .background(Color.White),
        backgroundColor = Color.White,
        elevation = 0.dp,
    )

...

    val systemUiController = rememberSystemUiController()
    SideEffect {
        systemUiController.setSystemBarsColor(
            color = Color.White,
        )
    }
Run Code Online (Sandbox Code Playgroud)

我还可以做些什么?

Mar*_*ron 6

我发现了这个问题 - 看起来如果 被Scaffold包裹在 中ModalBottomSheetLayout,它会对 进行像这样的奇怪的颜色变化BottomNavigation

为了避免这种情况,你可以这样做:

    ModalBottomSheetLayout(
        sheetElevation = 0.dp,
        bottomSheetNavigator = bottomSheetNavigator,
    ) { ... }
Run Code Online (Sandbox Code Playgroud)

然后“微弱的分隔线”就消失了!

ModalBottomSheetLayout也来自伴奏库 -com.google.accompanist:accompanist-navigation-material