Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

JetPack Compose disable BottomSheet outside touch

I am using Accompanist's BottomSheetNavigator to display a BottomSheet in a Compose Application. The requirement is to disable the touch event outside the Bottom Sheet & only perform action on a Button click event. There are no methods like setCancelable(false) or setCanceledOnTouchOutside(false) used in non-Compose applications.

Eg. In this image, action should only be taken if user clicks on "Apply Now" button, no action should take place if users clicks on device back button or if user touches outside the Bottomsheet. Is there any way I can achieve the said functionality?

like image 317
Firebase Manager Avatar asked Mar 20 '26 11:03

Firebase Manager


1 Answers

Using a ModalBottomSheetLayout you can specify the sheetState parameter.
In the ModalBottomSheetState there is the parameter confirmStateChange.

Optional callback invoked to confirm or veto a pending state change.

You can use something like:

val state = rememberModalBottomSheetState(
    initialValue= ModalBottomSheetValue.Hidden, 
    confirmStateChange = {false})

In this way you can touch outside the Bottomsheet without closing it.
In your Apply Now button just use:

onClick = { scope.launch { state.hide() } }
like image 52
Gabriele Mariotti Avatar answered Mar 22 '26 01:03

Gabriele Mariotti



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!