如何将颜色从一个可组合项传递到另一个可组合项？

Question

如何将颜色从一个可组合项传递到另一个可组合项？问题是有问题的颜色值“无法重新分配”，因此我似乎无法将其作为参数传递。

所以，基本上，这是第一个可组合项的片段：

val buttonColor = when (index) {
                0 -> if (isEnabled) Color(0xff81C784)
                else disabledColor
                1 -> if (isEnabled) Color(0xff9575CD)
                else disabledColor
                2 -> if (isEnabled) Color(0xffFF8A65)
                else disabledColor
                3 -> if (isEnabled) Color(0xff5C6BC0)
                else disabledColor
                else -> Color.Unspecified
            }

            Button(modifier = Modifier.padding(10.dp).height(60.dp),
                elevation = ButtonConstants.defaultElevation(8.dp),
                colors = ButtonConstants.defaultButtonColors(
                    backgroundColor = buttonColor
                ),

我想在第二个可组合项中使用该按钮颜色作为强调色：

CustomToggle(color = color,
                    selected = isDisabled.value,
                    onSelected = {
                        isDisabled.value = !isDisabled.value
                        when (index) {

                        }
                    }
                )

我的想法只是将颜色作为参数引入我的父可组合项中：

@Composable
    fun MainInterface(context: Context, color: Color) {
    
    [...]


            bodyContent = {
                ScrollableColumn(horizontalAlignment = CenterHorizontally) {
                    QuickOptions(context, color)
                    Spacer(modifier = Modifier.height(40.dp))
                    SoundOptions(color)
                }
}

但我不能，因为我不能将 buttonColor 作为参数传递...我尝试将第二个可组合项插入到第一个可组合项中，但我仍然无法将颜色传递给第二个可组合项。

Answer 1

所以我想我会解释我所做的，希望它能在将来帮助其他人。

首先，在我的顶级可组合项 Scaffold 中，我添加了可变状态变量。然后是两个可组合项。最上面的一个更改了 accentColor 的值，第二个接收新值：

Scaffold(
            ...
            
            bodyContent = {

                val accentColor = remember { mutableStateOf(Color(0xff81C784)) }

                QuickOptions(accentColor.value) { newColor ->
                        accentColor.value = newColor}
                    
                SoundOptions(accentColor = accentColor)

                }
            },
        )

然后我指出必须在第一个可组合项的 onClick 事件中传递什么颜色：

@Composable
fun QuickOptions(accentColor: Color, onColorChanged: (Color) -> Unit) {

...

onClick = {
                    if (isSelectable == true) {
                        val newColor = when (index) {
                            0 -> Color(0xff81C784)
                            1 -> Color(0xff9575CD)
                            2 -> Color(0xffFF8A65)
                            3 -> Color(0xff9FA8DA)
                            else -> Color.Unspecified
                        }
                        onColorChanged(newColor)
                        
... }

最后我将其传递给第二个可组合项：

@Composable
fun SoundOptions(accentColor: MutableState<Color>) {
...

CustomToggle(
                    color = accentColor.value
                ) {}
    }

祝你好运！

如何将颜色从一个可组合项传递到另一个可组合项？

How to pass a color from one Composable to another?

android

android-jetpack-compose