Skip to content

Question: avoid message scrolling when receiving a new message #2607

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
breudevpf opened this issue Mar 26, 2025 · 4 comments
Open

Question: avoid message scrolling when receiving a new message #2607

breudevpf opened this issue Mar 26, 2025 · 4 comments

Comments

@breudevpf
Copy link

Hello,

We have recently integrated the library and we would like to know how we can avoid that when a new message with a lot of content is received, avoid that it takes us to the end of the scroll, we would like to stay in the last message sent by the user and show part of the new message received, something similar to what I show in the screenshot.

Image

@kesha-antonov
Copy link
Collaborator

Hi

Good question
I'll take a look into it

@TylerZubke
Copy link

I've been using workaround to prevent this scroll action. All you have to do is set the messageContainerRef prop. eg:

const ref = useRef(null);
<GiftedChat messageContainerRef={ref} />

You don't even have to do anything with the ref. It would be nice if there was an actual prop to prevent the scrolling instead of this hack.

@greg-munro
Copy link

greg-munro commented Apr 7, 2025

I'm also looking for a solution here. Ideally, I'd like message bubbles with a lot of content to render from their top position by default, so users don’t have to scroll up to read from the beginning of a message.

I know FlatList provides options like scrollToIndex and scrollToOffset, but neither seems to achieve the effect precisely. Would it be possible to have a built-in prop or default behaviour that ensures the latest message scrolls into view from the top when it is appended to the UI?

@breudevpf
Copy link
Author

Hello @kesha-antonov any news on this? <3

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants