HStack Snap-to-Scroll

HStack Snap-to-Scroll

Twitter Github Get Early Access

HStack Snap-to-Scroll

Read Docs on Github Want more detail? See the full readme! It goes into more detail and documents all configuration options. Get Started

Easy-to-use HStack that snaps to elements on scroll. Supports varied view widths and multiple layout options.

How to Use

Step 1:

Install with Swift Package Manager. In your Xcode Project, select File > Add Packages, and paste in the following URL:

https://github.com/swiftui-library/hstack-snap-to-scroll

Step 2:

Making use of hstack-snap-to-scroll is straightforward. Here's an example.

import SnapToScroll                               // Step 1
...

HStackSnap(alignment: .center(32)) {              // Step 2

    ForEach(myModels) { viewModel in

        MyView(
            selectedIndex: $selectedIndex,
            viewModel: viewModel
         )
         .snapAlignmentHelper(id: viewModel.id)   // Step 3
     }
}

As you can see, there's just a few steps.

  1. Import the package.
  2. Provide layout configuration (.leading, .center)
  3. Add .snapAlignmentHelper and pass in your model's id. (This is the ViewModifier that tracks the size of each element)

And that's all you need to get horizontal snapping as shown in the demo video!