检查特定 LazyColumn 项目何时出现的有效方法？

Question

我需要检查某个 LazyColumn 项目何时进入视图，一旦出现，只回调 onItemWithKeyViewed() 一次以通知该项目已被查看。 我的尝试：

@Composable
fun SpecialList(
    someItems: List<Things>,
    onItemWithKeyViewed: () -> Unit
) {
    val lazyListState = rememberLazyListState()

    if (lazyListState.isScrollInProgress) {
        val isItemWithKeyInView = lazyListState.layoutInfo
            .visibleItemsInfo
            .any { it.key == "specialKey" }
        if (isItemWithKeyInView) {
            onItemWithKeyViewed()
        }
    }

    LazyColumn(
        state = lazyListState
    ) {
        items(items = someItems) { itemData ->
            ComposableOfItem(itemData)
        }
        item(key = "specialKey") {
            SomeOtherComposable()
        }
    }
}

我的方法存在问题，我注意到列表滚动性能严重下降并丢失帧。我意识到这可能是因为它在每一帧检查所有可见的项目键？

此外，onItemWithKeyViewed() 当前被多次调用，而不是第一次被查看。

是否有更有效的方法仅在第一次查看 "specialKey" 项目时对 onItemWithKeyViewed() 进行一次回调？

Answer 1

1. 在这种情况下，当你有一个经常更新的状态时，你应该使用derivedStateOf：这只会在计算结果实际改变时才引起重组。
2. 您不应直接在可组合构建器中调用副作用（即调用 onItemWithKeyViewed）。您应该改用特殊的 side-effect 函数之一，通常是 LaunchedEffect - 这可确保不会重复该操作。您可以在 Thinking in Compose and in side-effects documentation.
中找到有关此主题的更多信息

val isItemWithKeyInView by remember {
    derivedStateOf {
        lazyListState.isScrollInProgress &&
                lazyListState.layoutInfo
                    .visibleItemsInfo
                    .any { it.key == "specialKey" }
    }
}
if (isItemWithKeyInView) {
    LaunchedEffect(Unit) {
        onItemWithKeyViewed()
    }
}