BottomSheetDialogFragment with bottom sticky button

Question

I have some trouble displaying a button in my BottomSheetDialogFragment. I want it to stick to the bottom of my bottom sheet, no matter if the sheet is expanded or collapsed.

See the picture below :

(I used sketch to create this)

Any tips or tricks ?

And just in case, if you know how to add top margin to the bottomsheetdialog, I'd love to know this too ;)

Answer 1

Thanks, @Gnocalo, post. I have implemented it and please find it in my github

Steps:

• find the parent view BottomSheetDialogFragment
• inflate your custom view and attached it to the parent view
• adjust the margin of the bottom sheet to avoid view overlay

Answer 2

the way I tackled this issue was the following:

1. Implement BottomSheetDialogFragment
2. override onCreateDialog
3. get reference for bottomSheetDialog and set a onShowListener
4. Remove button from my layout and add it to R.id.container (of course you can create your own button programatically, I've done it this to be easier to format the button view). This way your button will be over the R.id.design.bottom.sheet since R.id.container is it's parent!

Example code following:

    val bottomSheetDialog = super.onCreateDialog(savedInstanceState) as BottomSheetDialog
    bottomSheetDialog.setOnShowListener {
        val dialog = it as BottomSheetDialog

            dialog.findViewById<FrameLayout>(com.google.android.material.R.id.design_bottom_sheet) as FrameLayout
        val containerLayout: FrameLayout =
            dialog.findViewById<FrameLayout>(com.google.android.material.R.id.container) as FrameLayout
        val button = binding.submitButton
        val parent = button.parent as ViewGroup
        parent.removeView(button)
        containerLayout.addView(button, containerLayout.childCount)
    }
    return bottomSheetDialog

This way your bottom sheet will respond to touches normally and the button will stay on it's position on the parent.

If you have any doubt feel free to ask.

EDIT

Don't forget to define layout params/positioning the button for it to be on the bottom of R.id.container