Hello How can I achive this behavior A card or smthing that kotlinlang #compose

Hello! How can I achive this behavior? A card (or smthing) that expand vertically without affecting the rest of layout. I tried with zIndex on the card but still moving the layout around

mgrazianodecastro

03/11/2023, 4:27 PM

i would bet the expanded card is actually in a box

alorma

03/11/2023, 4:30 PM

It even expands the rest of layout. I have those cards in a LazyVerticalGrid (two rows of three cards)

efemoney

03/11/2023, 4:41 PM

It's a popup menu. You can overlay a popup on the item itself and then it'll seem as of it's the item that is expanding

ephemient

03/11/2023, 4:44 PM

https://developer.android.com/reference/kotlin/androidx/compose/material/package-summary#dropdownmenu for example

alorma

03/11/2023, 4:45 PM

Those show a different window with content. Wait a moment i will be at laptop to show it

efemoney

03/11/2023, 4:45 PM

Yeah dropdown menu not popup menu (i dunno, anyone should work)

alorma

03/11/2023, 4:45 PM

What do you mean by overlay on the item itself?

ephemient

03/11/2023, 4:46 PM

instead of making the item itself grow, put a popup (with the same header) above it

the popup doesn't affect layout, and has other benefits like dismissing if the user touches outside of it

alorma

03/11/2023, 4:47 PM

Uhmm, could work

The idea is good, but how Can I make the popup march the card width?

ephemient

03/11/2023, 5:18 PM

var width by remember { mutableStateOf(0) }
Card(modifier = Modifier.onSizeChanged { width = it.width })
DropdownMenu(modifier = Modifier.sizeIn(minWidth = with(LocalDensity.current) { width.toDp() })

myanmarking

03/13/2023, 10:45 PM

Or just make a custom layout that ignores the height of that composable

6 Views

#compose Join Slack