防止键盘出现在Jetpack Compose应用程序中

Question

我正在制作一个计算器来学习写作，所以我把自己的数字按钮放在屏幕上，我想防止软键盘出现。

这是我的repo：https://github.com/vitor-ramos/CalculadorCompose

我在TextFieldImpl中注意到。kt有一个显示键盘的修改器，所以我试图克隆代码并删除这行：keyboardController。价值showSoftwareKeyboard（）我知道这样复制代码不是个好主意，但我想尝试一下，结果失败了。正如您在下面的原始代码中看到的，有一个TODO说明它应该由BaseTextField处理，但我查看了它的代码，没有找到它显示或隐藏键盘的位置。

val textFieldModifier = modifier
    .focusRequester(focusRequester)
    .focusObserver { isFocused = it.isFocused }
    .clickable(indication = null) {
        focusRequester.requestFocus()
        // TODO(b/163109449): Showing and hiding keyboard should be handled by BaseTextField.
        //  The requestFocus() call here should be enough to trigger the software keyboard.
        //  Investiate why this is needed here. If it is really needed, instead of doing
        //  this in the onClick callback, we should move this logic to the focusObserver
        //  so that it can show or hide the keyboard based on the focus state.
        keyboardController.value?.showSoftwareKeyboard()
    }

我在这个问题中发现，通过视图，我可以扩展EditText并更改功能，但我还没有找到Compose： Android的等价物：完全禁用软键盘EditTexts

public class NoImeEditText extends EditText {
    public NoImeEditText(Context context, AttributeSet attrs) {
        super(context, attrs);
    }
    @Override
    public boolean onCheckIsTextEditor() {
        return false;
    }
}

Answer 1

使用ReadonlyTextField无法定位光标。因此，在撰写AndroidView中添加了包装的EditText

@Composable
fun NoKeyboardTextField(
    modifier: Modifier,
    text: String,
    textColor: Int
) {
    AndroidView(
        modifier = modifier,
        factory = { context ->
            AppCompatEditText(context).apply {
                isFocusable = true
                isFocusableInTouchMode = true
                showSoftInputOnFocus = false
            }
        },
        update = { view ->
            view.setText(text)
            view.setTextColor(textColor)
            view.setSelection(text.length)
        }
    )
}

Answer 2

我创建了一个ComposableReadonlyTextField，它在文本字段前面放置了一个不可见的框。该框与文本字段大小相同。

使用该解决方法，您无法再聚焦文本字段，因此不会出现键盘。为了应用自定义单击处理，我在Box-Modifier中添加了onClick。

这不是一个真正干净的解决方案，而是一个很好的解决方法。

@Composable
fun ReadonlyTextField(
    value: TextFieldValue,
    onValueChange: (TextFieldValue) -> Unit,
    modifier: Modifier = Modifier,
    onClick: () -> Unit,
    label: @Composable () -> Unit
) {

    Box {
        TextField(
            value = value,
            onValueChange = onValueChange,
            modifier = modifier,
            label = label
        )

        Box(
            modifier = Modifier
                .matchParentSize()
                .alpha(0f)
                .clickable(onClick = onClick),
        )
    }
}

@Composable
fun App() {
    val textState = remember { mutableStateOf(TextFieldValue()) }

    Column {
        ReadonlyTextField(
            value = textState.value,
            onValueChange = { textState.value = it },
            onClick = {
                // custom click handling (e.g. open dialog)
            },
            label = {
                Text(text = "Keyboardless Input")
            }
        )
    }
}

在我的中间帖子中可以找到一个完整的综合示例：https://caelis.medium.com/jetpack-compose-datepicker-textfield-39808e42646a

学分也归到这个stackoverflow答案：Jetpack Compose：禁用与TextField的交互

Answer 3

我已经测试了Arun Pdiyan解决方案，并与null LocalTextInputService一起工作（在我的情况下，我从设备附加的条形码阅读器读取数据）

 CompositionLocalProvider(
        LocalTextInputService provides null
    ) {
        TextField(
            value = barcodeReaderService.readedText.value,
            onValueChange = { textState.value=it },
            label = { Text("The Label") }
        )
    }