Change the background color of a pop-up dialog

Question

I wrote android code that shows a pop-up dialog but I want to change the background color from black to white , and then the color of the writing.

This is the dialog's code:

mPrefs = PreferenceManager.getDefaultSharedPreferences(this);

    Boolean welcomeScreenShown = mPrefs.getBoolean(welcomeScreenShownPref, false);

    if (!welcomeScreenShown) {


        String whatsNewText = getResources().getString(R.string.Text);
        new AlertDialog.Builder(this).setMessage(whatsNewText).setPositiveButton(
                R.string.ok, new DialogInterface.OnClickListener(){
            public void onClick(DialogInterface dialog, int which) {
                dialog.dismiss();
            }
        }).show();
        SharedPreferences.Editor editor = mPrefs.edit();
        editor.putBoolean(welcomeScreenShownPref, true);
        editor.commit(); // Very important to save the preference
    }

score 127 · Answer 1 · edited Apr 02 '20 at 06:04

127

To expand on @DaneWhite's answer, you don't have to rely on the built-in themes. You can easily supply your own style:

<style name="MyDialogTheme" parent="Theme.AppCompat.Light.Dialog.Alert">
    <item name="android:background">@color/myColor</item>
</style>

and then apply it in the Builder constructor:

Java:

AlertDialog alertDialog = new AlertDialog.Builder(getContext(), R.style.MyDialogTheme)
        ...
        .create();

Kotlin:

var alertDialog = AlertDialog.Builder(context, R.style.MyDialogTheme)
        ...
        .create()

This should work whether you are using android.support.v7.app.AlertDialog or android.app.AlertDialog

This also works better than @DummyData's answer because you don't resize the dialog. If you set window's background drawable you overwrite some existing dimensional information and get a dialog that is not standard width.

If you set background on theme and the set the theme on dialog you'll end up with a dialog that is colored how you want but still the correct width.

edited Apr 02 '20 at 06:04

ChrisMcJava

2,145
5
25
33

answered May 24 '16 at 20:09

tir38

9,810
10
64
107

2

How can I change text and buttons colors? – Pierry Mar 13 '18 at 14:25
3

You should use the `android:windowBackground` theme attribute instead. `android:background` will change the background color of every `View`. – BladeCoder Oct 23 '18 at 08:16
3

Actually, both `background` and `windowBackground` remove rounded corners from the dialog window. If you want to set a color, you should use `colorBackground` attribute instead. – Nikolai Mar 04 '19 at 17:03
This solution additionally change text color to more darker in the dialog – Vitaly Aug 16 '21 at 08:13
if using MaterialComponents, I found the only thing that worked without removing rounded corners was to set`android:backgroundTint` – lecker909 Jan 25 '22 at 16:27

score 65 · Accepted Answer · answered Aug 21 '13 at 03:41

65

If you just want a light theme and aren't particular about the specific color, then you can pass a theme id to the AlertDialog.Builder constructor.

AlertDialog.Builder(this, AlertDialog.THEME_HOLO_LIGHT)...

or

AlertDialog.Builder(this, AlertDialog.THEME_DEVICE_DEFAULT_LIGHT)...

answered Aug 21 '13 at 03:41

Dane White

3,443
18
16

8

it says deprecated now? Any suggestions to do so now? – Dinesh Oct 01 '15 at 18:10
5

@Dinesh If you are using Android Studio, it will directly tell you the replacement: *Deprecated Use android.R.style.Theme_Material_Light_Dialog_Alert* – tir38 May 24 '16 at 19:59

score 51 · Answer 3 · edited May 23 '17 at 12:18

51

Credit goes to Sushil

Create your AlertDialog as usual:

AlertDialog.Builder dialog = new AlertDialog.Builder(getContext());
Dialog dialog = dialog.create();
dialog.show();

After calling show() on your dialog, set the background color like this:

dialog.getWindow().setBackgroundDrawableResource(android.R.color.background_dark);

edited May 23 '17 at 12:18

Community

1
1

answered Apr 02 '16 at 16:09

DummyData

645
9
14

5

Be careful. While this will set the background color, you will replace the previous background drawable, which contained width dimension. Your resulting dialog may be different size than if you didn't update background drawable. – tir38 May 24 '16 at 19:51
I wish we could do it via theme resource using some style attr. I think there must be this possibility to set not color, but any other drawable background resource. – Cícero Moura Sep 15 '18 at 16:06

Maksim Ivanov · Answer 4 · 2020-04-20T08:03:43.407

32

To change the background color of all dialogs and pop-ups in your app, use colorBackgroundFloating attribute.

<style name="MyApplicationTheme" parent="@style/Theme.AppCompat.NoActionBar">
...
<item name="colorBackgroundFloating">
    @color/background</item>
<item name="android:colorBackgroundFloating" tools:targetApi="23">
    @color/background</item>
...
</style>

Documentation:

colorBackgroundFloating

edited Apr 20 '20 at 08:03

answered Apr 15 '19 at 08:54

Maksim Ivanov

3,991
31
25

Gabriele Mariotti · Answer 5 · 2021-04-19T15:22:33.220

With the Material Components Library you can just use the default MaterialAlertDialogBuilder:

    new MaterialAlertDialogBuilder(AlertDialogActivity.this,
        R.style.ThemeOverlay_MaterialComponents_MaterialAlertDialog_Background)
        .setTitle("Dialog")
        .setMessage("Message...  ....")
        .setPositiveButton("Ok", /* listener = */ null)
        .show();

