How to set a threshold for LazyColumn/ViewPager before starting to scroll?

Question

I'm using the experimental viewpager for Jetpack compose which is built upon LazyColumn/Row.

What I'm trying to do is to set some threshold of how much I need to move my finger before it starts to scroll to next page. The default behaviour is that as soon as I move my finger it starts to scroll, but I want to have a larger threshold of how much I need to move the finger before any visual scrolling occur. I've looked at the FlingBehaviour parameter, but I don't see how to use that to accomplish what I want. (Or at least add some more "resistance" to flip between the pages, so it's not so sensitive)

Have you got any ideas?

Answer 1

This threshold is controlled by the flingBehavior argument.

PagerDefaults.flingBehavior(pagerState) provides paging work, currently only animations are configurable, so you can't just provide your own instead behavior instead. But you can wrap it like this:

private class FlingBehaviourMultiplier(
    private val multiplier: Float,
    private val baseFlingBehavior: FlingBehavior
) : FlingBehavior {
    override suspend fun ScrollScope.performFling(initialVelocity: Float): Float {
        return with(baseFlingBehavior) {
            performFling(initialVelocity * multiplier)
        }
    }
}

@Composable
fun rememberFlingBehaviorMultiplier(
    multiplier: Float,
    baseFlingBehavior: FlingBehavior
): FlingBehavior = remember(multiplier, baseFlingBehavior) {
    FlingBehaviourMultiplier(multiplier, baseFlingBehavior)
}

Usage:

val pagerState = rememberPagerState()
HorizontalPager(
    count = 10,
    state = pagerState,
    flingBehavior = rememberFlingBehaviorMultiplier(
        multiplier = 0.5f,
        baseFlingBehavior = PagerDefaults.flingBehavior(pagerState)
    ),
    modifier = Modifier
) { page ->
}