React Native Mantine › Miscellaneous
ScrollArea
Scrollable container with Mantine-compatible API
Import: import { ScrollArea } from 'react-native-mantine';
Usage
import { ScrollArea } from 'react-native-mantine';
// Fixed-height vertical scroll area
<ScrollArea style={{ height: 160 }}>
{/* long content */}
</ScrollArea>
// Horizontal scrolling without indicators
<ScrollArea horizontal type="never">
{/* wide content */}
</ScrollArea>
// Grows with content up to maxHeight
<ScrollArea.Autosize maxHeight={120}>
{/* content */}
</ScrollArea.Autosize>
// Track the scroll offset
<ScrollArea
style={{ height: 160 }}
onScrollPositionChange={({ x, y }) => console.log(x, y)}
>
{/* content */}
</ScrollArea>
Props
| Prop | Type | Default | Description |
|---|---|---|---|
maxHeight (required) | number | Maximum height of the scroll area, content grows naturally until it exceeds this value and becomes scrollable |