如何在 Compose 中创建可重用的修饰符？

Question

我的大部分屏幕（视图）都从一个 Box 可组合项开始，以包含所有子可组合项（组件）。

// background
Box(
        modifier = Modifier
            .fillMaxSize()
            .background(customColor)
    ) 
{
// foreground
Column()

}

与其在每个屏幕上创建修改器属性，不如如何创建可重复使用的修改器？

Answer 1

你可以这样创建它

fun Modifier.myModifier(customColor: Color) = this.then(
    Modifier.fillMaxSize().background(customColor)
)

Answer 2

在这种简单的情况下，您可以执行以下操作（无需使用then）：

fun Modifier.myModifier(customColor: Color) =
    this.fillMaxSize()
        .background(customColor)

如果您需要使用 remember 或其他用 @Composable 注释的状态构建器在修改器中保存任何状态，您可以使用 Modifier.composed 来完成。例如，您可以通过以下方式向修改器添加动画：

fun Modifier.myModifier(customColor: Color): Modifier = composed {
    val animatedColor by animateColorAsState(customColor)
    this.fillMaxSize()
        .background(animatedColor)
}

请注意，在 composed 中，您应该只使用带状态注释的可组合项，而不是视图。可以找到更多详细信息 .

如何在 Compose 中创建可重用的修饰符？

How can you create a reusable modifier in Compose?

kotlin

android-jetpack-compose