Remove White Background in Bottom Sheet Dialog Fragment

Question

How to remove white background in bottom sheet dialog fragment?

I have tried the answer in this or set the background in the layout xml to transparent, but still get this result

Here is my code

public class BottomSheetFragment extends BottomSheetDialogFragment {

private Record record;

private MainFragment fragment;

public static BottomSheetFragment getInstance() {
    return new BottomSheetFragment ();
}

public BottomSheetFragment setRecord(Record record) {
    this.record = record;
    return this;
}

public BottomSheetFragment setFragment(MainFragment fragment) {
    this.fragment = fragment;
    return this;
}

@TargetApi(Build.VERSION_CODES.O)
@Override
public void onViewCreated(View view, @Nullable final Bundle savedInstanceState) {
    super.onViewCreated(view, savedInstanceState);

    getDialog().requestWindowFeature(Window.FEATURE_NO_TITLE);
    getDialog().getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT);
    setStyle(DialogFragment.STYLE_NO_FRAME, android.R.style.Theme);

    //Set content
}

@Nullable
@Override
public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
    return inflater.inflate(R.layout.layout_bottom_sheet, container);
}

@Override
public void onCreate(@Nullable Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
}
}

layout_bottom_sheet.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/cardView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginTop="60dp"
android:background="@drawable/bg_cardboard">

</FrameLayout>

Are you want to implement bottom sheet dialog or bottom sheet dialog fragment?, I have ready example of bottom sheet dialog. — Dhaval Solanki, Jul 31 '18 at 10:23

score 23 · Accepted Answer · answered Nov 18 '19 at 11:33

You will need to set transparent background to bottom sheet view itself.

Here is an example is Kotlin:

class YourBottomSheetFragment : BaseBottomSheetDialogFragment() {

    override fun onCreateDialog(savedInstanceState: Bundle?): Dialog {
        val dialog = super.onCreateDialog(savedInstanceState) as BottomSheetDialog
        dialog.setOnShowListener { setupBottomSheet(it) }
        return dialog
    }

    private fun setupBottomSheet(dialogInterface: DialogInterface) {
        val bottomSheetDialog = dialogInterface as BottomSheetDialog
        val bottomSheet = bottomSheetDialog.findViewById<View>(
            com.google.android.material.R.id.design_bottom_sheet)
            ?: return
        bottomSheet.setBackgroundColor(Color.TRANSPARENT)
    }
}

score 5 · Answer 2 · answered Jan 12 '21 at 16:54

you must be override "onCreateDialog" function for your bottom sheet dialog fragment, like this in kotlin:

        override fun onCreateDialog(savedInstanceState: Bundle?): Dialog {
        val dialog = super.onCreateDialog(savedInstanceState)

        dialog.setOnShowListener {
            //this line transparent your dialog background
            (view?.parent as ViewGroup).background = 
            ColorDrawable(Color.TRANSPARENT)
        }

        return dialog
       }

Sandeep Parish · Answer 3 · 2018-12-10T05:35:55.887

Use this theme to change background color for your dialog

<style name="MyDialog" parent="@android:style/Theme.Dialog">
        <item name="android:windowFrame">@null</item>
        <item name="android:windowBackground">Your custom color here</item>
        <item name="android:windowIsFloating">false</item>
        <item name="android:windowContentOverlay">@null</item>
        <item name="android:windowTitleStyle">@null</item>
        <item name="android:colorBackgroundCacheHint">@null</item>
        <item name="android:windowAnimationStyle">@android:style/Animation.Dialog</item>
        <item name="android:windowSoftInputMode">stateUnspecified|adjustPan</item>
        <item name="android:gravity">center</item>
    </style>

and your onViewCreated should be like or only add setStyle(DialogFragment.STYLE_NO_TITLE, R.style.MyDialog);

@Override
public void onViewCreated(View view, @Nullable final Bundle savedInstanceState) {
    super.onViewCreated(view, savedInstanceState);

    getDialog().requestWindowFeature(Window.FEATURE_NO_TITLE);
    getDialog().getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT);
  setStyle(DialogFragment.STYLE_NO_TITLE, R.style.MyDialog);

    //Set content
}

score 0 · Answer 4 · answered Aug 21 '19 at 23:39

0

For me it worked to make the background transparent programmatically:

((View) viewBotaoSheet.getParent()).setBackgroundColor(getResources().getColor(android.R.color.transparent))

answered Aug 21 '19 at 23:39

JuniorObom

9
2

score 0 · Answer 5 · edited Oct 12 '20 at 11:39

0

@Override
public void onActivityCreated(@Nullable Bundle savedInstanceState) {
    super.onActivityCreated(savedInstanceState);
    ((View) getView().getParent()).setBackgroundColor(Color.TRANSPARENT);
}

edited Oct 12 '20 at 11:39

NearHuscarl

66,950
18
261
230

answered Oct 12 '20 at 10:06

Ravi Savaliya

11
3

Works great, thanks. Do you know how one removes the background all together allowing click/press on the behind components? – Caio Mar Mar 03 '23 at 21:03

Remove White Background in Bottom Sheet Dialog Fragment

5 Answers5

Linked