首页 > 解决方案 > Android Compose LazyList - 当新项目添加到列表顶部时保持滚动位置

问题描述

这是我添加任何新项目之前的原始列表

原始清单

当我将新项目添加到列表末尾时,不滚动,第一个项目仍保留在该位置

将新项目添加到末尾后的列表

但是当我将新项目添加到列表的开头时,所有旧项目都会下移。请注意,New item 0它不再位于列表的顶部

将新项目添加到开头后的列表

我怎样才能做到这一点,如果我在列表的开头添加一个新项目,旧项目仍然保留在确切的位置。这些新项目只有在用户向上滚动时才可见,而不是向下推所有内容。如果我没记错的话,这是默认行为RecyclerView

这是我的代码: MainActivity.kt

class MainActivity : ComponentActivity() {
    private val list = MutableStateFlow<List<String>>(emptyList())

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContent {
            EmptyComposeTheme {
                val items = list.collectAsState()
                Box(Modifier.fillMaxSize()) {
                    LazyColumn(
                        Modifier.fillMaxSize(),
                    ) {
                        itemsIndexed(items.value) { index: Int, item: String ->
                            Text(item, color = MaterialTheme.colors.onSurface)
                        }
                    }
                    FloatingActionButton(onClick = {
                        val oldList = list.value.toMutableList()
                        oldList.add("New item ${oldList.size}")
                        list.value = oldList
                    }, Modifier.align(Alignment.BottomStart)) {
                       Text("Click me!")
                    }
                    FloatingActionButton(onClick = {
                        val oldList = list.value.toMutableList()
                        oldList.add(0, "New item reversed ${oldList.size}")
                        list.value = oldList
                    }, Modifier.align(Alignment.BottomEnd)) {
                        Text("Click other me!")
                    }
                }
            }
        }
    }
}

我正在使用撰写版本1.0.1

标签: androidandroid-jetpack-compose

解决方案


你可以像这样将关键参数添加到 LazyColumn,但是如果你的 firstVisibleIndex = 0,那么问题没有解决,我不知道为什么它:

LazyColumn(
    state = listState,
    modifier = Modifier.fillMaxSize(),
    key = { item -> item.id} // or any unique value
) {
    ...
}

推荐阅读