[BottomSheetDialog] android:colorBackground stopped working with version 1.2.0

[svenjacobs]

Description:

Starting with version 1.2.0 the android:colorBackground attribute is ignored and the bottom sheet dialog always has a white background set.

Expected behavior:

android:colorBackground should set the background color of the sheet as with version 1.1.0.

Source code:

<style name="ShoppingList.BottomSheetDialog" parent="Theme.MaterialComponents.Light.BottomSheetDialog">
    <item name="android:colorBackground">@android:color/transparent</item> <!-- has no effect -->
    <item name="android:backgroundDimAmount">0.3</item>
</style>

Android API version: 29

Material Library version: 1.2.0

Device: Google Pixel

[leticiarossi]

Using app:backgroundTint should let you change the background color as expected. Does that work for you?

[svenjacobs]

Using app:backgroundTint should let you change the background color as expected. Does that work for you?

Unfortunately this does not work :( I applied it to the style like this

<style name="ShoppingList.BottomSheetDialog" parent="Theme.MaterialComponents.Light.BottomSheetDialog">
    <item name="backgroundTint">@android:color/transparent</item>
    <item name="android:backgroundDimAmount">0.3</item>
</style>

The sheet is instantiated in code

val dialog = BottomSheetDialog(
    context,
    R.style.ShoppingList_BottomSheetDialog
)

[gabrielemariotti]

You can use something like:

val dialog = BottomSheetDialog(
    context,
    R.style.ThemeOverlay_App_BottomSheetDialog
)

with:

    <style name="ThemeOverlay.App.BottomSheetDialog" parent="@style/ThemeOverlay.MaterialComponents.BottomSheetDialog">
        <item name="bottomSheetStyle">@style/ShoppingList.BottomSheetDialog</item>
    </style>

    <style name="ShoppingList.BottomSheetDialog" parent="Widget.MaterialComponents.BottomSheet.Modal">
        <item name="backgroundTint">@color/....</item>
    </style>

[svenjacobs]

@gabrielemariotti Tried your solution but unfortunately it doesn't produce the desired results. Now the BottomSheet's background is transparent, however it still produces a drop shadow around its invisible edges.

With version 1.1.0 it was very easy to have a fully transparent BottomSheet, where a custom background could be defined by the containing layout. Now it seems to be very complicated or impossible?

[svenjacobs]

I was finally able to fix this by also applying an elevation to the style, which removes the unwanted drop shadow

<style name="ShoppingList.BottomSheetDialog" parent="Widget.MaterialComponents.BottomSheet.Modal">
    <item name="backgroundTint">@color/....</item>
    <item name="android:elevation">0dp</item>
    <item name="elevation">0dp</item>
</style>

Thank you 😃

[Slion]

Was having issues controlling the status bar color when using edge-to-edge bottom sheets. In the end both backgroundTint and android:elevation where needed. I will soon push those changes there: https://github.com/Slion/Fulguris/blob/main/app/src/main/res/values/styles.xml