Jetpack Compose - 在文本字段中捕获关键事件

Question

我想在待办事项列表中创建一个文本字段，其中 when the user presses backspace on an empty text field , it removes itself 来自列表，如您所见，操作非常简单！

Jetpack Compose，如果键事件是可编辑的，Core Text Field 不会将其键事件传播给父可组合项/修饰符~~写在他们的代码中

所以我尝试了这个，但它没有按预期工作

Modifier.onKeyEvent {
     Log.d("BL_KeyEvent",it.type.toString())
     if (it.key.keyCode == Key.Backspace.keyCode) {
           if (item.text.isEmpty()) {
              onBackspaceRemove()
           }
       }
       false
     }

我只是想知道如何实现它，因为 CoreTextField 是内部的，我无法在文本字段中捕获关键事件

Answer 1


@Composable
fun StackList(){
    var list = remember { mutableStateListOf<String>() } // This should be in your viewmodel
    LazyColumn{
        items(list){item ->
            var value by remember { mutableStateOf("") }
            TextField(
                modifier = Modifier.onKeyEvent {
                    Log.d("BL_KeyEvent",it.type.toString())
                    if (it.key.keyCode == Key.Backspace.keyCode) {
                        if (value.isEmpty()) {
                            list.remove(item)
                        }
                    }
                    false
                },
                value = value,
                onValueChange = {value = it}
            )
        }
    }
}

Answer 2

如果自您上次尝试@Waqas Tahir 以来此问题已得到修复，请取消起诉，但我使用的是 ComposeUI v1.0.2，以下对我有用：

@OptIn(ExperimentalComposeUiApi::class)
@Composable
fun aTextFieldWithOnBackspacePressedAction() {
    // this should be hoisted to ViewModel
    var text by remember { mutableStateOf("") }

    BasicTextField(
        value = text,
        // this also should be hoisted to ViewModel
        onValueChange = { text = it },
        modifier = Modifier
            .onKeyEvent { event: KeyEvent ->
                // handle backspace key
                if (event.type == KeyEventType.KeyUp &&
                    event.key == Key.Backspace &&
                    text.isEmpty()
                // also any additional checks of the "list" i.e isNotEmpty()
                ) {
                    // TODO remove from list
                    return@onKeyEvent true
                }
                false
            }
    )
}

Answer 3

把false改成true就行了。它应该有效。

Jetpack Compose - 在文本字段中捕获关键事件

Jetpack Compose - Capture Key Event In Text Field

android

android-jetpack-compose

android-jetpack-compose-list