I have trouble grasping how recomposition works in example I currently have. Code and more info in t...

# compose

[Marko Novakovic]

I have trouble grasping how recomposition works in example I currently have.
Code and more info in thread.

[Marko Novakovic]

@Composable
fun ParallaxImage(
    modifier: Modifier = Modifier,
    url: String,
    scrollState: ScrollState,
) {
    SideEffect {
        println("recomposing ParallaxImage")
    }
    val coroutineScope = rememberCoroutineScope()

    var parallaxColor by remember { mutableStateOf(Color.Transparent) }

    var image by remember { mutableStateOf(ImageBitmap(1, 1)) }
    val loader = ImageLoader(LocalContext.current)
    val target = rememberCoilTarget { bitmap ->
        println("setting image")
        image = bitmap.asImageBitmap()
        coroutineScope.launch {
            val color = computeColor(bitmap)
            println("setting parallax color")
            parallaxColor = color
        }
    }

    val request = rememberDefaultImageRequest(url = url, target = target)
    LaunchedEffect(url) {
        loader.execute(request)
    }

    Image(
        modifier = modifier
            .height(250.dp)
            .fillMaxWidth()
            .background(parallaxColor)
            .graphicsLayer { alpha = min(1f, 1 - (scrollState.value / 400f)) },
        bitmap = image,
        contentScale = ContentScale.FillWidth,
        contentDescription = null,
    )
}

[Marko Novakovic]

log for this is:

recomposing ParallaxImage
setting image
recomposing ParallaxImage
setting parallax color
recomposing ParallaxImage

[Marko Novakovic]

ParallaxImage is recomposed for every state variable changed inside of it. Is it because those `state`s are used through body of ParallaxImage? but again, shouldn’t just composables inside of it be recomposed?

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

This answers your question: https://dev.to/zachklipp/scoped-recomposition-jetpack-compose-what-happens-when-state-changes-l78

[Marko Novakovic]

I read it, that’s why am taking deeper look at what is going on in my code. that was yesterday, I will read it again today

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

parallaxColor and image are read in the ParallaxImage function, which is why the entire ParallaxImage function gets recomposed when they change

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

remember that function arguments are evaluated before the function they are being passed to is invoked. They’re evaluated in the stack frame of the function making the call.

[Marko Novakovic]

I understand. thank you very much. that is a great article, I’ve read it again today. now am onto other two

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

is there some way i could make the post more clear for other people asking this question do you think? open to feedback

[Marko Novakovic]

I will think about it

[Marko Novakovic]

I think only thing you can do to make concept more clear is to add more examples but I don’t think it’s good enough. It will increase size of the article and maybe be too much. I really like the article and I don’t think there is much you can do to make it better

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

There can always be more examples 😅 Thanks for the feedback at any rate!

[Marko Novakovic]

Exactly but question is it worth it. At first I thought example you have in there is tricky(sh) but after reading it 2nd and 3rd time and examining some of my own code everything was clear