Jetpack compose : BottomSheet state change callback

Question

How can i achieve callback/listener mechanism on JetPack Compose BottomSheet state changes?

Something similar to:

   @Override  
   public void onStateChanged(@NonNull View bottomSheet, int newState) {  
     if (newState == BottomSheetBehavior.STATE_COLLAPSED && mIsCollapsedFromBackPress){
        
     }
   }  

  @Override  
  public void onSlide(@NonNull View bottomSheet, float slideOffset) {  
  }  
});

As we used to do in Java/Kotlin.

Right now I am passing this as lambda to another composable from where the bottomsheet needs to be closed.

    val closeSheet: () -> Unit = {
        scope.launch {
            modalState.hide()
        }
    }

But i want to get the callback that the bottomsheet has been fully collapsed and I can continue my task.

Actual issue i am facing: I am converting a composable to bitmap on a button click. The button is inside the BottomSheet and the composable that needs to be converted is behind the BottomSheet. So, sometimes the bottomsheet also appears in the bitmap. I want to trigger the process only if the bottomsheet is fully collpased.

I found this answer on SO, but still the issue is about the callback. Not sure how to use it.

Answer 1

You can use snapshotFlow, refer to this. It Creates a Flow from observable Snapshot state. Here is a sample code

    // State change callback
    LaunchedEffect(sheetState) {
        snapshotFlow { sheetState.isVisible }.collect { isVisible ->
            if (isVisible) {
                // Sheet is visible
            } else {
                // Not visible
            }
        }
    }

You can use this snapshotFlow for other things too for example Pager page change callback

    // Page change callback
    LaunchedEffect(pagerState) {
        snapshotFlow { pagerState.currentPage }.collect { page ->
            when (page) {
                0 -> // First page
                1 -> // Second page
                else -> // Other pages
            }
        }
    }