Skip to main content
.scrollPosition(props: {
    id: string | null;
    setId: (value: string | null) => void;
}): Component
props
object
required

Support

Usage

Track scroll position

const body = () => {
    const [scrollId, setScrollId] = useState(null)
    return ScrollView([
        ForEach(items, (item) =>
            Text(item.name)
                .padding(16)
                .id(item.id)
        )
    ]).scrollPosition({ id: scrollId, setId: setScrollId })
}

Programmatic scroll

const body = () => {
    const [scrollId, setScrollId] = useState(null)
    return VStack([
        Button("Scroll to top", () => setScrollId("item-0")),
        ScrollView([
            ForEach(items, (item) =>
                Text(item.name)
                    .padding(16)
                    .id(item.id)
            )
        ]).scrollPosition({ id: scrollId, setId: setScrollId })
    ])
}

Notes

  • Children must have .id() set for scroll position tracking to work.
  • Use with .scrollTargetLayout() and .scrollTargetBehavior() for snapping scroll views.