如何在Jetpack Compose AdapterList中保留滚动位置？

Question

我有一个使用Jetpack Compose构建的列表-详细信息流的应用程序。我希望在从详细信息视图返回到列表视图时，保留滚动位置。

基于模型状态，表面被交换：

@Composable
private fun AppContent() {
    val scrollerPosition = ScrollerPosition()
    Crossfade(State.currentScreen) { screen ->
        Surface(color = MaterialTheme.colors.background) {
            when (screen) {
                is Screen.List -> ListScreen(scrollerPosition)
                is Screen.Details -> DetailsScreen(screen.transaction)
                is Screen.New -> NewScreen()
            }
        }
    }
}

ListScreen曾经使用了VerticalScroller，我给它提供了一个ScrollerPosition以保留屏幕变化后的位置。然而，这种解决方案在AdapterList中不起作用。

以前的代码如下：

@Composable
private fun TransactionsList(modifier: Modifier, scrollerPosition: ScrollerPosition) {
    Box(modifier = modifier.fillMaxSize().wrapContentSize(Alignment.Center)) {
        VerticalScroller(scrollerPosition = scrollerPosition) {
            AdapterList(State.transactions, itemCallback = { transaction ->
                TransactionListRow(transaction)
                ListDivider()
            })
        }
    }
}

如何使AdapterList保持滚动位置？

@Composable
private fun TransactionsList(modifier: Modifier, scrollerPosition: ScrollerPosition) {
    Box(modifier = modifier.fillMaxSize().wrapContentSize(Alignment.Center)) {
        AdapterList(State.transactions, itemCallback = { transaction ->
            TransactionListRow(transaction)
            ListDivider()
        })
    }
}

- Yuriy Kulikov

---

目前（dev13版本）还不支持，但是Compose团队会在后续版本中添加这个功能。 - Habib Kazemi

Answer 1

rememberScrollState()？

我认为可以将其提取为值，或者可以使用 lerp() 函数，通过将其作为自定义 Composable 而不是使用 Layout()

为什么不使用 LazyColumn 呢？

- Richard Onslow Roper

---

我不明白为什么那不是答案？第一行代码就包含了保留滚动位置的方法。第二行是另一种选择，而第三行则提供了一个好的建议。 - Richard Onslow Roper

Answer 2

随着 Jetpack Compose 1.0 的推出，使用 rememberLazyListState() 可以实现滚动位置的保留。

为了保留状态，请在树中较高的位置初始化状态变量，例如，在导航上方。然后将其传递给 LazyColumn。

以下是一个示例：Crossfade 在列表和详细信息之间切换时保留列表中的滚动位置：

  val listState = rememberLazyListState()

  Crossfade(screen) { scr ->
    Surface(color = colors.background) {
      when (scr) {
        is Screen.List -> LazyColumn(state = listState) {
              items(items) { item ->
                // here come the items
              }
            }
        is Screen.Details -> DetailsScreen()
      }
    }
  }

items的大小必须保持不变，才能使其正常运行。

- Yuriy Kulikov