how can we retain scroll position of `LazyColumn` when navigating from screen A to screen B and comi...

# compose

[Danish Ansari]

how can we retain scroll position of LazyColumn when navigating from screen A to screen B and coming back

Screen A contains 20 items, user scrolled to 15th item, selected 15th item, Screen B opened, came back, list gets reset, scrolled to 1st item

But I want the 15th item to be visible

[Andrey Kulikov]

do you display items via LazyPagingItems?

[Danish Ansari]

no it's a simple LazyColumn

[Andrey Kulikov]

I mean the scroll position is autorestored already in most cases. it can only happen if when you returned fo the previous screen you are loading the list not synchonously(maybe from some Flow?) and you also have some other items like headers, so it tries to restore the scroll position to 15, but sees that there is only one item - header and resets the scroll position. if you can show more code it would help

[Danish Ansari]

LazyColumn is a list of custom components and each custom component contains LazyRow. LazyRow's data is stored in ViewModel.

[Danish Ansari]

Funny thing is LazyRow's scroll position is retained but not parent LazyColumn.

I think this is happening because LazyColumn's is not actual list but single single item

[Danish Ansari]

I mean I'm not using items but multple item as per my need

[Danish Ansari]

Could that be the reason scroll position is not retained?

[Danish Ansari]

To give you an idea my UI is similar to tivi's homescreen.

Where horizontal scroll position is retained but not LazyColumn's

[Tolriq]

Where do you remember the state? I had an issue when I hoisted the state to a component that was not removed.

[Danish Ansari]

Screenrecorder-2021-10-27-23-57-34-963.mp4

[Danish Ansari]

@Tolriq which state?

[Tolriq]

the lazycolumn one

[Danish Ansari]

I haven't used state for it. It's data are hardcoded.

Like this

LazyColumn{
 item { PopularMovies() }
 item { NowPlayingMoviee() }
 ...
}

[Tolriq]

Then add before

val state = rememberLazyListState()

And pass the state to LazyColum(state=state) You can then easily log the state and see what is happneing

[Andrey Kulikov]

it should be fine with multiple item calls as well

[Danish Ansari]

@Tolriq same behavior while passing rememberLazyListState() manually also

[Tolriq]

It was probably but now you can log it's content 🙂 Log the state initialFirstVisibleItemIndex / initialFirstVisibleItemScrollOffset just after the remember. So you can see what happens. 2 cases, on return the values are 0 or they are first non 0 then a recomposition happens and it's reset to 0. It will allow you know narrow down where to look.

[Danish Ansari]

when coming back firstVisibleItemIndex is non 0 then it's becoming 0

[Tolriq]

Ok so the state is properly restored then it can't scroll to the value and so reset to 0. You need to check why some content of the LazyColumn is not displayed at the restore time.

[Danish Ansari]

I'm coming back by calling navController.popBackStack() could that be the reason?

[Tolriq]

I do not use jetpack navigation but the lazycolumn state is properly restored as it's first non 0. Your issue is more about the content of the lazycolumn. Like data loaded asynchronously or first not displayed then displayed. Current LazyColum restoration is very basic, if there's a value to restore then it wait until the element count is > 0. It does not wait more like to load 12 items.

[Danish Ansari]

ok, got it

[Danish Ansari]

now that I have understood why scroll position is not retained. I'll figure out the root cause of why some components are not rendered when restoring in the morning with a fresh mind

[Danish Ansari]

Thanks a lot for your time @Tolriq and @Andrey Kulikov