在 jetpack compose 中使用 .shadow 和 Button 会导致问题

Question

我想使用.shadow 运算符为我的按钮添加阴影，但正如您在图像中看到的那样，我得到了一个白色背景。

Answer 1

在 Jetpack Compose 中，Modifier.shadow() 的顺序很重要。首先使用阴影。

Button(
    modifier = Modifier
        .shadow(2.dp, RoundedCornerShape(2.dp))
        .height(36.dp),
    onClick = { /*TODO*/ }) {
    Text("Button")
}

对

Button(
    modifier = Modifier
        .height(36.dp)
        .shadow(2.dp, RoundedCornerShape(2.dp)),
    onClick = { /*TODO*/ }) {
    Text("Button")
}