Android compose ModalBottomSheetLayout causes enormous recomposition counts

Question

I'm working with compose now for several weeks and some things are still quite challenging or weird I think.

My newest feature requires a BottomSheet, a ModalBottomSheet to be precise.

When inspecting via the Layout Inspector it shows me, that the ModalBottomSheet sheetcontent, that is a surface, produces enormous recomposition counts. (I'm talking about hundres per second):

I even tried emptying the whole ModalBottomSheet so it's only an empty shell like this:

val sheetState = rememberModalBottomSheetState(
    initialValue = ModalBottomSheetValue.Hidden,
    confirmStateChange = { it != ModalBottomSheetValue.HalfExpanded },
    skipHalfExpanded = true,
)

ModalBottomSheetLayout(
    sheetState = sheetState,
    sheetShape = CustomTheme.shapes.bottomSheetRadius,
    sheetContent = {
        Column(modifier = Modifier.padding(bottom = 10.sdp)) { 

        }
    }
) {

}

Someone experienced the same? I can not find anyone complaining about this.. But this can not be okay I think.

Show the entire @Composable function as its this function that's getting recomposed. — Chris, Aug 15 '23 at 15:07
How do you trigger recomposition? This code alone should not trigger recomposition — Thracian, Aug 18 '23 at 06:17

score 1 · Answer 1 · answered Aug 22 '23 at 13:27

The recomposition count comes from the animation of modal bottom sheet. You can see these exact recomposition count in any animation api.

It is not really a problem unless you put the entire UI component in sheetContent directly. You have to create a separate composable with only stable parameters to avoid any kind of real problem. Hope this helps.

Android compose ModalBottomSheetLayout causes enormous recomposition counts

1 Answers1