Как передать цвет из одного составного в другой?
Как я могу передать цвет из одного компонуемого в другой? Проблема в том, что рассматриваемое значение цвета «не может быть переназначено», поэтому, похоже, я не могу передать его в качестве параметра.
Итак, по сути, это фрагмент из первого Composable:
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
),
И я хочу использовать этот buttonColor в качестве цвета акцента во втором Composable:
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 в качестве параметра... Я пытался вставить второй Composable внутри первого, но я все еще не могу передать цвет второму Composable.
Спасибо, я думаю, что это правильно, и мне нужно реализовать нечто, называемое поднятием состояния. Я не уверен, как это сделать в приведенном выше случае, поэтому любая помощь будет приветствоваться.
Если вы просматриваете свои компонуемые как дерево вызовов, где-то есть вызов, общий для этих двух компонуемых. Это может быть лямбда setContent() в корне или, возможно, немного ниже по дереву. Где бы это ни было, объявите свой State и передайте его по дереву вызовов этим двум компонуемым, чтобы один мог читать из него, а другой мог его модифицировать. Здесь вы «подняли» это State до ближайшего общего компонуемого.
Спасибо, это имеет смысл. Все еще пытаюсь применить это, но я доберусь туда в конце концов!
Хорошо, я понял благодаря этой очень полезной статье: codingtroops.com/android/…
Ответы 1
Поэтому я подумал, что объясню, что я сделал, в надежде, что это может помочь кому-то еще в будущем.
Во-первых, в мой лучший составной объект, Scaffold, я добавил изменяемую переменную состояния. Затем два Composables. Верхний меняет значение акцента, второй получает новое значение:
Scaffold(
...
bodyContent = {
val accentColor = remember { mutableStateOf(Color(0xff81C784)) }
QuickOptions(accentColor.value) { newColor ->
accentColor.value = newColor}
SoundOptions(accentColor = accentColor)
}
},
)
Затем я указал, какие цвета нужно передать в событии onClick первого Composable:
@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:
@Composable
fun SoundOptions(accentColor: MutableState<Color>) {
...
CustomToggle(
color = accentColor.value
) {}
}
Удачи!
Такое ощущение, что ваш цвет — это какой-то
State(например,remember { mutableStateOf<Color>() }, на который должен измениться первый составной объект, а второй — на ссылку. Затем, когда первый составной объект изменяет состояние, второй составной объект будет перекомпонован и будет использовать новый цвет.