点击时不会调用列可点击的 lambda 块 - Jetpack 撰写

Question

Column(
    Modifier
        .padding(0.dp).clickable {
            expanded = !expanded
        }) {
    OutlinedTextField(
        value = selectedText,
        readOnly = true,
        onValueChange = {
            selectedText = it
            onItemSelected(selectedText)
        },
        modifier = Modifier
            .fillMaxWidth()
            .onGloballyPositioned { coordinates ->
                //This value is used to assign to the DropDown the same width
                textfieldSize = coordinates.size.toSize()
            },
        colors = TextFieldDefaults.textFieldColors(
            focusedIndicatorColor = pearl,
            unfocusedIndicatorColor = ash,
            backgroundColor = white
        ),
        trailingIcon = {
            Icon(icon, "contentDescription",
                Modifier.clickable { expanded = !expanded })
        },
        shape = RoundedCornerShape(12.dp),
        placeholder = {
            Text(text = hint)
        }, maxLines = 1, singleLine = true

    )
 DropdownMenu(
  expanded = expanded,
    ...
 )

我在 Jetpack Compose 中有一个下拉菜单，我需要在单击该列时显示下拉菜单，但是该列的可单击 lambda 块不会在点击时被调用。可能是什么问题？

Answer 1

OutlinedTextField“窃取”了点击事件。您可以使用 interactionSource 来处理该 TextField 的事件，而不是使用点击事件。

在要捕获事件并将其传递给 OutlinedTextField 的代码中声明 interactionSource。

var expanded by remember { mutableStateOf(false) }
val interactionSource = remember { MutableInteractionSource() }
val isPressed: Boolean by interactionSource.collectIsPressedAsState()

if (isPressed) {
    expanded = true
}

Column(
    Modifier
        .padding(0.dp)) {
    OutlinedTextField(
        value = selectedText,
        interactionSource = interactionSource,
        readOnly = true,
        onValueChange = {
            selectedText = it
            onItemSelected(selectedText)
        },
        modifier = Modifier
            .fillMaxWidth()
            .onGloballyPositioned { coordinates ->
                //This value is used to assign to the DropDown the same width
                textfieldSize = coordinates.size.toSize()
            },
        colors = TextFieldDefaults.textFieldColors(
            focusedIndicatorColor = pearl,
            unfocusedIndicatorColor = ash,
            backgroundColor = white
        ),
        trailingIcon = {
            Icon(icon, "contentDescription",
                Modifier.clickable { expanded = !expanded })
        },
        shape = RoundedCornerShape(12.dp),
        placeholder = {
            Text(text = hint)
        }, maxLines = 1, singleLine = true

    )
 DropdownMenu(
  expanded = expanded,
  onDismissRequest = { expanded = false }
    ...
 )

点击时不会调用列可点击的 lambda 块 - Jetpack 撰写

column clickable lambda block is not invoked on tap - jetpack compose

android

kotlin

android-layout

android-jetpack-compose

android-jetpack