Hi I m wondering if anyone would be willing to look at my co

Question

Hi I m wondering if anyone would be willing to look at my code a couple of composables on <https pastebin com XU3umSUg|Pastebin> The problem is that I am trying to pass my accentColor value down from my first to my second Composable and for some reason this is only working for the last of my four accentColor values I m still learning and would be grateful for the help blush

Zach Klippenstein (he/him) [MOD] · Answer

If you post a link i m sure someone will look at it wink

Nat Strangerweather · Answer

I did click on Pastebin slightly smiling face

robnik · Answer

It looks like you re modifying the MutableState during the composition which is not what you want Is accentColor really state It looks like it could be a local `val` different for each of the options

Nat Strangerweather · Answer

Thanks for looking I think it is a state because the color changes depending on which button I click in the QuickOptions Composable

Nat Strangerweather · Answer

So basically I worked out that state hoisting would be the best way But obviously I could be completely wrong

Zach Klippenstein (he/him) [MOD] · Answer

My bad apparently i don t see links unless they start with http see no evil

Zach Klippenstein (he/him) [MOD] · Answer

``` accentColor value = when index 0 gt if isEnabled Color 0xff81C784 else disabledColor 1 gt if isEnabled Color 0xff9575CD else disabledColor 2 gt if isEnabled Color 0xffFF8A65 else disabledColor 3 gt if isEnabled Color 0xff5C6BC0 else disabledColor else gt Color Unspecified ``` That looks like code that should be in an event handler somewhere instead of in the composition directly

Jeisson Sáchica · Answer

As stated above the problem is that you are changing accentColor value on composition inside the forEachIndexed so the first time the composable is created the states is changed four times and only the last one seems to be applied I think what you want is to move the assignment to the onClick callback ```onClick = if isSelectable == true accentColor value = when index 0 gt if isEnabled Color 0xff81C784 else disabledColor 1 gt if isEnabled Color 0xff9575CD else disabledColor 2 gt if isEnabled Color 0xffFF8A65 else disabledColor 3 gt if isEnabled Color 0xff5C6BC0 else disabledColor else gt Color Unspecified ```

Jeisson Sáchica · Answer

Oops you beat me to it xD

Nat Strangerweather · Answer

Thank you all that s really helpful You guys are very kind grinning

Jeisson Sáchica · Answer

There might be special cases but I think that whenever you are updating a variable or doing something that causes a change it should be on a callback or event handler and not directly in composition because you can t control when composition will happen

Jeisson Sáchica · Answer

Also I noticed you are passing the context down from your top composable to where you actually use it You can easily access the context from AmbientContext current

Nat Strangerweather · Answer

Ah ok great I ll look it up Cheers

Jeisson Sáchica · Answer

Which button do you want to be colored initially

Nat Strangerweather · Answer

Initially the ones in the composable called QuickOptions

Jeisson Sáchica · Answer

All of them There are four

Nat Strangerweather · Answer

yes they each have their own color when pressed and depending on which one is pressed I want the toggles further down to have that color too

Jeisson Sáchica · Answer

Ok couple of things the reason why they show without any color initially is because accentColor is initialized like this ` val accentColor = remember mutableStateOf Color Unspecified `

Jeisson Sáchica · Answer

So they will initially all have `Color Unspecified`

Nat Strangerweather · Answer

The thing is I can t specify the colors at this stage because I have no access to the index

Nat Strangerweather · Answer

I m sure it s quite simple to pass a color down between two composables but I just can t do it for some reason

robnik · Answer

Remove the color state and don t pass it Lift the selected index state up one level and pass that down Then use that to select the color for the toggles

Jeisson Sáchica · Answer

You are already doing it with the accentColor the problem is that you actually don t need it in the QuickOptions compoosable

Jeisson Sáchica · Answer

this block ```when index 0 gt if isEnabled Color 0xff81C784 else disabledColor 1 gt if isEnabled Color 0xff9575CD else disabledColor 2 gt if isEnabled Color 0xffFF8A65 else disabledColor 3 gt if isEnabled Color 0xff5C6BC0 else disabledColor else gt Color Unspecified ``` should be directly assigned to the backgroundColor of each button

Nat Strangerweather · Answer

Ok so pass the index as a parameter rather than the color

Jeisson Sáchica · Answer

```colors = ButtonConstants defaultButtonColors backgroundColor = when index 0 gt if isEnabled Color 0xff81C784 else disabledColor 1 gt if isEnabled Color 0xff9575CD else disabledColor 2 gt if isEnabled Color 0xffFF8A65 else disabledColor 3 gt if isEnabled Color 0xff5C6BC0 else disabledColor else gt Color Unspecified ```

Nat Strangerweather · Answer

< Jeisson Sáchica> Ok I understand makes sense

Jeisson Sáchica · Answer

Then remove the MutableState from the composable and just take a lambda

Jeisson Sáchica · Answer

```fun QuickOptions context Context onColorChanged Color gt Unit ```

Nat Strangerweather · Answer

briiliant thanks for this will try it now blush

Jeisson Sáchica · Answer

And on the callback of the `Button` call the lambda with the new color ```onClick = if isSelectable == true val newColor = when index 0 gt if isEnabled Color 0xff81C784 else disabledColor 1 gt if isEnabled Color 0xff9575CD else disabledColor 2 gt if isEnabled Color 0xffFF8A65 else disabledColor 3 gt if isEnabled Color 0xff5C6BC0 else disabledColor else gt Color Unspecified onColorChanged newColor ``` And finally you can pass the lambda on your top composable ```QuickOptions context = context accentColor newColor gt accentColor value = newColor ```

Nat Strangerweather · Answer

< Jeisson Sáchica> Just to say that it is now working perfectly Thanks again for your help +1