Where is the `toggle` and `toggleModifier` of Jetpact Compose `DropdownMenu`

295 views Asked by At

In Jetpact Compose 1.0.0-alpha11, the below is valid code

DropdownMenu(
    toggle = {
        Text(
            text = selected.value.toString(),
            modifier = Modifier.clickable(onClick = { showMenu = true }),
            fontSize = 16.sp
        )
    },
    expanded = showMenu,
    onDismissRequest = { showMenu = false },
    toggleModifier = Modifier.background(Color.LightGray)
) {
    items.forEachIndexed { index, s ->
        DropdownMenuItem(
            onClick = {
                selected.value = items[index]
                showMenu = false
            }
        ) {
            Text(text = s.toString())
        }
    }
}

However, after migrated to Jetpact Compose 1.0.0-beta07, the toggle and toggleModifier is no longer supported.

What's the new way of using DropdownMenu?

1

There are 1 answers

0
Gabriele Mariotti On BEST ANSWER

The toggle and toggleModifier parameters were removed from DropdownMenu with 1.0.0-alpha12. They were not replaced.

You have to do something different like:

var expanded by remember { mutableStateOf(false) }
val suggestions = listOf("Item1", "Item2", "Item3")
var selectedText by remember { mutableStateOf("Item1") }

Box(
    //toggleModifier
    Modifier.background(Color.LightGray)
){ 
    //toggle 
    Text(
        text = selectedText,
        modifier = Modifier.clickable(onClick = { expanded = true }),
        fontSize = 16.sp
    )

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

    ) {
        suggestions.forEach { label ->
            DropdownMenuItem(onClick = {
                selectedText = label
            }) {
                Text(text = label)
            }
        }
    }
}