Hey! :wave: When an item in a `LazyColumn` animate...

# compose

[zalewski.se]

Hey! 👋
When an item in a LazyColumn animates its size (e.g., using .layout modifier), I’m noticing the item shifts vertically instead of staying anchored in the viewport. For example, if an item is centered, I’d like it to expand/collapse “in place” from that center point. Instead, the scroll position seems to anchor to the top (or bottom?) of the item, causing it to shift.
Is there a recommended way to keep an item’s visual position stable in the viewport while its size animates within a LazyColumn?

[shikasd]

the scroll position is item index + offset from its top, so it generally should be stable when collapsing items

can you share a recording of how it shifts for you?

[zalewski.se]

I’m just checking with company if I can share some recording directly with you. Otherwise I will need to spend some time to create a sample project 🙂

[zalewski.se]

In general I can scroll and position the item in the center, the problem happens after that, when I start changing that item layout size (by either adding the padding or directly modifying it with layout modifier). There seem to be some logic that decides in which direction item will grow, it’s either:
• only top -> item’s bottom bound stays in place and top one shifts, pushing up only items above
• only bottom -> item’s top bound stays in place and bottom bound shifts, pushing down only items below
• both -> item’s top and bottom bounds shift by equal amount, pushing top and bottom items equally away from the center point