单击 jetpack compose 中的空格时如何隐藏键盘？

Question

我正在尝试学习 android jetpack compose 中的文本字段，所以我在屏幕上有两个文本字段，当我在第一个文本字段中输入内容时，我想在单击屏幕上的空格时关闭键盘。我正在使用

 .pointerInput(Unit) {
                detectTapGestures(onTap = {
                    focusManager.clearFocus()
                })
            } 

这行代码可以工作，但对于像 10 文本字段这样的多文本字段不起作用，例如，当我单击 8.textfield 时，底部屏幕看起来是黑色的。我不知道为什么它是黑色的？任何想法？

@Composable
fun KeyboardSample(){
val focusManager = LocalFocusManager.current
    Column(
        modifier = Modifier
            .fillMaxSize()
         .pointerInput(Unit) {
            detectTapGestures(onTap = {
                focusManager.clearFocus()
            })
        }
            .padding(start = 16.dp, end = 16.dp),

    ) {

        var name by rememberSaveable { mutableStateOf("") }
        val updateName = { _name : String ->
            name = _name
        }

        var amount by rememberSaveable { mutableStateOf("") }
        val updateAmount = { _amount : String ->
            amount = _amount
        }

        TextFiledsToExperiment(
            name = name,
            updateName = updateName,
            amount = amount,
            updateAmount = updateAmount
        )

    }
}

@Composable
fun TextFiledsToExperiment(
    name : String,
    updateName : (String) -> Unit,
    amount : String,
    updateAmount : (String) -> Unit
){
    val focusManager = LocalFocusManager.current

    Column(
        horizontalAlignment = Alignment.CenterHorizontally,
        verticalArrangement = Arrangement.Center
    ) {
        OutlinedTextField(
            value = name,
            onValueChange = updateName ,
            label = { Text("Name") },
            placeholder = { Text(text = "Name") },
            singleLine = true,
            keyboardOptions = KeyboardOptions.Default.copy(
                capitalization = KeyboardCapitalization.Sentences,
                autoCorrect = true,
                keyboardType = KeyboardType.Text,
                imeAction = ImeAction.Next
            ),
            keyboardActions = KeyboardActions(onNext = {
                focusManager.moveFocus(FocusDirection.Down)
            }),
            modifier = Modifier
                .fillMaxWidth()
                .padding(top = 6.dp, start = 0.dp, end = 0.dp, bottom = 6.dp),
        )

        OutlinedTextField(
            value = amount,
            onValueChange = updateAmount ,
            label = { Text("Amount") },
            placeholder = { Text(text = "Amount") },
            singleLine = true,
            keyboardOptions = KeyboardOptions.Default.copy(
                capitalization = KeyboardCapitalization.Sentences,
                autoCorrect = true,
                keyboardType = KeyboardType.Number,
                imeAction = ImeAction.Done
            ),
            keyboardActions = KeyboardActions(onDone = {
                focusManager.clearFocus()
            }),
            modifier = Modifier
                .fillMaxWidth()
                .padding(top = 6.dp, start = 0.dp, end = 0.dp, bottom = 6.dp),
        )

    }
}

Answer 1

您可以简单地在列中创建可点击的修饰符并在其中运行隐藏功能。

val keyboardController = LocalSoftwareKeyboardController.current

Column(Modifier.clickable{keyboardController?.hide()}){
//
}