Android中键盘向上或向下时如何自动滚动LazyColumn

Question

我正在用 android compose 制作一个聊天应用程序。

通常，当您在聊天窗口内自由滚动并按下文本输入窗口调出键盘时，屏幕底部的聊天内容会自然向上移动。

我尝试自然地实现它，但效果不佳。

我尝试使用

rememberLazyListState()

来使用

scrollOffset

或

listState.scrollToItem

来输入

listState.animationScrollToItem

，但感觉很不自然。

如何实现自然的LazyColumn滚动？

[编辑] 我认为需要额外的解释，所以我会附上一张照片。 你能看到聊天窗口像键盘出现之前那样稍微重叠在输入窗口上吗？

即使键盘出现，你能看到聊天内容仍在上传，与输入窗口重叠吗？

这就是我想要的。我希望我正在查看的最后一个聊天内容能够在屏幕上滚动，即使键盘被抬起或放下也是如此。 照片来自 Telegram。

Answer 1

尝试添加 Modifier.imePadding() 当键盘出现时，它会将内容向上推，包括你的 LazyColumn。

@Composable
fun ChatScreen() {
    val listState = rememberLazyListState()
    val messages = remember { mutableStateListOf<String>() }
    var textFieldValue by remember { mutableStateOf("") }
    val keyboardController = LocalSoftwareKeyboardController.current

    // Add a dummy list of messages for demonstration
    LaunchedEffect(Unit) {
        repeat(50) { index ->
            messages.add("Message $index")
        }
    }

    // Scroll to the bottom of the list when the keyboard appears
    LaunchedEffect(keyboardController?.isVisible) {
        if (keyboardController?.isVisible == true) {
            listState.animateScrollToItem(messages.size - 1)
        }
    }

    Column(
        modifier = Modifier
            .fillMaxSize()
            .imePadding() // Adjust padding based on the IME
    ) {
        LazyColumn(
            state = listState,
            modifier = Modifier.weight(1f),
            reverseLayout = true // Start from the bottom
        ) {
            items(messages) { message ->
                Text(
                    text = message,
                    modifier = Modifier.padding(8.dp)
                )
            }
        }

        BasicTextField(
            value = textFieldValue,
            onValueChange = { textFieldValue = it },
            modifier = Modifier
                .fillMaxWidth()
                .padding(8.dp)
        )
    }
}