在 Jetpack Compose 中设置焦点顺序的最简单方法是什么？

如何解决在 Jetpack Compose 中设置焦点顺序的最简单方法是什么？

我有一列 TextFields，例如：

Column {
    TextField(
        value = ...,onValueChange = { ... },keyboardOptions = KeyboardOptions(imeAction = ImeAction.next),)
    TextField(
        value = ...,)
    .
    .
    .
}

我希望当用户按下 Tab 键或键盘上的下一个按钮时，每个 TextField 的焦点都会移动到下一个。当前按 Tab 会将一个选项卡插入到 TextField 中。按下一步按钮什么也不做。我可以为每个 TextField 创建一个 FocusRequester 并设置 keyboardActions onNext 以请求关注每个文本字段的下一个字段。这有点乏味，它没有解决 Tab 行为。

解决方法

不确定这是否更简单，但您可以为每个字段创建一个 FocusRequester 对象并按照您想要的顺序请求焦点。

@Composable
fun FocusRequestScreen() {
    // Create FocusRequesters... (you can use createRefs function)
    val focusRequesters = List(3) { FocusRequester() }

    Column {
        TextFieldWithFocusRequesters(focusRequesters[0],focusRequesters[1])
        TextFieldWithFocusRequesters(focusRequesters[1],focusRequesters[2])
        TextFieldWithFocusRequesters(focusRequesters[2],focusRequesters[0])
    }
}

@Composable
private fun TextFieldWithFocusRequesters(
    focusRequester: FocusRequester,nextFocusRequester: FocusRequester
) {
    var state by rememberSaveable {
        mutableStateOf("Focus Transition Test")
    }
    TextField(
        value = state,onValueChange = { text -> state = text },// Here it is what you want...
        modifier = Modifier
            .focusOrder(focusRequester) {
                nextFocusRequester.requestFocus()
            },keyboardOptions = KeyboardOptions(imeAction = ImeAction.Next)
    )
}

我从 here 获得此代码。虽然它没有解决标签问题...... :(

,

关于订单，您可以查看@nglauber answer。

要使用 Tab 键，您可以使用 onKeyEvent modifier。

TextField(
    modifier = Modifier
        .focusRequester(focusRequester)
        .onKeyEvent {
            if (it.key.keyCode == Key.Tab.keyCode){
                focusRequesterNext.requestFocus()
                true //true -> consumed
            } else false },value = text,onValueChange = { it -> text = it },keyboardOptions = KeyboardOptions(imeAction = ImeAction.Next),keyboardActions = KeyboardActions(
        onNext = {focusRequesterNext.requestFocus()}
        )
)