捕捉到索引 Lazyrow

Question

我正在lazyRow 的帮助下制作日历。我现在遇到的问题是，我希望该行在一定的滚动量之后捕捉到索引，因此它不应该卡在索引之间。有没有办法做到这一点？

    LazyRow(state = calendarViewModel.listState, modifier = Modifier.fillMaxWidth()) {
        calendarYears.forEach {
            items(it.months.count()) { index ->
                calendarViewModel.onEvent(CalendarEvent.ClickedMenuItem(index))
                CalendarRowItem(
                    modifier = Modifier.fillParentMaxWidth(),
                    calendarSize = it.months[index].amountOfDays,
                    initWeekday = it.months[index].startDayOfMonth.ordinal,
                    textColor = MaterialTheme.colors.secondaryVariant,
                    clickedColor = MaterialTheme.colors.primary,
                    textStyle = MaterialTheme.typography.body1
                )
            }
        }
    }

Answer 1

从 compose 开始，1.3.0您可以使用FlingBehavior将项目捕捉到给定位置的方法：

val state = rememberLazyListState()

LazyRow(
    modifier = Modifier.fillMaxSize(),
    verticalAlignment = Alignment.CenterVertically,
    state = state,
    flingBehavior = rememberSnapFlingBehavior(lazyListState = state)
) {
  //item content
}

Answer 2

您可以使用HorizontalPager来自accompanist 库，它提供了开箱即用的 fling 行为并LazyRow在内部使用。

另一种选择是使用@chris-banes创建的Snapper 库

在您的build.gradle.

dependencies {
    implementation "dev.chrisbanes.snapper:snapper:<version>"
}

并在您的LazyRow.

val lazyListState = rememberLazyListState()

LazyRow(
    state = lazyListState,
    flingBehavior = rememberSnapperFlingBehavior(lazyListState),
) {
    // content
}

结果：