Search code examples
androidmaterial-designandroid-alertdialog

MaterialAlertDialog Transparent Background


I use the material design component for alert dialog, I want a transparent black background color, but there is something strange in the backgound, there is a little white color, how to solve this problem. please the solution.

enter image description here

This style.xml

<resources>
<!-- Base application theme. -->
<style name="AppTheme" parent="Theme.MaterialComponents.Light.NoActionBar">
    <!-- Customize your theme here. -->
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
</style>


<style name="AlertDialogTheme" parent="ThemeOverlay.MaterialComponents.MaterialAlertDialog">
    <item name="colorSurface">#C1121212</item>
    <item name="elevation">0dp</item>
    <item name="materialAlertDialogTitleTextStyle">@style/TitleTextStyle</item>
    <item name="materialAlertDialogBodyTextStyle">@style/BodyTextStyle</item>
    <item name="buttonBarPositiveButtonStyle">@style/PositiveButtonStyle</item>
    <item name="buttonBarNegativeButtonStyle">@style/NegativeButtonStyle</item>
    <item name="shapeAppearanceOverlay">@style/ShapeAppearanceOverlay.MyApp.Dialog.Rounded</item>
</style>
<style name="TitleTextStyle" parent="MaterialAlertDialog.MaterialComponents.Title.Text">
    <item name="android:textColor">#fafafa</item>
    <item name="android:textStyle">bold</item>
    <item name="android:textSize">20sp</item>
</style>
<style name="BodyTextStyle" parent="MaterialAlertDialog.MaterialComponents.Body.Text">
    <item name="android:textColor">#c7c7c7</item>
    <item name="android:textSize">14sp</item>
</style>
<style name="PositiveButtonStyle" parent="Widget.MaterialComponents.Button.TextButton.Dialog">
    <item name="android:textColor">#d81b60</item>
    <item name="rippleColor">#ad1457</item>
</style>
<style name="NegativeButtonStyle" parent="Widget.MaterialComponents.Button.TextButton.Dialog">
    <item name="android:textColor">#757575</item>
    <item name="rippleColor">#a4a4a4</item>
</style>
<style name="ShapeAppearanceOverlay.MyApp.Dialog.Rounded" parent="">
    <item name="cornerFamily">rounded</item>
    <item name="cornerSize">14dp</item>
</style>

this Activity

binding.snack.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {


            Objects.requireNonNull(new MaterialAlertDialogBuilder(RegisterActivity.this, R.style.AlertDialogTheme)
                    .setTitle("Dialog")
                    .setMessage("Lorem ipsum dolor ....")
                    .setPositiveButton("OK", null)
                    .setCancelable(true)
                    .show());

        }
    });

Solution

  • Try setting the background with your colorSurface as a ColorDrawable:

    setBackground(ColorDrawable(Color.parseColor("#C1121212")))
    

    So it will look like this:

    new MaterialAlertDialogBuilder(RegisterActivity.this, R.style.AlertDialogTheme)
            .setTitle("Dialog")
            .setMessage("Lorem ipsum dolor ....")
            .setPositiveButton("OK", null)
            .setCancelable(true)
            .setBackground(ColorDrawable(Color.parseColor("#C1121212")))
            .show();