fayeed/dash_chat

[Question] Load Earlier Messages scrolling

Opened this issue · 1 comments

m-j-g commented

I'm curious how people handle the common scenario of loading earlier messages while maintaining the correct scroll position.

Example:
Scroll to the top > load earlier messages > Replace the messages in dash chat with 40 messages instead of the latest 20 > The 20 earlier messages load and push the old messages down. (of course in reality its just replacing all 40 messages and my scroll position is still at the top)

This all makes sense I just don't know what people are doing to fix it? Ideally when the new messages load, the user doesn't end up at the top of the messages, but instead is in the same spot where they left off.

What I tried was to get the maxScrollExtent before loading the messages and assigning that to 'oldMaxExtent' and then after the messages load in a postframecallback run:
scrollController?.jumpTo(
(scrollController.position?.maxScrollExtent ?? 0.0) - oldMaxExtent,
);

My thought was that it would take me where I left off and I would be at the top of the oldMaxExtent which would be at the top of the previous batch of messages. However, apparently these extents don't work like that bc it is all over the place.

I also looked into strategies for scrolling to an index. Seems this would be easy if it used ScrollablePositionedList: https://pub.dev/documentation/scrollable_positioned_list/latest/scrollable_positioned_list/ScrollablePositionedList-class.html
But don't see any way to implement any scroll to index type of logic.

I don't know if I'm articulating this well at all. Loading earlier messages is a common scenario so I'm hoping someone smarter than me already has this figured out.

Thanks in advanced!

Hi! I had the exact same issue when trying to implement "load earlier" and my solution was to use "inverted: true" on the list (you will to fetch messages in the other order), that way the top of the screen is not 0 but an actual position that flutter will keep. It's working perfectly on my app.