Jetpack Compose：禁用与 TextField 的交互

Question

有没有办法禁用 Jetpack Compose 的 TextField 的所有交互？

Answer 1

我的项目是在alpha08atm上。希望他们很快添加一些内置的方法来做到这一点，但与此同时我一直在这样做：

val textState = remember { mutableStateOf(TextFieldValue()) }
val disabled = remember { mutableStateOf(true) }
Box {
  TextField(value = textState.value, onValueChange = {
    textState.value = it
  })
  if (disabled.value) {
    // Set alpha(0f) to hide click animation
    Box(modifier = Modifier.matchParentSize().alpha(0f).clickable(onClick = {}))
  }
}

所以是的，绘制一个不可见的可点击框，其大小与文本字段相同。您可以将 TextField 的大小调整为您想要的任何大小，调用.matchParentSize()不可见的 Box 将使其与 TextField 匹配，因为它们是父 Box 中唯一的子项。

disabled.value = true/false您可以通过在适当的位置进行设置来切换禁用状态。

Answer 2

readOnly如果您想要可聚焦和可选择的文本字段但不可编辑，属性也可以工作。

像这样：

   var value by remember { mutableStateOf("Hello World!") }

    TextField(
        value = value,
        onValueChange = { value = it },
        readOnly = true,
    )

Answer 3

有了1.0.0你可以使用enabled属性：

enabled: 控制TextField. 当 时false，文本字段将不可编辑也不可聚焦，文本字段的输入将不可选择，视觉文本字段将出现在禁用 UI 状态

就像是：

var text by rememberSaveable { mutableStateOf("Text") }

TextField(
    value = text,
    onValueChange = { text = it },
    enabled = false,
    label = { Text("Label") },
    singleLine = true
)