Jetpack Compose - 滚动到列中的可组合焦点

问题描述

我有这样的用户界面：

val scrollState = rememberScrollState()
        Column(
            modifier = Modifier
                .fillMaxSize(1F)
                .padding(horizontal = 16.dp)
                .verticalScroll(scrollState)
        ) {

            TextField(...)
 // multiple textfields
             TextField(
                        //...
                        modifier = Modifier.focusOrder(countryFocus).onFocusChanged {
                            if(it == Focusstate.Active) {
                               // scroll to this textfield
                            }
                        },)
         }

我在此列中有多个 TextField，当其中一个聚焦时，我想将 Column 滚动到它。 scrollState scrollState.smoothScrollTo(0f) 中有一个方法，但我不知道如何获得焦点 TextField 位置。

更新：

我似乎找到了一个可行的解决方案。我用过 onGloballyPositioned 并且有效。但我不确定这是否是解决此问题的最佳方法。

var scrollToPosition = 0.0F

TextField(
   modifier = Modifier
    .focusOrder(countryFocus)
    .onGloballyPositioned { coordinates ->
        scrollToPosition = scrollState.value + coordinates.positionInRoot().y
    }
    .onFocusChanged {
    if (it == Focusstate.Active) {
        scope.launch {
            scrollState.smoothScrollTo(scrollToPosition)
        }
    }
}
)

解决方法

compose 中有一个新东西叫做 RelocationRequester。那为我解决了问题。我的自定义 TextField 中有类似的内容。

val focused = source.collectIsFocusedAsState()
val relocationRequester = remember { RelocationRequester() }
val ime = LocalWindowInsets.current.ime
if (ime.isVisible && focused.value) {
    relocationRequester.bringIntoView()
}

,

似乎使用 LazyColumn 和 LazyListState.animateScrollToItem() 而不是 Column 可能是您的案例的不错选择。

参考：https://developer.android.com/jetpack/compose/lists#control-scroll-position

顺便说一下，感谢您提供有关 onGloballyPositioned() 修饰符的信息。我正在为正常的 Column 情况寻找解决方案。它为我节省了很多时间！