CODEWITHSUNDEEP
androiddrop-down-menuandroid-jetpack-composeandroid-jetpack-compose-material3android-compose-dropdownmenu
Dr Mido
Dr Mido

Reputation: 2704

How to add custom item inside DropDownMenuItem in this new version

in this app I have the following custom composable item

@Composable
fun PriorityItem(priority: Priority) {
    Row(verticalAlignment = Alignment.CenterVertically) {
        Canvas(modifier = Modifier.size(PRIORITY_INDICATOR_SIZE)) {
            drawCircle(color = priority.color)
        }
        Text(
            modifier = Modifier.padding(start = LARGE_PADDING), text = priority.name,
            style = Typography.headlineMedium,
            color = MaterialTheme.colorScheme.onSurface
        )
    }
}

I am trying to add it inside DropDownMenu repeated 3 times as three drop-down menu items, but in this version, the DropDownMenuItem doesn't have a row scope to which I can add my custom item PriorityItem


@Composable
fun SortAction(onSortClicked: (Priority) -> Unit) {

    var expanded by remember() {
        mutableStateOf(false)
    }

    IconButton(onClick = {expanded = true}) {
        Icon(
            painter = painterResource(id = R.drawable.baseline_filter_list_24),
            contentDescription = stringResource(R.string.sort_tasks)
        )

        DropdownMenu(expanded = expanded, onDismissRequest = { expanded = false}) {
            DropdownMenuItem(text = { /*TODO*/ },
                onClick = { /*TODO*/ }){
                
            }
        }
    }
}

the following image is exactly what I want to do but the tutorial is old

enter image description here

Upvotes: 1

Views: 255

Answers (1)

BigBeast DGX
BigBeast DGX

Reputation: 45

hay there did you found anything about how to do it ? i've paid some money for this course :)

i figured you just moved on after 2 months but to anyone who hasn't you must do this

text = { PriorityItem(priority = Priority.LOW)  }

just pass whatever you want to show inside the text parameter

if you wanna show text make sure you use the "Text" Compose function otherwise it wont show like use

(text = { Text("your string") }, onClick = { expended = false })

i hope someone find this useful :)

Upvotes: 4

Related Questions