ScrollView

ScrollView brings the React Native scrolling API and Tamagui style props to native and web without a react-native-web dependency.

In v3, @tamagui/scroll-view ships its own web implementation instead of wrapping react-native-web. It supports the ScrollView surface Tamagui uses most: scrollTo, scrollToEnd, getScrollableNode, React Native-shaped onScroll, contentContainerStyle, horizontal, and scroll indicator props.

Props outside that mapped surface, such as momentum events, snapTo*, and keyboardDismissMode, are not supported on web through the lite implementation.

Installation

ScrollView is already installed in tamagui, or you can install it independently:

yarn
npm
bun
pnpm
Copy
yarn add @tamagui/scroll-view

Usage

import { ListItem, ScrollView, YStack, style } from 'tamagui'

const contentContainer = style({
  padding: 16,
  gap: 8,
})

export default () => (
  <ScrollView contentContainerStyle={contentContainer}>
    <YStack>
      <ListItem>1</ListItem>
      <ListItem>2</ListItem>
      <ListItem>3</ListItem>
      <ListItem>4</ListItem>
    </YStack>
  </ScrollView>
)
Copy

API reference

ScrollView accepts Tamagui standard props and the mapped React Native ScrollView surface.

See React Native ScrollView and Tamagui style props. On web, prefer the mapped props documented above.