为 Material Design 3 for compose 创建主题时如何处理形状

Question

我目前有一个用 jetpack compose 编写的应用程序，它使用 Material-Theming-Support 来自 androidx.compose.material:material。

from / import androidx.compose.material.MaterialTheme

@Composable
fun MaterialTheme(
    colors: Colors = MaterialTheme.colors,
    typography: Typography = MaterialTheme.typography,
    shapes: Shapes = MaterialTheme.shapes,
    content: @Composable () -> Unit
)

我现在计划迁移到 Material3：androidx.compose.material3:material3（我知道，仍处于测试阶段）。

但是，主题可组合项现在不再允许任何形状

from / import androidx.compose.material3.MaterialTheme

@Composable
fun MaterialTheme(
    colorScheme: ColorScheme = MaterialTheme.colorScheme,
    typography: Typography = MaterialTheme.typography,
    content: @Composable () -> Unit
)

我现在应该如何处理我的旧形状定义？ material-网站仅在 xml 和 old view-system.

中讨论如何做到这一点

Answer 1

Material Design 3 / Material You still don't have shapes. 所以要使用形状创建 composition local,

在目录 ui/theme 中创建 Shape.kt Kotlin 文件粘贴以下代码

Shape.kt

data class Shape(
    val default: RoundedCornerShape = RoundedCornerShape(0.dp),
    val small: RoundedCornerShape = RoundedCornerShape(4.dp),
    val medium: RoundedCornerShape = RoundedCornerShape(8.dp),
    val large: RoundedCornerShape = RoundedCornerShape(16.dp)
)

val LocalShape = compositionLocalOf { Shape() }

val MaterialTheme.shapeScheme: Shape
    @Composable
    @ReadOnlyComposable
    get() = LocalShape.current

现在，在撰写中使用形状

shape = MaterialTheme.shapeScheme.large

例如。在卡片中撰写

Card(
        modifier = Modifier
            .fillMaxWidth()
            .wrapContentHeight()
            .padding(all = 16.dp),
        shape = MaterialTheme.shapeScheme.large,
        backgroundColor = MaterialTheme.colorScheme.surface,
        border = BorderStroke(width = 1.dp, color = MaterialTheme.colorScheme.inverseOnSurface),
        elevation = 1.dp
    ) {
...
}

编辑： Check this

为 Material Design 3 for compose 创建主题时如何处理形状

How to handle Shape when creating a theme for Material Design 3 for compose

material-design

android-jetpack-compose

material-components-android