滚动屏幕时切换ContextualHelpFloatingButton的expandLabel状态问题

问题分析 #

你的代码存在两个核心问题，导致无法实现「滚动时隐藏标签、停止滚动时显示标签」的预期效果：

1. 滚动状态判断逻辑错误：当前仅通过firstVisibleItemScrollOffset == 0判断是否显示展开标签，这只会在列表滚动到顶部时生效，完全没区分「滚动中」和「停止滚动」的状态。
2. 状态传递机制失效：给ContextualHelpFloatingButton的expandLabel传入remember { mutableStateOf(expanded) }，这个状态只会在首次组合时赋值，后续expanded更新时不会同步到子组件。

修正后的代码 #

@Composable
private fun FruitDetailView(fruit: FruitModel?, items: List<FruitDetailItem>) {
    var expanded by remember { mutableStateOf(true) }
    val listState = rememberLazyListState()
    
    // 实时判断列表是否正在滚动
    val isScrolling by remember {
        derivedStateOf { listState.isScrollInProgress }
    }

    // 根据滚动状态更新expanded
    LaunchedEffect(isScrolling) {
        expanded = !isScrolling
    }

    Box {
        LazyColumn(
            state = listState, // 关键：将listState绑定到LazyColumn，才能感知滚动
            modifier = Modifier
                .background(UiColors.White)
                .fillMaxHeight()
        ) {
            // ... 原有列表项内容
        }
        Box(
            contentAlignment = Alignment.BottomEnd,
            modifier = Modifier
                .fillMaxSize()
                .padding(vertical = 100.dp, horizontal = 20.dp)
        ) {
            ContextualHelpFloatingButton(
                accessibility = accessibility,
                data = data,
                interaction = ContextualHelpFloatingButtonInteraction(
                    // 用rememberUpdatedState确保子组件能拿到最新的expanded值
                    expandLabel = rememberUpdatedState(expanded)
                )
            )
        }
    }
}

关键修改说明 #

• 绑定列表状态：必须把listState传给LazyColumn的state参数，否则listState无法感知列表的滚动行为。
• 精准判断滚动状态：使用listState.isScrollInProgress直接获取当前是否处于滚动中，这是Compose Lazy列表提供的原生状态，判断逻辑准确可靠。
• 同步状态传递：用rememberUpdatedState(expanded)替代手动创建新的mutableStateOf，它会在expanded更新时自动同步最新值给子组件，避免状态滞后。

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