Jetpack Compose中如何优雅实现Modifier的条件属性设置？

方案1：同修饰符不同参数直接嵌入if表达式 #

针对同一个修饰符仅参数不同的场景，直接在参数位使用Kotlin的if表达式即可，无需拆分Modifier链：

Box(
    modifier = Modifier
        .fillMaxHeight()
        .requiredWidth(if (isFlag) expandedSizeA else expandedSizeB)
        .align(Alignment.Center)
)

方案2：不同修饰符使用then方法拼接 #

如果需要根据条件添加完全不同的修饰符，可以使用Modifier自带的then()方法拼接条件返回的Modifier实例：

Box(
    modifier = Modifier
        .fillMaxHeight()
        .then(
            if (isFlag) Modifier.requiredWidth(expandedSizeA)
            else Modifier.padding(80.dp, 30.dp, 80.dp, 0.dp)
        )
        .align(Alignment.Center)
)

如果条件不满足时不需要添加任何修饰符，else分支直接返回Modifier即可。

方案3：封装通用扩展函数全局复用 #

如果高频使用条件修饰逻辑，可以封装全局扩展函数简化调用：

// 放在项目公共工具类中复用
fun Modifier.conditional(
    condition: Boolean,
    ifBranch: Modifier.() -> Modifier,
    elseBranch: Modifier.() -> Modifier = { this }
): Modifier = if (condition) {
    ifBranch()
} else {
    elseBranch()
}

使用示例：

Box(
    modifier = Modifier
        .fillMaxHeight()
        .conditional(isFlag,
            ifBranch = { requiredWidth(expandedSizeA) },
            elseBranch = { padding(80.dp, 30.dp, 80.dp, 0.dp) }
        )
        .align(Alignment.Center)
)

如果不需要else分支，可以省略elseBranch参数，条件不满足时会直接返回原Modifier。

所有上述写法都原生支持Compose重组，当isFlag是可观察State对象时，修饰符会随状态变化自动更新。

内容的提问来源于stack exchange，提问作者Ralf Wickum