Info:
This is documentation for Stream Chat React Native SDK v8, which is no longer actively maintained. For up-to-date documentation, see the latest version (v9).

ScrollToBottomButton

Renders the floating button that scrolls MessageList to the latest message.

Best Practices

  • Only render the button when showNotification is true to avoid layout noise.
  • Keep the button lightweight and unobtrusive for better UX.
  • Use unreadCount to provide meaningful context, but clamp large values.
  • Ensure onPress scrolls to the latest message rather than just bottom offset.
  • Customize via the Channel prop instead of modifying internal components.

General Usage

Replace the default UI via the ScrollToBottomButton prop on Channel.

<Channel ScrollToBottomButton={CustomScrollToBottomButton} />

Props

onPress

Press handler.

Type
Function

showNotification

When false, the button is not rendered.

Type
Boolean

unreadCount

Unread count for the current channel.

Type
Number
Add Chat to my app: getstream.io/SKILL.md

The fastest way to build with Stream. Start a new project or improve an existing one. Full CLI and documentation integration out of the box.


Ask your agent:

/stream Build me a Social App with Feeds and Moderation.
/stream Any livestream calls running?
/stream Chat React Native v8: <Your Question>