手动滑动后Jetpack Compose自动ViewPager停止运行问题

核心问题分析 #

你当前的自动轮播逻辑写在LaunchedEffect(Unit)里，这个协程只会启动一次。当用户手动滑动时，animateScrollBy的执行会和手势操作冲突，导致协程循环被中断，或是页面状态判断不同步，最终自动轮播停止。

修复方案 #

我们需要监听滚动状态，在用户手动操作时暂停轮播，滑动结束后恢复，同时优化页面切换逻辑：

修改后的DashboardScreen代码如下：

@OptIn(ExperimentalPagerApi::class)
@Composable
fun DashboardScreen(navController: NavController) {
    val items = DashboardSlider1.getData()
    val itemsBanner = dummyBannerDashboardItem
    val itemsKenalan = dummyKenalanDashboardItem

    val pagerState = rememberPagerState()
    var pageSize by remember { mutableStateOf(IntSize.Zero) }
    // 标记是否正在手动滑动
    val isUserScrolling by remember {
        derivedStateOf { pagerState.isScrollInProgress }
    }
    // 自动轮播间隔
    val autoScrollDelay = 2000L

    LaunchedEffect(pagerState, isUserScrolling) {
        while (true) {
            // 用户滑动时跳过本次轮播逻辑
            if (isUserScrolling) {
                yield()
                continue
            }
            delay(autoScrollDelay)
            // 计算目标页面
            val targetPage = if (pagerState.currentPage == items.size - 1) {
                0
            } else {
                pagerState.currentPage + 1
            }
            // 直接滚动到目标页面，替代原有的scrollBy逻辑
            pagerState.animateScrollToPage(
                page = targetPage,
                animationSpec = tween(1400)
            )
        }
    }

    Box {
        HorizontalPager(count = items.size, state = pagerState) { page ->
            AutomaticSliderCard(item = items[page], Modifier.onSizeChanged { pageSize = it })
        }
    }
}

关键修改说明 #

• 替换animateScrollBy为animateScrollToPage：直接定位目标页面，避免通过宽度计算滚动距离产生的误差，尤其是最后一页回滚到第一页时的逻辑混乱
• 监听isScrollInProgress状态：用户手动滑动时暂停自动轮播，滑动结束后恢复
• 调整LaunchedEffect触发条件：将pagerState和isUserScrolling作为依赖key，确保页面状态或滑动状态变化时协程能正确响应
• 简化页面切换逻辑：直接计算目标页面，代码更清晰可靠

额外优化建议 #

• 如果需要无跳变的循环轮播体验，可以把Pager的count设为Int.MAX_VALUE，通过取模计算实际显示的页面，实现无缝滚动
• 可添加开关变量，支持用户手动启停自动轮播

内容的提问来源于stack exchange，提问作者Yuba