Make bottomSheetDialog full screen over status bar

Question

I recently used android.support.design.widget.BottomSheetDialogFragment. I wanted to do something which is similar to the Google contact app, its BottomSheet can overlay the toolbar and statusbar. However, when I use the BottomSheetDialogFragment to implement this, it turns out to this:

As you can see the activity's toolbar is still visible. Here is my code of the BottomSheetDialogFragment:

public class KeyDetailFragment extends BottomSheetDialogFragment {
    private BottomSheetBehavior.BottomSheetCallback mBottomSheetBehaviorCallback = new BottomSheetBehavior.BottomSheetCallback() {
        @Override
        public void onStateChanged(@NonNull View bottomSheet, int newState) {
            if (newState == BottomSheetBehavior.STATE_HIDDEN) {
                dismiss();
            }
        }

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

        }
    };

    @Override
    public void setupDialog(Dialog dialog, int style) {
        super.setupDialog(dialog, style);
        View contentView = View.inflate(getActivity(), R.layout.sheet_key, null);
        dialog.setContentView(contentView);
        View parent = (View) contentView.getParent();
        parent.setFitsSystemWindows(true);
        BottomSheetBehavior bottomSheetBehavior = BottomSheetBehavior.from(parent);
        contentView.measure(0, 0);
bottomSheetBehavior.setPeekHeight(contentView.getMeasuredHeight());

        CoordinatorLayout.LayoutParams params = (CoordinatorLayout.LayoutParams) parent.getLayoutParams();
        if (params.getBehavior() instanceof BottomSheetBehavior) {
                 ((BottomSheetBehavior)params.getBehavior()).setBottomSheetCallback(mBottomSheetBehaviorCallback);
        }
        params.gravity = Gravity.TOP | Gravity.CENTER_HORIZONTAL;
        parent.setLayoutParams(params);
    }
}

I referred to the source and I found an attribute interests me:

private static int getThemeResId(Context context, int themeId) {
    if (themeId == 0) {
        // If the provided theme is 0, then retrieve the dialogTheme from our theme
        TypedValue outValue = new TypedValue();
        if (context.getTheme().resolveAttribute(
                R.attr.bottomSheetDialogTheme, outValue, true)) {
            themeId = outValue.resourceId;
        } else {
            // bottomSheetDialogTheme is not provided; we default to our light theme
            themeId = R.style.Theme_Design_Light_BottomSheetDialog;
        }
    }
    return themeId;
}

the attribute bottomSheetDialogTheme here may change the bottom sheet's style but I don't know how to change it, and I doubt whether this would work. Can someone give me solution about achieving it that it can overlay the toolbar and statusbar?

Answer 1

Try this. It works for me.

@Override
public void setupDialog(Dialog dialog, int style) {
    super.setupDialog(dialog, style);
    View inflatedView = View.inflate(getContext(), R.layout.fragment_coupon, null);
    dialog.setContentView(inflatedView);


    CoordinatorLayout.LayoutParams params = (CoordinatorLayout.LayoutParams) ((View) inflatedView.getParent()).getLayoutParams();
    CoordinatorLayout.Behavior behavior = params.getBehavior();

    if (behavior != null && behavior instanceof BottomSheetBehavior) {
        ((BottomSheetBehavior) behavior).setBottomSheetCallback(mBottomSheetBehaviorCallback);
    }

    View parent = (View) inflatedView.getParent();
    parent.setFitsSystemWindows(true);
    BottomSheetBehavior bottomSheetBehavior = BottomSheetBehavior.from(parent);
    inflatedView.measure(0, 0);
    DisplayMetrics displaymetrics = new DisplayMetrics();        getActivity().getWindowManager().getDefaultDisplay().getMetrics(displaymetrics);
    int screenHeight = displaymetrics.heightPixels;
    bottomSheetBehavior.setPeekHeight(screenHeight);

    if (params.getBehavior() instanceof BottomSheetBehavior) {
        ((BottomSheetBehavior)params.getBehavior()).setBottomSheetCallback(mBottomSheetBehaviorCallback);
    }

    params.height = screenHeight;
    parent.setLayoutParams(params);
}

Answer 2

Was not able to find the solution to this problem, but can suggest an alternate that helped me serve the same purpose. Here's the reference : http://www.hidroh.com/2016/06/17/bottom-sheet-everything/

The article explains creating a bottom sheet activity and adding the backdrop shadow with it.

Answer 3

This was easiest and worked for me, just extend BottomSheetDialog and set BottomSheetBehavior to BottomSheetBehavior.STATE_EXPANDED

Little hack is layout name android.support.design.R.id.design_bottom_sheet is taken from android support design library

class BottomSheetDialogExpanded(context: Context) : BottomSheetDialog(context) {

    private lateinit var mBehavior: BottomSheetBehavior<FrameLayout>

    override fun setContentView(view: View) {
        super.setContentView(view)
        val bottomSheet = window.decorView.findViewById<View>(android.support.design.R.id.design_bottom_sheet) as FrameLayout
        mBehavior = BottomSheetBehavior.from(bottomSheet)
        mBehavior.state = BottomSheetBehavior.STATE_EXPANDED
    }

    override fun onStart() {
        super.onStart()
        mBehavior.state = BottomSheetBehavior.STATE_EXPANDED
    }
}