How can I make the corners of my bottom sheet dialog rounded?

Question

I'm trying to make the top corners of my BottomSheetDialog rounded, but I haven't had any luck with anything online. This is what I would like for it to look like:

No matter what I've tried, I keep getting this:

I've tried the method here and using shapeAppearanceLargeComponent (what I'm using now).

Here is my code:

styles.xml

 <style name="AppTheme" parent="Theme.MaterialComponents.Light.DarkActionBar">
    <!-- Customize your theme here. -->
    ...
    <item name="shapeAppearanceLargeComponent">@style/CustomShapeAppearanceBottomSheetDialog</item>
</style>

<style name="CustomShapeAppearanceBottomSheetDialog" parent="">
    <item name="cornerFamily">rounded</item>
    <item name="cornerSizeTopRight">16dp</item>
    <item name="cornerSizeTopLeft">16dp</item>
</style>

BottomNavMenuFragment:

public class BottomNavMenuFragment extends BottomSheetDialogFragment {
    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        return inflater.inflate(R.layout.fragment_bottom_nav_drawer, container, false);
    }
}

And this is how I'm showing the fragment:

BottomNavMenuFragment navFragment = new BottomNavMenuFragment();
navFragment.show(getSupportFragmentManager(), navFragment.getTag());

Nothing I seem to do works. Could someone point me in the right direction?

Answer 1

Follow the below steps to attain top rounded corner bottomsheet:

Step 1: Create drawable rounded_top_corners.xml file inside drawable folder

<?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="8dp"
        android:topRightRadius="8dp"/>
</shape>

Step 2: Create below styles in styles.xml

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

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

Step 3: Add style in BottomNavMenuFragment class

 @Override
    public void onCreate(@Nullable Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setStyle(STYLE_NORMAL, R.style.BottomSheetDialogStyle);
    }

That's it, the style will be applied to bottomsheet.