如何在Android Jetpack Compose中实现同elevation的自定义Card阴影？

我正将应用迁移至Android Jetpack Compose，想要创建如图所示的自定义Card。之前在XML里通过设置相同elevation值实现的环绕阴影效果，在Compose里没法得到一样的结果，请问怎么在Compose里实现这个效果？

默认Compose Card的阴影遵循Material Design规范，带有方向偏移，和XML的均匀环绕阴影表现不同。以下两种方法可以实现目标效果：

方法1：直接使用Modifier.shadow()自定义阴影 #

不依赖Card组件，给任意布局添加均匀阴影：

Box(
    modifier = Modifier
        .size(200.dp, 120.dp)
        .shadow(
            elevation = 8.dp,
            shape = RoundedCornerShape(16.dp),
            spotColor = Color.Black.copy(alpha = 0.2f),
            ambientColor = Color.Black.copy(alpha = 0.2f)
        )
        .background(Color.White, shape = RoundedCornerShape(16.dp))
) {
    // 放置Card内部内容
}

• 将spotColor和ambientColor设为相同的半透明黑色，就能消除阴影的方向偏移，实现均匀环绕效果
• 注意background要放在shadow之后，防止背景层覆盖阴影

方法2：修改Card的阴影配置 #

如果需要保留Card的组件特性，可通过移除LocalElevationOverlay来调整阴影表现：

CompositionLocalProvider(
    LocalElevationOverlay provides null
) {
    Card(
        modifier = Modifier.size(200.dp, 120.dp),
        elevation = CardDefaults.cardElevation(defaultElevation = 8.dp),
        shape = RoundedCornerShape(16.dp)
    ) {
        // 放置Card内部内容
    }
}

• LocalElevationOverlay是Material Design中给阴影添加方向偏移的关键，移除后Card的阴影会变成均匀环绕的样式

内容的提问来源于stack exchange，提问作者Muhammad As'ad Muyassir