where the theme overlay ThemeOverlay_MaterialComponents_MaterialAlertDialog_Background is:

  <!-- Alert Dialog -->
  <style name="ThemeOverlay.MaterialComponents.MaterialAlertDialog_Background" parent="@style/ThemeOverlay.MaterialComponents.MaterialAlertDialog">
    <!-- Background Color-->
    <item name="android:background">@color/.....</item>
    <!-- Text Color for title and message -->
    <item name="colorOnSurface">@color/......</item>
    <!-- Style for positive button -->
    <item name="buttonBarPositiveButtonStyle">@style/PositiveButtonStyle</item>
    <!-- Style for negative button -->
    <item name="buttonBarNegativeButtonStyle">@style/NegativeButtonStyle</item>
  </style>

  <style name="PositiveButtonStyle" parent="@style/Widget.MaterialComponents.Button">
    <!-- text color for the button -->
    <item name="android:textColor">@color/.....</item>
    <!-- Background tint for the button -->
    <item name="backgroundTint">@color/primaryDarkColor</item>
  </style>

I was looking at the https://material.io/components/dialogs/android#full-screen-dialog where the container color element has no attribute. I was trying to edit the colorSurface property but was getting nothing. Thanks for your answer. — Shivam Pokhriyal, Apr 19 '21 at 15:25

score 15 · Answer 6 · answered Feb 22 '17 at 00:23

15

For any dialog called myDialog, after calling myDialog.show(); you can call:

myDialog.getWindow().getDecorView().getBackground().setColorFilter(new LightingColorFilter(0xFF000000, CUSTOM_COLOR));

where CUSTOM_COLOR is in 8-digit hex format, ex. 0xFF303030. Here, FF is the alpha value and the rest is the color value in hex.

answered Feb 22 '17 at 00:23

kiko283

490
6
15

2

+1, much better solution than using `setBackgroundDrawableResource` as you don't have to worry about the size or shape components. You can also use `... .setColorFilter(int color, Mode mode)`, where `color` would be the color code int you can get from the likes of `getColor(int resId)`, and for `mode` you can use `Mode.SRC` to override the previous color entirely. – VerumCH Aug 17 '18 at 10:05

Sushil · Answer 7 · 2014-11-13T08:31:18.090

3

You can create a custom alertDialog and use a xml layout. in the layout, you can set the background color and textcolor.

Something like this:

Dialog dialog = new Dialog(this, android.R.style.Theme_Translucent_NoTitleBar);
LayoutInflater inflater = (LayoutInflater)ActivityName.this.getSystemService(LAYOUT_INFLATER_SERVICE);
View layout = inflater.inflate(R.layout.custom_layout,(ViewGroup)findViewById(R.id.layout_root));
dialog.setContentView(view);

edited Nov 13 '14 at 08:31

answered Aug 21 '13 at 00:22

Sushil

8,250
3
39
71

1

But can I just add a line of code to change the color without do all this stuff? – Rick Aug 21 '13 at 00:54
7

May be you can try this : getWindow().setBackgroundDrawableResource(android.R.color.white); – Sushil Aug 21 '13 at 01:00
I hope you are writing it in correct place and getting your alertDialog window only.. – Sushil Aug 21 '13 at 01:24
if you add YOUR_DIALOG.getWindow().setBackgroundDrawableResource(android.R.color.white); it will work for you... – Hossein Mansouri Jun 03 '14 at 07:29

score 3 · Answer 8 · answered Jan 11 '19 at 14:32

I order to change the dialog buttons and background colors, you will need to extend the Dialog theme, eg.:

<style name="MyDialogStyle" parent="android:Theme.Material.Light.Dialog.NoActionBar">
    <item name="android:buttonBarButtonStyle">@style/MyButtonsStyle</item>
    <item name="android:colorBackground">@color/white</item>
</style>

<style name="MyButtonsStyle" parent="Widget.AppCompat.Button.ButtonBar.AlertDialog">
    <item name="android:textColor">@color/light.blue</item>
</style>

After that, you need to pass this custom style to the dialog builder, eg. like this:

AlertDialog.Builder(requireContext(), R.style.MyDialogStyle)

If you want to change the color of the text inside the dialog, you can pass a custom view to this Builder:

AlertDialog.Builder.setView(View)

or

AlertDialog.Builder.setView(@LayoutResource int)

score 0 · Answer 9 · answered May 25 '22 at 12:46

You can create a shape XML in drawable

<shape
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">

    <solid android:color="@color/white" />
</shape>

Add this line after creating an alert dialog

alertDialog.getWindow().setBackgroundDrawable(ContextCompat.getDrawable(ATextActivity.this,R.drawable.color_drawable));

If you do not want to create XML you can try this below code

Create a drawable of color

ColorDrawable colorDrawable = new ColorDrawable(ContextCompat.getColor(this, R.color.white));

alertDialog.getWindow().setBackgroundDrawable(colorDrawable);

score -2 · Answer 10 · edited Jan 10 '18 at 05:50

-2

Use setInverseBackgroundForced(true) on the alert dialog builder to invert the background.

edited Jan 10 '18 at 05:50

Pang

9,564
146
81
122

answered Aug 21 '13 at 00:21

athor

6,848
2
34
37

Change the background color of a pop-up dialog

10 Answers10

Linked

Related