i am trying to use animateContentSize but i think i am doing it wrong

LazyColumn(modifier = Modifier.fillMaxWidth()) {
    items((0..30).toList()) {
        var isExpanded by remember { mutableStateOf(false) }
        Surface(
            color = MaterialTheme.colors.primary,
            shape = CircleShape
        ) {
            Row(modifier = Modifier.animateContentSize()) {
                IconButton(onClick = { isExpanded = !isExpanded }) {
                    Icon(asset = Icons.Default.AccessTime, tint = Color.White)
                }

                if (isExpanded) {
                    Text(
                        modifier = Modifier.gravity(Alignment.CenterVertically)
                            .padding(end = 16.dp),
                        text = "some text",
                        style = MaterialTheme.typography.caption,
                        color = Color.White
                    )
                }
            }
        }
        Spacer(modifier = Modifier.height(8.dp))
    }
}

this code make the icons disappear on scrolling and is very lag, but when i put the animateContentSize on the surface it works but the animation is not like the above one. this code is put in another compose but i extract it to see the problem.

Could you use

AnimatedVisibility

for this? Instead of

if (isExpanded)

(or in addition too, don't remember the exact API).

Yes i tried AnimatedVisibilty works fine but i wanted to know when and how to use animateContentSize. There is a row of 3 of that compasable should i use animateContentSize on the row

Could you post a video/gif of the animation that’s not doing what you’d expect?

Ya sure will take some time

This code looks correct. I would recommend using

animateContentSize()

on the child/children of Surface instead of on Surface directly, as Surface does it's shape clipping and shadow drawing after

animateContentSize()

That means the clipping logic inside of

animateContentSize

will interfere with those. That's the only caveat that I know of. I'll add that to the kdoc, until we work out a solution for Surface.

this is when the animateContentSize() is on the raw the bug appears when scroll up

This UI looks super cool! 👏 😄

thanks a lot for your time and effort.