Round corner for BottomSheetDialogFragment

android, bottom-sheet, material-components, material-components-android, material-design

Solution

Create a custom drawable `rounded_dialog.xml`:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <solid android:color="@android:color/white"/>
    <corners android:topLeftRadius="16dp"
        android:topRightRadius="16dp"/>

</shape>

Then override `bottomSheetDialogTheme` on `styles.xml` using the drawable as background:

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">       
    <item name="bottomSheetDialogTheme">@style/AppBottomSheetDialogTheme</item>
</style>

<style name="AppBottomSheetDialogTheme"
    parent="Theme.Design.Light.BottomSheetDialog">
    <item name="bottomSheetStyle">@style/AppModalStyle</item>
</style>

<style name="AppModalStyle"
    parent="Widget.Design.BottomSheet.Modal">
    <item name="android:background">@drawable/rounded_dialog</item>
</style>

This will change all the BottomSheetDialogs of your app.

Problem

I have a custom BttomSheetDialogFragment and I want to have round corners in top of Bottom View This is my Custom class that inflates my layout that I want to appear from bottom ``` View mView; @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { mView = inflater.inflate(R.layout.charge_layout, container, false); initChargeLayoutViews(); return mView; } ``` and also I have this XML resource file as background: ``` <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" > <corners android:topRightRadius="35dp" android:topLeftRadius="35dp" /> <solid android:color="@color/white"/> <padding android:top="10dp" android:bottom="10dp" android:right="16dp" android:left="16dp"/> </shape> ``` The problem is, when I set this resource file as background of my Layout's root element, the corners still are not rounded. I can't use below code: ``` this.getDialog().getWindow().setBackgroundDrawableResource(R.drawable.charge_layout_background); ``` Because it overrides the default background of BottomSheetDialog and there won't be any semi-transparent gray color above my Bottom View.

Original source

Related problems