如何解决自定义 FormTextField 中的文本选择和光标移动问题？

2024-03-28 04:15:23

解决自定义 FormTextField 中的文本选择和光标移动问题

问题介绍

在使用自定义的 FormTextField 组件时，输入的文本无法选择，并且无法移动光标。这可能会给用户带来不便，尤其是在输入长文本或需要对文本进行精确编辑时。此问题可能是由与 Google 问题跟踪器中报告的文本选择问题或 onValueChange 事件处理程序中过滤输入时的内部问题引起的。

解决方案

为了解决这个问题，我们需要采取两步措施：

排除 Google 问题的影响： 确保使用最新版本的 Material3 组件库并正确配置 OutlinedTextField 组件。
检查 FormTextField 的 onValueChange 处理程序： 审查是否正确过滤输入以仅允许数字，并确保 TextFieldValue 的新值以正确的方式分配给 updatedStock 状态变量。

建议的改进

以下是改进 FormTextField 的一些建议：

使用正则表达式在 onValueChange 处理程序中过滤非数字字符。
将 updatedStock 状态变量初始化为一个空的 TextFieldValue，而不是 "0"。
在过滤非数字字符后，使用 TextFieldValue.copy 方法而不是分配一个新的 TextFieldValue 对象。

修改后的 `FormTextField`

@Composable
fun FormTextField(
    value: TextFieldValue,
    onValueChange: (TextFieldValue) -> Unit,
    modifier: Modifier = Modifier,
    labelTxt: String,
    placeholderTxt: String,
    focusedBorderColor: Color,
    textColor: Color = colorResource(id = R.color.black),
    keyboardOptions: KeyboardOptions,
    keyboardActions: KeyboardActions,
    trailingIcon: @Composable() (() -> Unit)? = null,
) {
    OutlinedTextField(
        value = value,
        onValueChange = { newValue ->
            val filteredValue = newValue.text.filter { it.isDigit() }
            onValueChange(TextFieldValue.copy(filteredValue))
        },
        label = {
            Text(labelTxt, color = focusedBorderColor, fontSize = 12.sp)
        },
        placeholder = {
            Text(placeholderTxt, fontSize = 12.sp)
        },
        textStyle = TextStyle(
            color = textColor
        ),
        shape = RoundedCornerShape(8.dp),
        colors = OutlinedTextFieldDefaults.colors(
            focusedBorderColor = focusedBorderColor,
            cursorColor = focusedBorderColor,
            unfocusedBorderColor = Color(0xFFBEBEBE),
        ),
        modifier = modifier,
        keyboardOptions = keyboardOptions,
        keyboardActions = keyboardActions,
        trailingIcon = trailingIcon
    )
}

常见问题解答

如何排除 Google 问题的影响？
- 使用最新版本的 Material3 组件库。
- 确保 OutlinedTextField 组件使用正确的 API 和参数。
如何过滤 onValueChange 处理程序中的输入？
- 使用正则表达式来过滤非数字字符。
如何正确分配 TextFieldValue 的新值？
- 初始化 updatedStock 状态变量为一个空的 TextFieldValue。
- 使用 TextFieldValue.copy 方法来复制 TextFieldValue 对象。
为什么修改后的 FormTextField 更优？
- 它使用了更准确的文本过滤。
- 它避免了可能导致问题的状态变量初始化。
- 它提高了性能，因为不再创建新的 TextFieldValue 对象。
我可以在哪里获得帮助，了解更多信息？
- 请查看 Google Issue Tracker 了解更多信息。
- 加入 Android 开发者社区以获得支持。