DropDownMenu frame drops and lags in Jetpack Compose

Viewed 276

So I am bit of in a pickle now.

The Begining

I have list of countries and I want to allow the user to pick any of them by showing a drop a down menu, and earlier no jetpack compose way, I had a an extension on View say View.setupDropDown and this inturn loads up a ListPopupWindow and anchors it to the current view, and shows all the items and works perfectly fine without jank or any frame drop.

like

val dropDown = ListPopupWindow(context)
    dropDown.setAdapter(
        ArrayAdapter(
            context,
            android.R.layout.simple_spinner_dropdown_item,
            list.map { itemFormatter(it) })
    )

and show it, or I can use a custom

The Pickle

So now I am building the same experience in Jetpack Compose, and Using DropDownMenu and it loads up all those items in a Column which works fine when Items are less in number, but, when it comes to large number of items like, a list which has more then 100 items, it drops a few frames, and shows the PopUp after a delay.

I looked up insides and tried to replace the Column with LazyColumn by copying in all those files to a sample project but that doest work as Intrinsic measurements is not yet supported for the Subcomposables and it throws and exception and fails.

 DropdownMenu(
        toggle = toggle,
        expanded = showMenu,
        onDismissRequest = { onDismiss() },
    ) {
        options.forEach{ item ->
            DropdownMenuItem(onClick = {
                onDismiss()
            }) {
                Text(text = item)
            }
        }
    }

It works perfectly fine If I apply fixed height and width to the LazyColumn, using the modifier Modifier.height(200.dp).widht(300.dp)

I looked up in issue tracker, and found this issue which was relevant but not same, and the suggestion was to do what I did above.

Not sure what to use in here, as Compose is still new, don't know which component fits the bill.

0 Answers
Related