Hi, I try to resize ListItems in a LazyColum based...

# compose

[Tobias Gronbach]

Hi, I try to resize ListItems in a LazyColum based on their position. I have a few questions:

1.) It's working so far but Console-Output tells me that there's an infinite recomposition and I don't understand why, so
I hope someone can help me understand it.

2.) I would like to implement a smoother transition. Should I base size-transition on offset? And if yes do you have a hint for creating a good scale-factor?
Maybe you know some good sample-codes. Help would greatly be appreciated! Thank you!

States

val itemsState = viewModel.items.collectAsState()
                val items = itemsState.value
                val cardsWidth = remember { mutableListOf<Dp>() }
                val listState = rememberLazyListState()
                val density = LocalDensity.current

LazyColumn

LazyColumn(
                            state = listState,
                        ) {
                            itemsIndexed(items, key = { index, _ -> index }) { index, trainingItem ->

                                cardsWidth.addIfIndexIsNotTaken(index, 0.dp)

                                val firstVisibleItemIndex = listState.firstVisibleItemIndex

                                val modifier = if ((cardsWidth[index] > 0.dp) && (index > firstVisibleItemIndex)) {
                                    val newCardWidth = cardsWidth[index] - ((index - firstVisibleItemIndex) * 10).dp
                                    println("New Card Width: $newCardWidth")
                                    Modifier.width(newCardWidth)
                                } else
                                    Modifier

                                Card(
                                    modifier = Modifier.onGloballyPositioned {
                                        if cardsWidth[index] == 0.dp)
                                            cardsWidth[index] = with(density) { it.size.width.toDp() }
                                    }
                                        .then(modifier)                         

                                ) {
                                  // Content   ....

                                }
                          
                            }
                        }