Jetpack Compose Bottom Sheet 暗淡阴影不可见

Question

I've created a bottom sheet in jetpack compose. But when the bottom sheet is expanding, the bottom sheet outside the background does not dim as usual bottom sheets do. Please help.

MyApplicationTestTheme {
    ProvideWindowInsets {
        BottomSheetScaffold(
            scaffoldState = bottomSheetScaffoldState,
            sheetShape = RoundedCornerShape(topStart = 30.dp,topEnd = 30.dp),
            sheetElevation= 5.dp,
            modifier=Modifier.fillMaxHeight(0.95f).fillMaxWidth(),
            sheetBackgroundColor=Color.Green,
            sheetContent = {
                //Bottom sheet content
            }, sheetPeekHeight = 0.dp
        ) {
         // Page Content
        }
   }
}

Answer 1

Bottom sheet does not have a default dim feature.

You can use ModalBottomSheetLayout , or BottomDrawer to have that effect. But neither these layout have peek height, only expand states.

    ModalBottomSheetLayout(
        sheetState = modalBottomSheetState,
        sheetElevation = 8.dp,
        sheetContent = {
            SheetContent()
        }
    ) {
        MainContent(modalBottomSheetState)
    }

Or

    val drawerState = rememberBottomDrawerState(BottomDrawerValue.Closed)

    BottomDrawer(
        gesturesEnabled = gesturesEnabled,
        drawerState = drawerState,
        drawerContent = {

        },
        content = {
   
        }
    )