Jetpack Compose：非LazyColumn布局键盘弹出时无法自动滚动至底部

我希望在键盘弹出时，将非LazyColumn的布局滚动至最底部，目前键盘弹出的检测功能正常，但自动滚动始终不生效，相关代码如下：

var parentSize by remember {
    mutableStateOf(Size.Zero)
}
val scrollState = rememberScrollState()

DisposableEffect(view) {
    scope.launch {
        scrollState.animateScrollTo(parentSize.height.toInt())
    }
    val listener = ViewTreeObserver.OnGlobalLayoutListener {
        val isKeyboardOpen = ViewCompat.getRootWindowInsets(view)
            ?.isVisible(WindowInsetsCompat.Type.ime()) ?: true
        if (isKeyboardOpen) {
            scope.launch {
                scrollState.animateScrollTo(parentSize.height.toInt())
            }
        }
    }

    view.viewTreeObserver.addOnGlobalLayoutListener(listener)
    onDispose {
        view.viewTreeObserver.removeOnGlobalLayoutListener(listener)
    }
}

OutlinedTextField(
    value = uiState.emailInput,
    onValueChange = { onEmailInputChanged(it) },
    label = { Text(text = stringResource(id = C.string.email)) },
    keyboardOptions = KeyboardOptions(
        keyboardType = KeyboardType.Email,
        imeAction = ImeAction.Next
    ),
    singleLine = true,
    modifier = Modifier
        .fillMaxWidth()
        .padding(horizontal = Dimen.medium)
        .onFocusChanged {
            scope.launch {
                scrollState.animateScrollTo(parentSize.height.toInt())
            }
        }
)
// the very bottom view
Button(
                onClick = { onLoginClicked() },
                modifier = Modifier
                    .wrapContentHeight(Alignment.Bottom)
                    .defaultMinSize(minHeight = Dimen.veryLarge)
                    .fillMaxWidth()
                    .onGloballyPositioned {
                        //here u can access the parent layout coordinate size
                        parentSize = it.parentLayoutCoordinates?.parentLayoutCoordinates?.size?.toSize()?: Size.Zero
                    }
                    .padding(start = Dimen.medium, end = Dimen.medium, bottom = Dimen.medium),
                enabled = !uiState.isLoading && uiState.inputCorrect,
            )

问题根源及解决方案 #

• 滚动状态未绑定到可滚动容器：你创建了scrollState但没有将它关联到根布局的滚动Modifier上。没有这个绑定，滚动状态无法控制布局的滚动行为。需要给根可滚动容器（比如Column）添加Modifier.verticalScroll(scrollState)。

• 手动计算滚动高度的逻辑错误：你通过Button的父布局层级获取parentSize，这个层级关系很可能不准确，导致拿到的高度值错误或为零。实际上scrollState.maxValue已经提供了滚动到底部的目标位置，完全不需要手动计算布局高度。

• 滚动时机与初始值问题：DisposableEffect初始化时直接调用滚动，此时parentSize还是初始的Size.Zero，滚动没有实际效果；同时键盘弹出时的滚动应该确保布局已完成重绘，使用scrollState.maxValue可以避免这个问题。

修正后的关键代码示例 #

1. 绑定滚动状态到根容器：

// 根可滚动容器，必须添加verticalScroll绑定scrollState
Column(
    modifier = Modifier
        .fillMaxSize()
        .verticalScroll(scrollState)
) {
    // 放置你的OutlinedTextField、Button等布局元素
}

2. 修正滚动逻辑：

val scrollState = rememberScrollState()
val scope = rememberCoroutineScope()

DisposableEffect(view) {
    val listener = ViewTreeObserver.OnGlobalLayoutListener {
        val isKeyboardOpen = ViewCompat.getRootWindowInsets(view)
            ?.isVisible(WindowInsetsCompat.Type.ime()) ?: false
        if (isKeyboardOpen) {
            scope.launch {
                // 使用scrollState.maxValue直接滚动到底部
                scrollState.animateScrollTo(scrollState.maxValue)
            }
        }
    }

    view.viewTreeObserver.addOnGlobalLayoutListener(listener)
    onDispose {
        view.viewTreeObserver.removeOnGlobalLayoutListener(listener)
    }
}

3. 移除Button中不必要的parentSize代码：

Button(
    onClick = { onLoginClicked() },
    modifier = Modifier
        .wrapContentHeight(Alignment.Bottom)
        .defaultMinSize(minHeight = Dimen.veryLarge)
        .fillMaxWidth()
        .padding(start = Dimen.medium, end = Dimen.medium, bottom = Dimen.medium),
    enabled = !uiState.isLoading && uiState.inputCorrect,
) {
    Text(text = stringResource(id = C.string.login))
}

内容的提问来源于stack exchange，提问作者Simon