jetpack 撰写 LazyColumn 滚动不起作用

yoo*_*hok 5 android android-jetpack-compose

我正在使用 jetpack compose 开发一个 Android 聊天应用程序。

聊天消息使用 LazyColumn 显示。消息来自 WebSocket。

我想要开发的是:

  • 如果用户在新消息到来时看到最新消息,则 LazyColumn 应滚动到最新消息。
  • 如果当新消息到来时用户正在看到上一条消息(滚动到上方),则不应更改滚动位置。

为了做到这些,我发现listState.layoutInfo.visibleItemsInfo。如果listState.layoutInfo.visibleItemsInfo.lastOrNull()?.index == chatMessages.size - 1表示用户正在看到最新消息。(位于底部)

LazyColumn(
    state = listState
) {
    vm.scrollToBottom.value = listState.layoutInfo.visibleItemsInfo.lastOrNull()?.index == chatMessages.size - 1
    Log.d("TEST", "[test] scrollToBottom: ${vm.scrollToBottom.value}")
    if (vm.scrollToBottom.value) {
        coroutineScope.launch {
            Log.d("TEST", "[test] scroll!")
            listState.animateScrollToItem(chatMessages.size)
        }
    }
    itemsIndexed(chatMessages) { _, chat ->
        when (chat.command) {
            Command.MESSAGE -> when (chat.userId) {
                myId -> MyChat(chat = chat)
                else -> OtherUserChat(chatMsg = chat)
            }
            Command.JOIN -> JoinLeaveMessage(
                chat = chat,
                message = stringResource(R.string.user_joined_group)
            )
            Command.LEAVE -> JoinLeaveMessage(
                chat = chat,
                message = stringResource(R.string.user_left_group)
            )
        }
    }
}
Run Code Online (Sandbox Code Playgroud)

但上面的代码不起作用..我检查了它显示的 logcat...:

2022-03-04 12:17:40.534 19854-19854 D/TEST: [test] scrollToBottom: true
2022-03-04 12:17:40.549 19854-19854 D/TEST: [test] scroll!
2022-03-04 12:17:40.551 19854-19854 D/TEST: [test] scrollToBottom: true
2022-03-04 12:17:40.566 19854-19854 D/TEST: [test] scroll!
...
2022-03-04 12:17:40.635 19854-19854 D/TEST: [test] scrollToBottom: true
2022-03-04 12:17:40.649 19854-19854 D/TEST: [test] scroll!
2022-03-04 12:17:40.651 19854-19854 D/TEST: [test] scrollToBottom: true
2022-03-04 12:17:40.665 19854-19854 D/TEST: [test] scroll!
Run Code Online (Sandbox Code Playgroud)

And*_*æss 0

我认为您正在尝试在渲染 LazyColumn 时滚动。

我还认为你需要再减一,因为索引从 0 开始?

您可以尝试在 LaunchedEffect 中执行此操作,如下所示:

val composableScope = rememberCoroutineScope()
val scrollToBottom = listState.layoutInfo.visibleItemsInfo.lastOrNull()?.index == chatMessages.size - 2
val lastItemIndex = chatMessages.size - 1

LaunchedEffect(scrollToBottom, lastItemIndex) {
    if (scrollToBottom) {
        composableScope.launch {
            listState.animateScrollToItem(lastItemIndex)
        }
    }
}
Run Code Online (Sandbox Code Playgroud)