Search code examples
androidkotlinandroid-jetpack-composeandroid-compose-dropdownmenu

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


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?


Solution

  • 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)
                }
            }
        }
    }