Scaffold 中 PaddingValues 参数的用途是什么

Question

@Composable
fun LayoutsCodelab() {
    Scaffold(
        topBar = {
            TopAppBar(
                title = {
                    Text(text = "LayoutsCodelab")
                }
            )
        }
    ) { innerPadding ->
        BodyContent(Modifier.padding(innerPadding))
    }
}

删除innerPadding不会改变任何东西。 请注意，我是Compose

新手。 如果有任何困惑，请在评论中询问

Answer 1

仅当您设置了 BottomBar 参数时，才会设置为您的内容提供的填充值。不幸的是这没有记录。如果设置bottomBar，Scaffold 会将 PaddingValues 的底部填充设置为bottomBar 内容使用的内容的高度。其他填充值（开始、顶部、结束）当前设置为零。不确定将来是否会改变。

如果您的内容包含可滚动列表并且您希望将列表底部偏移 BottomBar 内容的高度，则提供底部内边距非常有用。如果您不包含任何 BottomBar 内容，则 PaddingValues 将始终保持设置为零。

下面的示例显示了当 BottomBar 使用 BottomAppBar 时如何将 PaddingValues 参数传递到您的内容中。它显示 50 个项目的列表。将填充添加到列后，您可以滚动到底部并查看最后一项。如果删除列的填充并重复测试，当滚动到底部时，最后几个项目不可见，因为列一直延伸到脚手架的底部，没有任何底部填充，并且底部应用栏覆盖了最后的那些项目项目：

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        startActivity(intent)

        setContent {

            Scaffold(
                topBar = {
                    TopAppBar(
                        title = {
                            Text(text = "Padding values in a scaffold")
                        }
                    )
                },
                bottomBar = {
                    BottomAppBar() {
                        CompositionLocalProvider(LocalContentAlpha provides ContentAlpha.high) {
                            IconButton(onClick = { /* doSomething() */ }) {
                                Icon(Icons.Filled.Menu, contentDescription = "Localized description")
                            }
                        }
                        Spacer(Modifier.weight(1f, true))
                        IconButton(onClick = { /* doSomething() */ }) {
                            Icon(Icons.Filled.Favorite, contentDescription = "Localized description")
                        }
                        IconButton(onClick = { /* doSomething() */ }) {
                            Icon(Icons.Filled.Favorite, contentDescription = "Localized description")
                        }
                    }
                }
            ) { paddingValues ->
                Column(modifier = Modifier
                    .fillMaxSize()
                    .padding(bottom = paddingValues.calculateBottomPadding())
                    .verticalScroll(rememberScrollState())) {

                    Text("Bottom app bar padding:  $paddingValues")

                    repeat(50) {
                        Text(it.toString())
                    }
                }
            }
        }
    }
}

我不明白为什么谷歌不包括顶部填充。毕竟，如果包含顶部应用栏，它也会占用空间。我认为原因与顶部栏杆的倒塌有关。如果顶部应用栏在滚动时折叠，则内容区域需要扩展 - 因此向顶部添加填充可能没有意义。如果顶部应用栏保持固定，这确实有意义。