Jetpack是一个懒散的滚动列表监听器

Question

我想以编程方式更改当用户滚动下面列表中的每个“查看更多”项目时选择的选项卡。我如何才能最好地完成这项工作？

Answer 1

您可以使用 LazyListState.firstVisibleItemIndex 属性（通过 rememberLazyListState 获取，并设置为 LazyColumn 的状态参数），并基于此设置当前选项卡。

读取该属性被视为在 Compose 中读取的模型，因此每当第一个可见项发生更改时，它将触发重新组合。

如果您想做一些更复杂的事情，而不仅仅是基于第一个可见项，那么可以使用LazyListState。layoutInfo获取所有可见项及其位置的信息，而不仅仅是第一个。

Answer 2

只需创建一个嵌套滚动连接，并将其分配给父视图nestedScroll修改器：

val nestedScrollConnection = remember {
    object : NestedScrollConnection {
        override fun onPreScroll(available: Offset, source: NestedScrollSource): Offset {
            val delta = available.y
            // called when you scroll the content
            return Offset.Zero
        }
    }
}

将其分配给LazyColong或其父组合视图：

Modifier.nestedScroll(nestedScrollConnection)

例如:

LazyColumn(
    ...
    modifier = Modifier.nestedScroll(nestedScrollConnection)
) {
    items(...) {
       Text("Your text...")
    }
}

Answer 3

当Ryan M编写时，您可以使用LazyListState.firstVisibleItemIndex。Compose的神奇之处在于您可以在if语句中使用它，而Compose将完成这项工作。请看以下示例，它根据第一个可见项显示不同的文本。同样，您可以根据第一个可见项选择不同的选项卡。

class MainActivity : ComponentActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

        setContent {
            val listState = rememberLazyListState()

            Column {
                Text(if (listState.firstVisibleItemIndex < 100) "< 100" else ">= 100")
                LazyColumn(state = listState) {
                    items(1000) {
                        Text(
                            text = "$it",
                            modifier = Modifier.fillMaxWidth(),
                        )
                    }
                }
            }
        }
    }
}