Jetpack Compose：禁用与TextField的交互

Question

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

- Archie G. Quiñones

---

目前这是一个已知的功能请求：https://issuetracker.google.com/issues/166478534 - Saurabh Thorat

这个链接可能会有所帮助：https://dev59.com/D73pa4cB1Zd3GeqPaT00#65699135 - LEGEND MORTAL

Answer 1

你可以使用 enabled 属性： enabled：控制 TextField 的启用状态。当为 false 时，文本字段既不能编辑也不能聚焦，文本字段的输入不可选择，在视觉上，文本字段将显示为禁用的 UI 状态。 类似于下面这样：

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

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

- Gabriele Mariotti

---

“enabled” 不会对 “disabledTextColor” 产生影响，有解决的方法吗？ - gaohomway

你知道如何使TextField可编辑和可聚焦但不可选择吗？ - tasjapr

为了使文本不可选择，在 DisableSelection { ... } 中包装组件。 - simpleuser

Answer 2

我目前的项目正在使用 alpha08 版本。希望他们尽快添加一些内置的方法来完成这项工作，但与此同时，我一直在做这个：

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 的大小相同。您可以调整 TextField 的大小，对无形框调用 .matchParentSize() 可使它与 TextField 大小匹配，因为它们是父框中仅有的子元素。

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

- Aystub

Answer 3

readOnly 属性也可以在需要可聚焦和可选择的文本字段但不可编辑的情况下工作。

就像这样：

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

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

- Asad Mahmood