Jetpack Compose中TextField启用/禁用后如何管理与转移焦点

问题场景 #

初始状态下仅第一个TextField为启用状态，其余输入框全部禁用；当业务逻辑触发其他TextField切换为启用状态时，输入框无法自动获取焦点，需要通过编程方式主动转移焦点。
布局效果如下：

原有控制输入框启用/禁用状态的业务代码如下：

fun enabledDisabledTextField(
    enteredValues: MutableList<String>,
    index: Int,
    isEnabled: Boolean
): Boolean {
    var enabled = isEnabled
    val isFirstTime = enteredValues[0].isEmpty()

    if (isFirstTime) {
        if (enteredValues[index].isEmpty()) {
            enabled = index == 0
        }
    } else {
        when {
            enteredValues[index].isEmpty() -> enabled = true
            enteredValues[index].isNotEmpty() -> enabled = false
            index == enteredValues.size - 1 -> enabled = true
        }
    }
    return enabled
}

具体实现 #

• 创建和输入框一一对应的FocusRequester实例
  在输入框列表所属的Composable作用域内，初始化长度和输入框总数一致的FocusRequester列表，通过remember保存避免重组时重复创建：

  val focusRequesters = remember {
      List(enteredValues.size) { FocusRequester() }
  }
  

• 给对应TextField绑定焦点请求器
  给每个TextField的modifier添加focusRequester配置，绑定对应index的实例：

  val fieldEnabled = enabledDisabledTextField(enteredValues, index, isEnabled)
  TextField(
      value = enteredValues[index],
      onValueChange = { newVal ->
          enteredValues[index] = newVal
          // 自行补充输入值更新、校验等业务逻辑
      },
      enabled = fieldEnabled,
      modifier = Modifier.focusRequester(focusRequesters[index])
  )
  

• 监听启用状态变化，重组完成后主动请求焦点
  禁用状态下的输入框无法响应焦点请求，因此需要在输入框状态切换为启用后，等待重组完成再发起焦点申请：

  LaunchedEffect(fieldEnabled) {
      if (fieldEnabled) {
          // 等待一帧确保组件完成状态切换，避免焦点请求无效
          awaitFrame()
          focusRequesters[index].requestFocus()
      }
  }
  

  注意：awaitFrame()需要导入依赖androidx.compose.ui.platform.awaitFrame，如果不想引入该方法，替换为delay(10)也可以实现相同效果。

逻辑优化建议 #

当前的启用状态控制逻辑存在冲突：非首次进入场景下，最后一个输入框会被强制设置为启用状态，如果中间存在未输入的空输入框，会出现多个输入框同时启用的情况，导致焦点抢占异常，建议调整判断逻辑，确保同一时间仅当前待输入的输入框处于启用状态。

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