如何让Jetpack Compose中的Snackbar不显示在FloatingActionButton上方？

我希望Snackbar显示在FloatingActionButton下方，或至少与它重叠。点击FloatingActionButton调用snackbarHostState.showSnackbar(snackbarText)时，出现了Snackbar位于按钮上方的情况。

我的AndroidManifest代码如下：

<activity android:name=".YourActivity"
    android:windowSoftInputMode="adjustResize"/> 

Scaffold中相关代码：

Scaffold(
    snackbarHost = { SnackbarHost(hostState = snackbarHostState) },
    floatingActionButtonPosition = FabPosition.End,
    floatingActionButton = {
        FloatingActionButton(
            onClick = { snackbarHostState.showSnackbar(snackbarText) },
            modifier = Modifier.visible(fabState?.isVisible ?: false),
        ) { Icon(Icons.Default.SaveAlt) }
    },
// ...
) {}

1. 确保Scaffold默认布局协调生效 #

Compose的Scaffold内置了Snackbar与FloatingActionButton的位置协调逻辑：Snackbar显示时，FAB会自动上移，Snackbar固定在FAB下方区域。如果你的场景不符合这个逻辑，先排查两点：

• 不要给SnackbarHost添加自定义Modifier（比如align、offset），这会破坏Scaffold的内置布局计算。
• 确保FloatingActionButton没有被固定位置的容器（如带固定offset的Box）包裹，导致Scaffold无法感知它的位置。

2. 调整WindowSoftInputMode配置 #

你当前设置的adjustResize会在软键盘弹出时强制重调布局大小，可能干扰Scaffold对Snackbar和FAB的位置计算。可以尝试修改为adjustPan或直接移除该属性：

<activity android:name=".YourActivity"
    android:windowSoftInputMode="adjustPan"/> 

或者移除该配置：

<activity android:name=".YourActivity"/>

3. 自定义SnackbarHost位置（强制Snackbar在FAB下方） #

如果默认行为无法满足需求，可自定义SnackbarHost的布局，强制让Snackbar显示在FAB下方：

Scaffold(
    snackbarHost = { hostState ->
        SnackbarHost(hostState) { data ->
            Box(
                modifier = Modifier
                    .fillMaxWidth()
                    .padding(bottom = 80.dp) // 根据FAB大小调整padding值，确保Snackbar低于按钮
            ) {
                Snackbar(snackbarData = data)
            }
        }
    },
    floatingActionButtonPosition = FabPosition.End,
    floatingActionButton = {
        FloatingActionButton(
            onClick = { snackbarHostState.showSnackbar(snackbarText) },
            modifier = Modifier.visible(fabState?.isVisible ?: false),
        ) { Icon(Icons.Default.SaveAlt) }
    },
// ...
) {}

4. 优化FAB动态显示的布局计算 #

如果FAB是动态显示/隐藏的，给它添加animateContentSize修饰符，让Scaffold更准确地感知布局变化：

FloatingActionButton(
    onClick = { snackbarHostState.showSnackbar(snackbarText) },
    modifier = Modifier
        .visible(fabState?.isVisible ?: false)
        .animateContentSize(),
) { Icon(Icons.Default.SaveAlt) }

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