在 Jetpack Compose 中立即启用并聚焦文本字段

Question

我正在尝试在 Jetpack Compose 中实现TextField具有以下功能的 ：首先它被禁用，但是当用户按下 时Button，它会被启用并同时接收焦点。这是我的方法：

var text by remember { mutableStateOf("text") }
var enabled by remember { mutableStateOf(false)}
val focusRequester = remember { FocusRequester() }

Column {
    TextField(
        value = text,
        onValueChange = { text = it },
        enabled = enabled,
        modifier = Modifier.focusRequester(focusRequester),
        textStyle = TextStyle(fontSize = 24.sp)
    )
    Button(onClick = {
        enabled = true
        focusRequester.requestFocus()
    }) {
        Text("Enable and request focus")
    }

但是，当按下按钮时，TextField只会启用，而不是聚焦。要聚焦它，用户必须再次单击它。我做错了什么以及可能的解决方法是什么？

Answer 1

您必须监听enabled参数的变化才能将焦点转移到TextField.

您可以将代码更改为：

    Button(onClick = {
        enabled = true

    }) {
        Text("Enable and request focus")
    }

    LaunchedEffect(enabled) {
        if (enabled){
            focusRequester.requestFocus()
        }
    }

Answer 2

我曾经遇到过类似的问题，我通过使用解决了它interactionSource。代码看起来像这样：

var text by remember { mutableStateOf("text") }
var enabled by remember { mutableStateOf(false)}
val focusRequester = remember { FocusRequester() }
val interactionSource = remember { MutableInteractionSource() } // add this

Column {
    TextField(
        value = text,
        onValueChange = { text = it },
        enabled = enabled,
        modifier = Modifier
            .focusable(interactionSource = interactionSource) // and this
            .focusRequester(focusRequester),
        textStyle = TextStyle(fontSize = 24.sp)
    )
    ...

IIRC 以正确的顺序拥有.focusable()和很重要.focusRequester()，但无法准确记住是哪个，因此如果不能立即起作用，请尝试交换它们。