*How to enforce single-item snapping in LazyColumn...
# compose
a
How to enforce single-item snapping in LazyColumn with SnapFlingBehavior? I have a full-page-sized LazyColumn where each item uses Modifier.fillParentMaxHeight(). I want a pager-like scrolling experience where one item is visible at a time. I tried using rememberSnapFlingBehavior with SnapPosition.Start, and while the snapping behavior works as expected, when scrolling at high velocity, multiple items (pages) scroll at once. I want a strict single-item snap behavior, similar to SingleSnapFlingBehavior. How can I achieve this
w
Is there a reason you don't just use VerticalPager?
☝🏼 1
☝️ 1
a
The user experience needs to be configurable i.e. it could be a continuous scroll experience with smaller items (like facebook) as well as could be a pager kind of experience with full page items (like tiktok). Hence I wanted to use the same lazy column with code configuration for both experience
m
This is where compose shines. Extract the content into a composable and behind a condition either use LazyColumn (for continuous scrolling) or VerticalPager (for single page scroll) Something like
Copy code
var isContinuousScrolling by remember { mutableStateOf(false) }
if (isContinuousScrolling) {
    LazyColumn {
        items(items.size) { index ->
            Content()
        }
    }
} else {
    VerticalPager(
        rememberPagerState { items.size }
    ) { page ->
        Content()
    }
}
💯 2
a
This should work, thanks for the suggestion.
👍 1