TechnologiesSwiftUIScrolling

ScrollBounceBehavior struct

iOSmacOStvOSwatchOSvisionOSiOS 16.4+✓ renders

The ways that a scrollable view can bounce when it reaches the end of its

How it works

ScrollBounceBehavior is a set of constants that control whether a scroll view bounces past its edges when the user drags beyond the content. By default a scroll view always rubber-bands at its boundaries, even when the content is small enough to fit on screen — which can feel unexpected for short, static lists. Reach for ScrollBounceBehavior when you want that elastic overscroll to depend on the situation rather than always be on, applying it through the scrollBounceBehavior(_:) modifier on a scrollable view.

  1. Apply the behavior with scrollBounceBehavior(_:)

    ScrollBounceBehavior takes effect through the scrollBounceBehavior(_:) view modifier, which you attach to a scrollable container to override its default bounce. In the example the modifier hangs off the ScrollView, so the chosen behavior governs that view's vertical overscroll.

  2. Choose .automatic for the system default

    The .automatic case asks SwiftUI to apply its standard bounce behavior, which is the same elastic overscroll you get when you don't apply the modifier at all. It's the value to pass when you want to be explicit about opting into the platform default.

  3. Use .basedOnSize to bounce only when content overflows

    The .basedOnSize case makes bouncing conditional on the content size: the scroll view rubber-bands only along axes where the content is larger than the visible area, and stays put when everything already fits. The example passes .basedOnSize, so the list of rows bounces only once it grows tall enough to scroll.

  4. Use .always to force bouncing

    The .always case keeps the elastic overscroll enabled regardless of content size, so even a list that fits on screen still rubber-bands when dragged. Choose it when the bounce is part of the feel you want, independent of how much content is present.

  5. Scope the behavior to one or both axes

    scrollBounceBehavior(_:axes:) accepts an axes parameter so a ScrollBounceBehavior value can target the horizontal axis, the vertical axis, or both. Because the example omits axes, the .basedOnSize behavior applies to the scroll view's default vertical axis.

Try it — Change .scrollBounceBehavior(.basedOnSize) to .scrollBounceBehavior(.always) and drag the short list — it now rubber-bands even though all five rows already fit on screen.

Example & preview

Press Run live & edit to compile it in your browser — then edit the Swift on the left and the preview re-renders live.

ScrollBounceBehavior.swift
struct ScrollBounceBehaviorDemo: View {
    var body: some View {
        ScrollView {
            VStack(spacing: 12) {
                ForEach(1..<6) { i in
                    Text("Row \(i)")
                        .frame(maxWidth: .infinity)
                        .padding()
                        .background(.blue.opacity(0.15))
                        .cornerRadius(8)
                }
            }
            .padding()
        }
        .scrollBounceBehavior(.basedOnSize)
    }
}
Live preview
Row 1 Row 2 Row 3 Row 4 Row 5
Row 1 Row 2 Row 3 Row 4 Row 5
swift → lexer → parser → sema → uiir → canvas Open in Studio ↗
What's new in SwiftUI 27 →