https://kotlinlang.org logo
#compose-android
Title
# compose-android
h

Hristijan

10/10/2023, 10:23 AM
hey guys, does anyone know why
ModalBottomSheet
can’t be previewed?
s

Serge

10/10/2023, 10:58 AM
You didn't provide a state for it, could that be the problem?
h

Hristijan

10/10/2023, 11:13 AM
it has a default state
Copy code
sheetState: SheetState = rememberModalBottomSheetState(),
Copy code
@Preview(showBackground = true)
@Composable
fun ModalSheetPreview() {
    val sheetState = rememberModalBottomSheetState()
    LaunchedEffect(sheetState.currentValue) {
        if (!sheetState.isVisible) {
            sheetState.show()
        }
    }
    ModalBottomSheet(
        onDismissRequest = {},
        sheetState = sheetState
    ) {
        Row(Modifier.fillMaxWidth(), horizontalArrangement = Arrangement.Center) {
            Button(
                onClick = {}
            ) {
                Text("Close Bottom Sheet")
            }

            Button(
                onClick = {}
            ) {
                Text("Collapse Bottom Sheet")
            }
        }
        LazyColumn {
            items(50) {
                ListItem(
                    headlineContent = { Text("Item $it") },
                    leadingContent = {
                        Icon(
                            Icons.Default.Favorite,
                            contentDescription = "Localized description"
                        )
                    }
                )
            }
        }
    }
}
I’ve even tried this, it doesn’t work.
z

Zach Klippenstein (he/him) [MOD]

10/10/2023, 12:33 PM
I think it uses a new window? If it does that, previews don’t support windows. You should be able to preview the contents of your sheet if you pull those into a separate composable
h

Hristijan

10/10/2023, 12:56 PM
That's the workaround I'm using right now
Is there another one that would seem a bit more scalable, for examplw we have some small modal sheets that doesn't make sense to extract the screen content
3 Views