如何使Surface背景透明（Jetpack Compose）

Question

我有这样的实现

Surface(
                    modifier = Modifier.background(Color.Transparent),
                    shape = RoundedCornerShape(corner = CornerSize(2.dp)),
                    border = BorderStroke(width = 1.dp, color = showpageColorAgvotBoarder)
                ) {
                    Text(
                        modifier = Modifier.padding(2.dp),
                        text = item,
                        style = ShowpageAgvotStyle
                    )
                }

我得到的结果是

就像整个背景是黑色的，然而，表面背景是白色的......

我只需要一个边框，表面的背景应该是透明的（在这种情况下黑色，因为整个背景是黑色的）

我做错了什么？

Answer 1

您需要使用

color = Color.Transparent

参数而不是

Modifier.background(Color.Transparent)

Surface(
    modifier = Modifier,
    shape = RoundedCornerShape(corner = CornerSize(2.dp)),
    border = BorderStroke(width = 1.dp, color = Color.Red),
    color = Color.Transparent // This is what you're missing
) {
   Text(
        modifier = Modifier.padding(2.dp),
        text = "item",
        color = Color.Gray
   )
}

Answer 2

Surface

的背景颜色基于

color

属性。
默认为：

• MaterialTheme.colors.surface

  （M2）

• MaterialTheme.colorScheme.surface

  （M3）。

用途：

Surface(
    color = Color.Transparent,
    //..
) {
     //...
}

Answer 3

Surface

有一个新的

color

参数，用于指示颜色而不是修饰符。