首页 > 解决方案 > 有没有办法通过自动滚动制作两种方式 Horizo​​ntalPager?

问题描述

伴奏库中的Horizo ​​ntalPager 可以创建一个简单的 ViewPager;有没有办法在两端无限滑动?

@ExperimentalPagerApi
@Composable
fun AutoScrollPagerHorizontal(d: List<Stem>?) {
    var data: MutableList<Stem> = d?.toMutableList() ?: mutableListOf()

    if (data.isNullOrEmpty()) return
    val pageState = rememberPagerState(pageCount = data.size)
    HorizontalPager(
        state = pageState
    ) {
        Card(
            Modifier
                .height(240.dp)
                .padding(start = 16.dp, end = 16.dp, top = 8.dp, bottom = 8.dp)
        ) {
            Image(
                painter = rememberGlidePainter(
                    request = data[it].icon,
                ),
                contentDescription = data[it].title,
                contentScale = ContentScale.FillBounds
            )
        }
    }
}

此代码正确生成 viewpager,但在到达最后一个数据索引后不会滚动到第 0 个索引。

标签: kotlinhorizontal-scrollingandroid-jetpack-compose

解决方案


您可以在可组合中使用此代码段来自动滚动寻呼机:

LaunchedEffect(key1 = pagerState.currentPage) {
    launch {
        delay(3000)
        with(pagerState) {
            val target = if (currentPage < pageCount - 1) currentPage + 1 else 0

            animateScrollToPage(
                page = target,
                animationSpec = tween(
                    durationMillis = 500,
                    easing = FastOutSlowInEasing
                )
            )
        }
    }
}

推荐阅读