# androidx.compose.foundation.gestures.snapping

Common/All

## Interfaces

|---|---|---|
| `https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/SnapLayoutInfoProvider` | Provides information about the layout that is using a `https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/package-summary#snapFlingBehavior(androidx.compose.foundation.gestures.snapping.SnapLayoutInfoProvider,androidx.compose.animation.core.DecayAnimationSpec,androidx.compose.animation.core.AnimationSpec)`. | Cmn |
| `https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/SnapPosition` | Describes the snapping positioning (i.e. final positioning after snapping animation finishes) of a given snap item in its containing layout. | Cmn |

## Objects

|---|---|---|
| `https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/SnapPosition.Center` | Aligns the center of the item with the center of the containing layout. | Cmn |
| `https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/SnapPosition.End` | Aligns the end of the item with the end of the containing layout. | Cmn |
| `https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/SnapPosition.Start` | Aligns the start of the item with the start of the containing layout. | Cmn |

## Composables

|---|---|---|
| `https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/rememberSnapFlingBehavior.composable` | Creates and remember a `https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/FlingBehavior` that performs snapping. | Cmn |

## Top-level functions summary

|---|---|---|
| `https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/SnapLayoutInfoProvider` | `https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/package-summary#SnapLayoutInfoProvider(androidx.compose.foundation.lazy.grid.LazyGridState,androidx.compose.foundation.gestures.snapping.SnapPosition)( lazyGridState: https://developer.android.com/reference/kotlin/androidx/compose/foundation/lazy/grid/LazyGridState, snapPosition: https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/SnapPosition )` A `https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/package-summary#SnapLayoutInfoProvider(androidx.compose.foundation.lazy.grid.LazyGridState,androidx.compose.foundation.gestures.snapping.SnapPosition)` for LazyGrids. | Cmn |
| `https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/SnapLayoutInfoProvider` | `https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/package-summary#SnapLayoutInfoProvider(androidx.compose.foundation.lazy.LazyListState,androidx.compose.foundation.gestures.snapping.SnapPosition)( lazyListState: https://developer.android.com/reference/kotlin/androidx/compose/foundation/lazy/LazyListState, snapPosition: https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/SnapPosition )` A `https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/package-summary#SnapLayoutInfoProvider(androidx.compose.foundation.lazy.LazyListState,androidx.compose.foundation.gestures.snapping.SnapPosition)` for LazyLists. | Cmn |
| `https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/TargetedFlingBehavior` | `https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/package-summary#snapFlingBehavior(androidx.compose.foundation.gestures.snapping.SnapLayoutInfoProvider,androidx.compose.animation.core.DecayAnimationSpec,androidx.compose.animation.core.AnimationSpec)( snapLayoutInfoProvider: https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/SnapLayoutInfoProvider, decayAnimationSpec: https://developer.android.com/reference/kotlin/androidx/compose/animation/core/DecayAnimationSpec<https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-float/index.html>, snapAnimationSpec: https://developer.android.com/reference/kotlin/androidx/compose/animation/core/AnimationSpec<https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-float/index.html> )` A `https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/TargetedFlingBehavior` that performs snapping to a given position in a layout. | Cmn |

## Top-level functions

### SnapLayoutInfoProvider

