Handle click event in the modalBottomsheet content in jetpack compose

Question

I Have a ModalBottomSheet and I want to change a boolean value after clicking on the bottom sheet transparent background. How can I access this view click listener?

I don't want to use BottomSheetScaffold.

fun ScheduleJobFromQueuedBottomSheet(
    viewModel: ProductViewModel,
    onClickCancel: () -> Unit,
    onQueuedScheduleRequestResultIsBack: () -> Unit,
) {
**var state by remember { mutableStateOf(false) }**

val bottomSheetState: ModalBottomSheetState =
        rememberModalBottomSheetState(ModalBottomSheetValue.Expanded, confirmStateChange = {
            it != ModalBottomSheetValue.HalfExpanded
        }, animationSpec = TweenSpec(durationMillis = 300, delay = 10))


    ModalBottomSheetLayout(
        sheetState = bottomSheetState,
        sheetShape = RoundedCornerShape(topStart = custom, topEnd = custom),
        scrimColor = ModalBottomSheetDefaults.scrimColor.copy(alpha = 0.40f),
        sheetContent = {
            ReviewBookingScheduledBottomSheet(modifier = Modifier
                .fillMaxWidth()
                .wrapContentHeight(),
                viewModel = viewModel,
                onClickCancel = {
                    onClickCancel.invoke()
                }, onScheduledRequestResultIsBack = {
                    onQueuedScheduleRequestResultIsBack.invoke()
                })
        }
    ) {

    }
}

I want to change the state value by clicking on the bottom sheet background (Not bottomsheet content)

Answer 1

Add one boolean mutableState variable and change this value when your bottom sheet state change

  var isBottomSheetDismissed = remember { mutableStateOf(false) } 

val bottomSheetState: ModalBottomSheetState =
    rememberModalBottomSheetState(ModalBottomSheetValue.Expanded, confirmStateChange = {

        isBottomSheetDismissed.value = it==ModalBottomSheetValue.Hidden
        it != ModalBottomSheetValue.HalfExpanded
      
    }, animationSpec = TweenSpec(durationMillis = 300, delay = 10))