Dialog with transparent background in Android

Question

How do I remove the black background from a dialog box in Android. The pic shows the problem.

enter image description here

final Dialog dialog = new Dialog(Screen1.this);
dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
dialog.setContentView(R.layout.themechanger);

this situation also works in this two lines of codes here: https://stackoverflow.com/questions/16186818/set-transparent-background-to-alertdialog-in-android/60867495#60867495 — DeePanShu, Mar 26 '20 at 12:42
Find the best answer here [enter link description here](https://stackoverflow.com/questions/8836938/remove-border-padding-from-dialog) — Collins USHI, May 09 '20 at 21:16

score 805 · Accepted Answer · edited Oct 15 '19 at 09:19

805

Add this code

 dialog.getWindow().setBackgroundDrawable(new ColorDrawable(android.graphics.Color.TRANSPARENT));

Or this one instead:

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

edited Oct 15 '19 at 09:19

Fran Marzoa

4,293
1
37
53

answered May 29 '12 at 08:01

Zacharias Manuel

8,983
1
17
30

16

Thank you! However, I prefer to use `dialog.getWindow().setBackgroundDrawable(new ColorDrawableResource(R.color.transparent));` – RileyE Jun 06 '13 at 18:06
7

this solution helps . issue is, the width will fit the screen. there will be no padding as compared to normal dialog. But Android 4.1 handles it by default – Basavaraj Hampali Aug 22 '13 at 11:14
1

What about if i am using ALert Dialog ?? – Ahmad Arslan Feb 04 '15 at 12:19
1

If you're inside a DialogFragment, just call getDialog().getWindow() ... (after the view was created, e.g. in your onViewCreated callback). – akohout Feb 09 '15 at 13:10
14

I prefer to use `dialog.getWindow().setBackgroundDrawableResource(R.color.transparent);` – Peter Zhao Apr 06 '15 at 08:17
1

how to do it for popup? I tried this popup.getContentView().setBackgroundResource(android.R.color.transparent); but didn't work – Prashanth Debbadwar Sep 03 '15 at 10:08
1

This will change the padding of dialog. I believe the used background is 0 patch image. Is there any way not affecting the padding of dialog? – Cheok Yan Cheng Mar 20 '16 at 19:45
It will work but if u click that transparent area dialogue will not close how to handle this? – John Jun 03 '16 at 08:45
1

`setBackgroundDrawable` is deprecated. It seems `setBackground(Drawable drawable)` is the new way of doing this – Max Jan 16 '18 at 17:27
The hero we need, but not the one we deserve – Odaym Jun 07 '18 at 11:44
1

In Kotlin, this can be written as `dialog.window!!.setBackgroundDrawable(ColorDrawable(Color.TRANSPARENT))` – Tyler Wood Mar 10 '23 at 20:58

score 106 · Answer 2 · edited May 30 '22 at 18:06

106

TL;DR; You just need two things, firstly in your style do something like:

<item name="android:windowIsTranslucent">true</item>
<item name="android:windowBackground">@android:color/transparent</item>

Secondly, make 100% sure said style gets applied to your dialog (maybe by passing to constructor).

Full example

<style name="NewDialog">
    <item name="android:windowFrame">@null</item>
    <item name="android:windowBackground">@android:color/transparent</item>
    <item name="android:windowIsFloating">true</item>
    <item name="android:windowContentOverlay">@null</item>
    <item name="android:windowTitleStyle">@null</item>
    <item name="android:windowAnimationStyle">@android:style/Animation.Dialog</item>
    <item name="android:windowSoftInputMode">stateUnspecified|adjustPan</item>
    <item name="android:backgroundDimEnabled">false</item>
    <item name="android:background">@android:color/transparent</item>
</style>

Use in Java:

Dialog dialog = new Dialog(this, R.style.NewDialog);

I hope helps you !

edited May 30 '22 at 18:06

Top-Master

7,611
5
39
71

answered Sep 19 '13 at 04:38

LongLv

1,410
1
11
16

It will work but if u click that transparent area dialogue will not close how to handle this? – John Jun 03 '16 at 08:46
3

@John You can use: dialog.setCanceledOnTouchOutside(true); – LongLv Jul 22 '16 at 07:56
You can use parent="Theme.AppCompat.Dialog" to make exit on touch outside as default. – Dark Leonhart Jul 13 '17 at 03:52
1

even possible to handle the alpha for dim background: `0.2` or programmatically `window.getAttributes().dimAmount = 0.2f;` – Kidus Tekeste Nov 04 '20 at 08:47

score 36 · Answer 3 · edited Apr 29 '15 at 13:17

I've faced the simpler problem and the solution i came up with was applying a transparent bachground THEME. Write these lines in your styles

    <item name="android:windowBackground">@drawable/blue_searchbuttonpopupbackground</item>
</style>
<style name="Theme.Transparent" parent="android:Theme">
    <item name="android:windowIsTranslucent">true</item>
    <item name="android:windowBackground">@android:color/transparent</item>
    <item name="android:windowContentOverlay">@null</item>
    <item name="android:windowNoTitle">true</item>
    <item name="android:windowIsFloating">true</item>
    <item name="android:backgroundDimEnabled">false</item>
</style>

And then add

android:theme="@style/Theme.Transparent"

in your main manifest file , inside the block of the dialog activity.

Plus in your dialog activity XML set

 android:background= "#00000000"

Or use this if you just want to set the Dialog's style: – Adam Ivancza Jun 06 '13 at 13:59 — Adam Ivancza, Jun 06 '13 at 13:59

score 17 · Answer 4 · edited Aug 30 '18 at 11:34

17

Somehow Zacharias solution didn't work for me so I have used the below theme to resolve this issue...

<style name="DialogCustomTheme" parent="android:Theme.Holo.Dialog.NoActionBar">
    <item name="android:windowBackground">@android:color/transparent</item>
    <item name="android:colorBackgroundCacheHint">@null</item>
</style>

One can set this theme to dialog as below

final Dialog dialog = new Dialog(this, R.style.DialogCustomTheme);

Enjoy!!

edited Aug 30 '18 at 11:34

Aashish Kumar

2,771
3
28
43

answered May 13 '13 at 07:08

Ravi K. Sharma

545
8
15

1

@color/transparent This line should replace by below line or else you have to add a value of transparent in colors.xml file. @android:color/transparent – AkhilGite Mar 03 '16 at 06:57

Erfan · Answer 5 · 2019-12-26T11:17:11.667

17

if you want destroy dark background of dialog , use this

dialog.getWindow().setDimAmount(0);

edited Dec 26 '19 at 11:17

answered Jan 13 '19 at 06:32

Erfan

3,059
3
22
49

Thank you. It is what I have been looking for it. It's great. – Farruh Habibullaev Feb 11 '20 at 19:12
1

This does the job in the most simple way, thank you! However, if you want your app to run on 100% of the devices out there (I have set minimum SDK version to 15), Android suggests the following: `if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) { Objects.requireNonNull(alertDialog.getWindow()).setDimAmount(0); }` – Danny E.K. van der Kolk Apr 07 '20 at 15:32
I prefer using this. Very simple! – iroiroys May 26 '22 at 00:42
With just this, there will be no dimming but there will be shadow around your dialog – ror Jun 08 '23 at 12:37

duggu · Answer 6 · 2018-02-06T04:32:45.113

13

Dialog pop up fill default black background color or theme color so you need to set TRANSPARENT background into Dialog. Try below code:-

final Dialog dialog = new Dialog(this);
dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
dialog.getWindow().setBackgroundDrawable(new ColorDrawable(android.graphics.Color.TRANSPARENT));
dialog.setContentView(R.layout.splash);
dialog.show();

edited Feb 06 '18 at 04:32

answered Oct 04 '13 at 07:18

duggu

37,851
12
116
113

score 12 · Answer 7 · answered May 29 '12 at 08:01

You can use the:

setBackgroundDrawable(null);

method.And following is the doc:

  /**
    * Set the background to a given Drawable, or remove the background. If the
    * background has padding, this View's padding is set to the background's
    * padding. However, when a background is removed, this View's padding isn't
    * touched. If setting the padding is desired, please use
    * {@link #setPadding(int, int, int, int)}.
    *
    * @param d The Drawable to use as the background, or null to remove the
    *        background
    */

this will work, but only when you extend the dialog box, not a fast solution but good one.... — Programmer, May 29 '12 at 09:27

score 10 · Answer 8 · answered Mar 25 '15 at 04:28

One issue I found with all the existing answers is that the margins aren't preserved. This is because they all override the android:windowBackground attribute, which is responsible for margins, with a solid color. However, I did some digging in the Android SDK and found the default window background drawable, and modified it a bit to allow transparent dialogs.

First, copy /platforms/android-22/data/res/drawable/dialog_background_material.xml to your project. Or, just copy these lines into a new file:

<inset xmlns:android="http://schemas.android.com/apk/res/android"
    android:inset="16dp">
    <shape android:shape="rectangle">
        <corners android:radius="2dp" />
        <solid android:color="?attr/colorBackground" />
    </shape>
</inset>

Notice that android:color is set to ?attr/colorBackground. This is the default solid grey/white you see. To allow the color defined in android:background in your custom style to be transparent and show the transparency, all we have to do is change ?attr/colorBackground to @android:color/transparent. Now it will look like this:

<inset xmlns:android="http://schemas.android.com/apk/res/android"
    android:inset="16dp">
    <shape android:shape="rectangle">
        <corners android:radius="2dp" />
        <solid android:color="@android:color/transparent" />
    </shape>
</inset>

After that, go to your theme and add this:

<style name="MyTransparentDialog" parent="@android:style/Theme.Material.Dialog">
    <item name="android:windowBackground">@drawable/newly_created_background_name</item>
    <item name="android:background">@color/some_transparent_color</item>
</style>

Make sure to replace newly_created_background_name with the actual name of the drawable file you just created, and replace some_transparent_color with the desired transparent background.

After that all we need to do is set the theme. Use this when creating the AlertDialog.Builder:

    AlertDialog.Builder builder = new AlertDialog.Builder(this, R.style.MyTransparentDialog);

Then just build, create, and show the dialog as usual!

I followed this with AppCompat AlertDialog but instead of using android:background, I chose to set a transparent color directly with the background drawable's android:color itself. Needed to do this because, setting android:background somehow left some areas still non transparent. But Thanks for sharing the technique! — Dileep P G, Apr 07 '16 at 08:52

score 7 · Answer 9 · edited Mar 27 '20 at 23:26

Attention : Don't use builder for changing background.

Dialog dialog = new Dialog.Builder(MainActivity.this)
                                .setView(view)
                                .create();
dialog.show();dialog.getWindow().setBackgroundDrawableResource(android.R.color.transparent);

change to

Dialog dialog = new Dialog(getActivity());
dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
dialog.setContentView(view);
dialog.getWindow().setBackgroundDrawableResource(android.R.color.transparent);
dialog.show();

When using Dialog.builder, it's not giving getWindow() option in it.

score 4 · Answer 10 · answered Jul 02 '13 at 13:53

4

Try this in your code:

getWindow().setBackgroundDrawableResource(android.R.color.transparent);

it will definately working...in my case...! my frend

answered Jul 02 '13 at 13:53

jigar

1,571
6
23
46

score 3 · Answer 11 · answered May 29 '12 at 08:08

3

Same solution as zGnep but using xml:

android:background="@null"

answered May 29 '12 at 08:08

XST

178
5

score 3 · Answer 12 · edited Jan 02 '23 at 11:10

3

Use this code, it's works for me:

Dialog dialog = new Dialog(getActivity(),android.R.style.Theme_Translucent_NoTitleBar);
dialog.show();

edited Jan 02 '23 at 11:10

SerjantArbuz

982
1
12
16

answered Sep 22 '14 at 11:56

a.hammad

51
4

3

I think it would be more helful for the OP and further visitors, when you add some explaination to your intension. – Reporter Sep 22 '14 at 13:26

score 3 · Answer 13 · answered Mar 30 '16 at 14:18

This is what I did to achieve translucency with AlertDialog.

Created a custom style:

<style name="TranslucentDialog" parent="@android:style/Theme.DeviceDefault.Dialog.Alert">
    <item name="android:colorBackground">#32FFFFFF</item>
</style>

And then create the dialog with:

AlertDialog.Builder builder = new AlertDialog.Builder(getActivity(), R.style.TranslucentDialog);
AlertDialog dialog = builder.create();

Highbrow Director · Answer 14 · 2023-03-21T12:01:23.647

You can use

dialog.window?.setBackgroundDrawableResource(android.R.color.transparent)

If you need to reuse this,

I would recommend creating an extension function. Something like extensions.kt

import android.app.Dialog

fun Dialog.setTransparentBackground() {
    window?.setBackgroundDrawableResource(android.R.color.transparent)
}

and use it on any dialog by calling

dialog.setTransparentBackground()

Have some fun programming...

score 1 · Answer 15 · edited Jan 02 '23 at 09:21

1

In my case solution works like this:

final Drawable drawable = new ColorDrawable(android.graphics.Color.TRANSPARENT);
dialogAssignTag.getWindow().setBackgroundDrawable(drawable);

Additionally, in xml file of your custom dialog:

android:alpha="0.8"

edited Jan 02 '23 at 09:21

SerjantArbuz

982
1
12
16

answered Sep 12 '14 at 08:36

Sagar Shah

4,272
2
25
36

B.Cakir · Answer 16 · 2018-04-10T21:28:33.120

1

In case you extended the DialogFrament class, you can set the theme with:

setStyle(DialogFragment.STYLE_NORMAL, R.style.customDialogTheme);

And then make the custom theme in your styles.xml file (see @LongLv's answer for parameters)

Don't forget to add <item name="android:windowCloseOnTouchOutside">true</item> if you want the dialog to close if the user touches outside the dialog.

edited Apr 10 '18 at 21:28

answered Apr 10 '18 at 20:40

B.Cakir

567
1
5
19

score 1 · Answer 17 · edited Jan 02 '19 at 09:54

Set these style code in style

<style name="Theme.Transparent" parent="android:Theme">
    <item name="android:windowIsTranslucent">true</item>
    <item name="android:windowBackground">@android:color/transparent</item>
    <item name="android:windowContentOverlay">@null</item>
    <item name="android:windowNoTitle">true</item>
    <item name="android:windowIsFloating">true</item>
    <item name="android:backgroundDimEnabled">false</item>
</style>

And simply change false to true below line

<item name="android:backgroundDimEnabled">true</item>

It will dim your background.

score 1 · Answer 18 · edited Feb 14 '23 at 09:15

1

If you use Kotlin, this code can help you:

dialog.window?.setBackgroundDrawable(ColorDrawable(Color.TRANSPARENT))

edited Feb 14 '23 at 09:15

SerjantArbuz

982
1
12
16

answered Oct 19 '21 at 08:49

Mori

2,653
18
24

score 1 · Answer 19 · answered Feb 11 '22 at 09:27

In my case, nothing was working to apply a transparent background.

Only I used in my dialog onStart():

dialog?.window?.setBackgroundDrawable(ColorDrawable(Color.TRANSPARENT))

But it was not taking any effect. I checked styles.xml, nothing linked to my problem.

Finally, when I was checking how my dialog is gets created I found that the navigation component was creating the dialog whenever I request the dialog fragment.

There In XML of navgraph.xml, I defined the dialog fragment as a fragment so, It was created as a fragment instead of a dialog. Changing that fragment to dialog made everything fall in place.

BTW: You cannot modify from fragment to dialog in the GUI of the navigation editor. You should change by hand in code.

This might be one of a cause when some effect on a dialog is not reflected in runtime.

score 0 · Answer 20 · edited Feb 22 '13 at 14:24

0

Window window = d.getWindow();
window.setFlags(WindowManager.LayoutParams.FLAG_BLUR_BEHIND,WindowManager.LayoutParams.FLAG_BLUR_BEHIND);

this is my way, you can try!

edited Feb 22 '13 at 14:24

WarrenFaith

57,492
25
134
150

answered May 29 '12 at 08:15

Hello Sun

133
1
4
16

1

This is deprecated now: @deprecated Blurring is no longer supported. – arberg Aug 05 '16 at 10:11

score 0 · Answer 21 · answered Nov 05 '18 at 08:28

0

For anyone using a custom dialog with a custom class you need to change the transparency in the class add this line in the onCreate():

getWindow().setBackgroundDrawableResource(android.R.color.transparent);

answered Nov 05 '18 at 08:28

Haider Malik

1,581
1
20
23

score 0 · Answer 22 · edited Dec 31 '22 at 12:57

0

ColorDrawable drawable = new ColorDrawable(ContextCompat.getColor(ctx, android.R.color.transparent));
dialog.getWindow().setBackgroundDrawable(drawable);

edited Dec 31 '22 at 12:57

SerjantArbuz

982
1
12
16

answered Jan 27 '20 at 21:12

larsaars

2,065
3
21
32

score 0 · Answer 23 · answered Mar 13 '20 at 01:00

Make sure R.layout.themechanger has no background color because by default the dialog has a default background color.

You also need to add dialog.getWindow().setBackgroundDrawable(newColorDrawable(Color.TRANSPARENT));

And finally

<style name="TransparentDialog">
    <item name="android:windowIsFloating">true</item>
    <item name="android:windowNoTitle">true</item>
    <item name="android:windowBackground">@android:color/transparent</item>
    <item name="android:windowContentOverlay">@null</item>
    <item name="android:windowTitleStyle">@null</item>
</style>

score 0 · Answer 24 · edited Dec 31 '22 at 14:33

0

In Kotlin you can use this code:

val dialog = Dialog(context)
dialog.window?.decorView?.background = null

edited Dec 31 '22 at 14:33

SerjantArbuz

982
1
12
16

answered Dec 28 '22 at 16:02

Yan

26
1
5

score -1 · Answer 25 · answered Nov 23 '20 at 14:50

Kotlin way to create dialog with transparent background:

 Dialog(activity!!, R.style.LoadingIndicatorDialogStyle)
            .apply {
                // requestWindowFeature(Window.FEATURE_NO_TITLE)
                setCancelable(true)
                setContentView(R.layout.define_your_custom_view_id_here)

                //access your custom view buttons/editText like below.z
                val createBt = findViewById<TextView>(R.id.clipboard_create_project)
                val cancelBt = findViewById<TextView>(R.id.clipboard_cancel_project)
                val clipboard_et = findViewById<TextView>(R.id.clipboard_et)
                val manualOption =
                    findViewById<TextView>(R.id.clipboard_manual_add_project_option)

                //if you want to perform any operation on the button do like this

                createBt.setOnClickListener {
                    //handle your button click here
                    val enteredData = clipboard_et.text.toString()
                    if (enteredData.isEmpty()) {
                        Utils.toast("Enter project details")
                    } else {
                        navigateToAddProject(enteredData, true)
                        dismiss()
                    }
                }

                cancelBt.setOnClickListener {
                    dismiss()
                }
                manualOption.setOnClickListener {
                    navigateToAddProject("", false)
                    dismiss()
                }
                show()
            }

Create LoadingIndicatorDialogStyle in style.xml like this:

<style name="LoadingIndicatorDialogStyle" parent="Theme.AppCompat.Light.Dialog.Alert">
    <item name="android:windowIsTranslucent">true</item>
    <item name="android:windowBackground">@android:color/transparent</item>
    <item name="android:windowContentOverlay">@null</item>
    <item name="android:windowNoTitle">true</item>
    <item name="android:statusBarColor">@color/black_transperant</item>
    <item name="android:layout_gravity">center</item>
    <item name="android:background">@android:color/transparent</item>
    <!--<item name="android:windowAnimationStyle">@style/MaterialDialogSheetAnimation</item>-->
</style>

Dialog with transparent background in Android

25 Answers25

Full example

Linked

Related