useAutoScroll

The useAutoScroll hook is responsible for managing auto scroll. For example, when a new message arrive, message list will be auto scrolled to the bottom and the new arrived message will be visible.

Example Usage:

const listRef = useRef<FlatList>(null);
const { onContentSizeChangeHandler } = useAutoScroll({ ref: listRef });

return (
  <FlatList
    ref={listRef}
    contentContainerStyle={{ flexGrow: 1 }}
    data={messages}
    renderItem={renderListItem}
    keyExtractor={listItemKeyExtractor}
    onContentSizeChange={onContentSizeChangeHandler}
  />
);

Hook Argument

`ref`

Type	Default
Ref object of type Flatlist component Instance (Required)	No Default

Hook Return Value

`onContentSizeChangeHandler`

Type
Callback function of type: `(width: number, height: number) => void`

Example Usage:

Hook Argument

ref

Hook Return Value

onContentSizeChangeHandler

What’s Next

`ref`

`onContentSizeChangeHandler`