FloatingActionButton Lost in Jetpack Compose? A Material 3 Bottom Sheet Rescue Mission

The new material 3 library doesn’t have the BottomSheetScaffold that accepts a floatingActionButton . (The old one and the new one.)

Now what?

Photo by Sander Sammy on Unsplash

Why would we need that?

Now you know I’m in Eskisehir atm

You see how the floating action button goes up and down with the movement of the bottom sheet. It is a common pattern and looks pretty cool. We have to have it.

But How?

We want to be able to observe the state of the bottom sheet. Luckily I wrote another blogpost that explains that. We need something useful in the state of the bottom sheet and then… We’ll see.

I found a great function while trying to find something useful in the bottom sheet; requireOffset().

It is returning a Float which made me question what it actually represents. It represents pixels. Why is it not an Int then? Having smooth animations… Focus! This would be a topic for another post.

We need one more thing. The height of the floating action button or whatever we want to put on top of the bottom sheet…