Jetpack Compose中innerPadding导致组件顶部额外留白问题求助

Scaffold的innerPadding是根据配置的topBar、bottomBar等组件尺寸计算出的内边距集合。哪怕你给topBar传了空的lambda，Scaffold依然会默认预留标准topBar高度对应的顶部内边距，这就导致内容组件顶部被加上了额外空白。

提供三种实用方案，按需选择：

方案1：仅应用底部内边距 #

既然只需要避开bottomBar的遮挡，没必要全量应用innerPadding，只提取底部的padding值即可：

Scaffold(
    topBar = {},
    bottomBar = {}
) { innerPadding ->
    Box(
        modifier = Modifier.padding(bottom = innerPadding.calculateBottomPadding())
    ) {
        RootNavigationGraph(navController)
    }
}

方案2：将topBar设为null #

如果确定不需要顶部导航栏，直接把topBar参数设为null，Scaffold就不会计算顶部的预留内边距了：

Scaffold(
    topBar = null,
    bottomBar = {}
) { innerPadding ->
    Box(
        modifier = Modifier.padding(innerPadding)
    ) {
        RootNavigationGraph(navController)
    }
}

方案3：手动覆盖顶部内边距 #

如果需要保留topBar的空lambda（比如后续要扩展topBar功能），可以手动将顶部内边距设为0，只保留其他方向的必要padding：

Scaffold(
    topBar = {},
    bottomBar = {}
) { innerPadding ->
    Box(
        modifier = Modifier.padding(
            start = innerPadding.calculateStartPadding(LayoutDirection.Ltr),
            top = 0.dp,
            end = innerPadding.calculateEndPadding(LayoutDirection.Ltr),
            bottom = innerPadding.calculateBottomPadding()
        )
    ) {
        RootNavigationGraph(navController)
    }
}

内容的提问来源于stack exchange，提问作者Delug3