Jetpack Compose使用Modifier.selectable时如何避免滚动时误触发组件选中态

该现象的本质是触摸事件分发机制和selectable的状态触发逻辑不匹配导致的：

• selectable 修饰符收到屏幕按下事件时，会立刻触发按压高亮动画，自身不会判断这个后续手势会不会被父级滚动容器消费。
• 触摸事件是从顶层容器逐层下发的：手指划过屏幕时，初始按下事件会先传递到接触位置的子项，触发selectable的按压高亮；只有当滑动距离超过滚动阈值、LazyColumn正式接管垂直滚动手势后，才会取消之前下发的按压事件，这个取消的时间差就造成了滚动划过时条目短暂触发高亮的问题。

补充说明：原示例中将100个可选组件放在同一个item {}块内的写法不符合LazyColumn的设计规范，所有内容会被作为一个整体加载，完全无法触发列表的复用机制，实际开发中需要用items(100)逐一生成条目，才能匹配正常的列表手势拦截逻辑。

方案1：用自定义InteractionSource过滤无效的瞬时按压事件 #

这是改动最小、最适配原有单选逻辑的方案，原理是通过交互源收集所有手势状态，自动过滤掉被滚动取消的瞬时按压事件，从根源避免误高亮：

@Composable
fun Example() {
    val selectedIndex = remember { mutableStateOf(-1) }
    val lazyListState = rememberLazyListState()

    LazyColumn(state = lazyListState) {
        items(100) { index ->
            // 每个条目使用独立的interactionSource，避免跨条目状态干扰
            val itemInteractionSource = remember { MutableInteractionSource() }
            Column(
                modifier = Modifier
                    .fillMaxWidth()
                    .height(40.dp)
                    .selectable(
                    selected = selectedIndex.value == index,
                    interactionSource = itemInteractionSource,
                    onClick = {
                        selectedIndex.value = index
                    }
                )
            ) {
                Text("Example $index")
            }
        }
    }
}

当滚动发生时，父容器消费手势后，之前下发到子项的按压事件会被自动标记为取消，selectable关联的按压态会立刻复位，不会再出现短暂高亮的问题。

方案2：增加滚动状态判断做兜底 #

如果发现极端场景下快速滑动时滚动动作还会误触发onClick回调，可以在点击逻辑里增加列表滚动状态的判断，只有非滚动状态下才执行业务逻辑：

// 基于列表状态派生滚动中的布尔值
val isListScrolling by remember {
    derivedStateOf { lazyListState.isScrollInProgress }
}
onClick = {
    // 滚动过程中屏蔽点击逻辑
    if (!isListScrolling) {
        selectedIndex.value = index
    }
}

注意：上述方案1的交互源过滤已经可以覆盖绝大多数误触发场景，滚动状态判断是极端快速滑动下的兜底逻辑，不需要单独使用。

配套规范：正确配置单选组 #

实现严格互斥单选时，需要在外层调用selectableGroup()把同组的selectable条目关联起来，保证同一时间仅能选中一个条目，这是官方定义的单选组实现规范，和滚动误触发问题无直接关联，但可以避免单选状态更新错乱的问题。 #

内容的提问来源于stack exchange，提问作者Edward van Raak