JetPack Compose disable BottomSheet outside touch

user_16682743 0
Viewed 2078

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?

android-jetpack android-jetpack-compose android
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() } }
user_20165620
Related