Cmn Artifact: [androidx.compose.foundation:foundation](https://developer.android.com/jetpack/androidx/releases/compose-foundation) [View Source](https://cs.android.com/search?q=file:androidx/compose/foundation/gestures/snapping/LazyGridSnapLayoutInfoProvider.kt+function:SnapLayoutInfoProvider) Added in [1.7.0](https://developer.android.com/jetpack/androidx/releases/compose-foundation#1.7.0)

```
fun SnapLayoutInfoProvider(
    lazyGridState: LazyGridState,
    snapPosition: SnapPosition = SnapPosition.Center
): SnapLayoutInfoProvider
```

A `https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/package-summary#SnapLayoutInfoProvider(androidx.compose.foundation.lazy.grid.LazyGridState,androidx.compose.foundation.gestures.snapping.SnapPosition)` for LazyGrids.

| Parameters |
|---|---|
| `lazyGridState: https://developer.android.com/reference/kotlin/androidx/compose/foundation/lazy/grid/LazyGridState` | The `https://developer.android.com/reference/kotlin/androidx/compose/foundation/lazy/grid/LazyGridState` with information about the current state of the grid |
| `snapPosition: https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/SnapPosition = SnapPosition.Center` | The desired positioning of the snapped item within the main layout. This position should be considered with regards to the start edge of the item and the placement within the viewport. |

| Returns |
|---|---|
| `https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/SnapLayoutInfoProvider` | A `https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/package-summary#SnapLayoutInfoProvider(androidx.compose.foundation.lazy.grid.LazyGridState,androidx.compose.foundation.gestures.snapping.SnapPosition)` that can be used with `https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/package-summary#snapFlingBehavior(androidx.compose.foundation.gestures.snapping.SnapLayoutInfoProvider,androidx.compose.animation.core.DecayAnimationSpec,androidx.compose.animation.core.AnimationSpec)` |

### SnapLayoutInfoProvider

Cmn Artifact: [androidx.compose.foundation:foundation](https://developer.android.com/jetpack/androidx/releases/compose-foundation) [View Source](https://cs.android.com/search?q=file:androidx/compose/foundation/gestures/snapping/LazyListSnapLayoutInfoProvider.kt+function:SnapLayoutInfoProvider) Added in [1.7.0](https://developer.android.com/jetpack/androidx/releases/compose-foundation#1.7.0)

```
fun SnapLayoutInfoProvider(
    lazyListState: LazyListState,
    snapPosition: SnapPosition = SnapPosition.Center
): SnapLayoutInfoProvider
```

A `https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/package-summary#SnapLayoutInfoProvider(androidx.compose.foundation.lazy.LazyListState,androidx.compose.foundation.gestures.snapping.SnapPosition)` for LazyLists.

| Parameters |
|---|---|
| `lazyListState: https://developer.android.com/reference/kotlin/androidx/compose/foundation/lazy/LazyListState` | The `https://developer.android.com/reference/kotlin/androidx/compose/foundation/lazy/LazyListState` with information about the current state of the list |
| `snapPosition: https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/SnapPosition = SnapPosition.Center` | The desired positioning of the snapped item within the main layout. This position should be considered with regard to the start edge of the item and the placement within the viewport. |

| Returns |
|---|---|
| `https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/SnapLayoutInfoProvider` | A `https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/package-summary#SnapLayoutInfoProvider(androidx.compose.foundation.lazy.LazyListState,androidx.compose.foundation.gestures.snapping.SnapPosition)` that can be used with `https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/package-summary#snapFlingBehavior(androidx.compose.foundation.gestures.snapping.SnapLayoutInfoProvider,androidx.compose.animation.core.DecayAnimationSpec,androidx.compose.animation.core.AnimationSpec)` |

### snapFlingBehavior

Cmn Artifact: [androidx.compose.foundation:foundation](https://developer.android.com/jetpack/androidx/releases/compose-foundation) [View Source](https://cs.android.com/search?q=file:androidx/compose/foundation/gestures/snapping/SnapFlingBehavior.kt+function:snapFlingBehavior) Added in [1.7.0](https://developer.android.com/jetpack/androidx/releases/compose-foundation#1.7.0)

```
fun snapFlingBehavior(
    snapLayoutInfoProvider: SnapLayoutInfoProvider,
    decayAnimationSpec: DecayAnimationSpec<Float>,
    snapAnimationSpec: AnimationSpec<Float>
): TargetedFlingBehavior
```

A `https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/TargetedFlingBehavior` that performs snapping to a given position in a layout.

You can use `https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/SnapLayoutInfoProvider#calculateApproachOffset(kotlin.Float,kotlin.Float)` to indicate that snapping should happen after this offset. If the velocity generated by the fling is high enough to get there, we'll use `https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/package-summary#snapFlingBehavior(androidx.compose.foundation.gestures.snapping.SnapLayoutInfoProvider,androidx.compose.animation.core.DecayAnimationSpec,androidx.compose.animation.core.AnimationSpec)` to get to that offset and then we'll snap to the next bound calculated by `https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/SnapLayoutInfoProvider#calculateSnapOffset(kotlin.Float)` using `https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/package-summary#snapFlingBehavior(androidx.compose.foundation.gestures.snapping.SnapLayoutInfoProvider,androidx.compose.animation.core.DecayAnimationSpec,androidx.compose.animation.core.AnimationSpec)`.

If the velocity is not high enough, we'll use `https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/package-summary#snapFlingBehavior(androidx.compose.foundation.gestures.snapping.SnapLayoutInfoProvider,androidx.compose.animation.core.DecayAnimationSpec,androidx.compose.animation.core.AnimationSpec)` to approach and the same spec to snap into place.

Please refer to the sample to learn how to use this API.

```kotlin
import androidx.compose.foundation.background
import androidx.compose.foundation.gestures.snapping.rememberSnapFlingBehavior
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.lazy.LazyRow
import androidx.compose.foundation.lazy.rememberLazyListState
import androidx.compose.material3.Text
import androidx.compose.runtime.remember
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp

val state = rememberLazyListState()

LazyRow(
    modifier = Modifier.fillMaxSize(),
    verticalAlignment = Alignment.CenterVertically,
    state = state,
    flingBehavior = rememberSnapFlingBehavior(lazyListState = state),
) {
    items(200) {
        Box(
            modifier =
                Modifier.height(400.dp).width(200.dp).padding(8.dp).background(Color.Gray),
            contentAlignment = Alignment.Center,
        ) {
            Text(it.toString(), fontSize = 32.sp)
        }
    }
}
```

```kotlin
import androidx.compose.foundation.background
import androidx.compose.foundation.gestures.snapping.SnapLayoutInfoProvider
import androidx.compose.foundation.gestures.snapping.rememberSnapFlingBehavior
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.layout.width
import androidx.compose.foundation.lazy.LazyRow
import androidx.compose.foundation.lazy.rememberLazyListState
import androidx.compose.material3.Text
import androidx.compose.runtime.remember
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.unit.dp
import androidx.compose.ui.unit.sp

val state = rememberLazyListState()

// If you'd like to customize either the snap behavior or the layout provider
val snappingLayout = remember(state) { SnapLayoutInfoProvider(state) }
val flingBehavior = rememberSnapFlingBehavior(snappingLayout)

LazyRow(
    modifier = Modifier.fillMaxSize(),
    verticalAlignment = Alignment.CenterVertically,
    state = state,
    flingBehavior = flingBehavior,
) {
    items(200) {
        Box(
            modifier =
                Modifier.height(400.dp).width(200.dp).padding(8.dp).background(Color.Gray),
            contentAlignment = Alignment.Center,
        ) {
            Text(it.toString(), fontSize = 32.sp)
        }
    }
}
```

| Parameters |
|---|---|
| `snapLayoutInfoProvider: https://developer.android.com/reference/kotlin/androidx/compose/foundation/gestures/snapping/SnapLayoutInfoProvider` | The information about the layout being snapped. |
| `decayAnimationSpec: https://developer.android.com/reference/kotlin/androidx/compose/animation/core/DecayAnimationSpec<https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-float/index.html>` | The animation spec used to approach the target offset when the fling velocity is large enough. Large enough means large enough to naturally decay. |
| `snapAnimationSpec: https://developer.android.com/reference/kotlin/androidx/compose/animation/core/AnimationSpec<https://kotlinlang.org/api/core/kotlin-stdlib/kotlin/-float/index.html>` | The animation spec used to finally snap to the correct bound. |