Skip to main content
ScrollView(children: Component): Component;
ScrollView(children: Component[]): Component;
ScrollView(props: { axis?: Axis, showsIndicators?: boolean }, children: Component[]): Component;

​
Parameters

​
children
Component | Component[]
A single child component or an array of child components to make scrollable.
​
props
{ axis?: Axis, showsIndicators?: boolean }
Configuration options for the scroll view.

​
Support

​
Usage

​
Basic vertical scroll

ScrollView([
    Text("Long content that scrolls"),
    Text("More content"),
    Text("Even more content")
])

​
Horizontal scroll

ScrollView({ axis: "horizontal" }, [
    HStack({ spacing: 20 }, [
        Rectangle().fill(Color("red")).frame({ width: 100, height: 100 }),
        Rectangle().fill(Color("green")).frame({ width: 100, height: 100 }),
        Rectangle().fill(Color("blue")).frame({ width: 100, height: 100 })
    ])
])

​
Scroll with hidden indicators

ScrollView({ showsIndicators: false }, [
    VStack({ spacing: 16 }, [
        Text("Content without scroll bars"),
        Text("More content")
    ])
])