ScrollView

React Native ScrollView with Tamagui props

import { Circle, ScrollView, Square, XStack } from 'tamagui'
export function ScrollViewDemo() {
return (
<ScrollView maxHeight={250} width="75%" backgroundColor="$background" padding="$4" borderRadius="$4" >
<XStack flexWrap="wrap" alignItems="center" justifyContent="center">
<Square margin="$4" size={120} backgroundColor="$red9" />
<Circle margin="$4" size={120} backgroundColor="$orange9" />
<Square margin="$4" size={120} backgroundColor="$yellow9" />
<Circle margin="$4" size={120} backgroundColor="$green9" />
<Square margin="$4" size={120} backgroundColor="$blue9" />
<Circle margin="$4" size={120} backgroundColor="$purple9" />
<Square margin="$4" size={120} backgroundColor="$pink9" />
<Circle margin="$4" size={120} backgroundColor="$red9" />
</XStack>
</ScrollView>
)
}

Features

  • All the features of React Native ScrollView.

  • Adds all the style properties of Tamagui.

Usage

import { ScrollView, YStack, ListItem } from 'tamagui'
export default () => (
<ScrollView>
<YStack>
<ListItem>1</ListItem>
<ListItem>2</ListItem>
<ListItem>3</ListItem>
<ListItem>4</ListItem>
</YStack>
</ScrollView>
)

API Reference

ScrollView

See React Native ScrollView  and Tamagui style props .

Previous

HTML Elements

Next

Spinner