CODEWITHSUNDEEP
androidandroid-alertdialogandroid-dialogandroid-styles
pengwang
pengwang

Reputation: 19956

Remove black background on custom dialog

I want to remove the black background on custom dialog as shown in the picture. I'm sure the black background was from the dialog, not from app's background.

custom dialog with black background around it ;

AlertDialog code

public class MyAlertDialog extends AlertDialog { 
    public MyAlertDialog(Context context) 
    {  
        super(context); 
    }  

    public MyAlertDialog(Context context, int theme) 
    { super(context, theme); }
}

Activity code

public void showMyDialogOK(Context context, String s, DialogInterface.OnClickListener OkListener) {        
    MyAlertDialog myDialog = new MyAlertDialog(context, R.style.MyDialog2);        
    myDialog.setTitle(null); 
    myDialog.setMessage(s);        
    myDialog.setButton(DialogInterface.BUTTON_POSITIVE ,"Ok", OkListener);
    myDialog.show();    
}

Styles

<?xml version="1.0" encoding="utf-8"?>
    <resources>
        <style name="MyTheme" parent="@android:style/Theme.NoTitleBar.Fullscreen">
            <item name="android:alertDialogStyle">@style/AlertDialog</item>  
        </style>    

        <style name="MyTheme2" parent="@android:style/Theme.Black">
            <item name="android:alertDialogStyle">@style/AlertDialog</item>    
        </style> 

        <style name="AlertDialog">        
            <item name="android:fullDark">@null</item>
            <item name="android:fullBright">@null</item>
            <item name="android:topDark">@drawable/popup_top_dark</item>
            <item name="android:topBright">@null</item>
            <item name="android:centerBright">@null</item>
            <item name="android:centerDark">@drawable/popup_center_dark</item>
            <item name="android:centerMedium">@null</item>
            <item name="android:bottomDark">@null</item>
            <item name="android:bottomBright">@null</item>
            <item name="android:bottomMedium">@drawable/popup_bottom_medium</item>
        </style>

        <style name="MyDialog2" parent="@android:Theme.Dialog">        
            <item name="android:windowBackground">@null</item>    
            <item name="android:buttonStyle">@style/CustomButton</item>  
        </style>    

        <style name="CustomButton" parent="@android:style/Widget.Button">        
            <item name="android:background">@drawable/button_stateful</item>  
        </style>
</resources>

Image resources

popup_center_dark.9.png

popup_center_dark.9.png

popup_bottom_medium.9.png

popup_bottom_medium.9.png

popup_top_dark.9.png

popup_top_dark.9.png

Upvotes: 50

Views: 57248

Answers (15)

Javid Sattar
Javid Sattar

Reputation: 846

This works for me.in bottomSheetDialogFragment

    override fun onStart() {
    super.onStart()
    // remove black outer overlay, or change opacity
    dialog?.window?.also { window ->
        window.attributes?.also { attributes ->
            attributes.dimAmount = 0.1f
            window.attributes = attributes
        }
    }
}

Upvotes: 0

Arjun Verma
Arjun Verma

Reputation: 11

In KOTLIN apply this on alert dialog object

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

Upvotes: 1

droidster.me
droidster.me

Reputation: 558

Remove the background opacity color, you just need to set the DimAmount

dialog.getWindow().setDimAmount(float amount);

The new dim amount, from 0 for no dim to 1 for full dim.

Upvotes: 6

Christopher Nolan
Christopher Nolan

Reputation: 1107

Use below two code lines. Tested as well.

getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT)); getWindow().clearFlags(WindowManager.LayoutParams.FLAG_DIM_BEHIND);

Upvotes: 5

dira
dira

Reputation: 30594

public MyAlertDialog(
        Context context, 
        int theme
    ) extends AlertDialog { 

    super(context, theme);
    getWindow().setBackgroundDrawable(new ColorDrawable(android.graphics.Color.TRANSPARENT));
}

Upvotes: 103

Shruti
Shruti

Reputation: 5591

you can create xml layout like following and set that layout on dialog(dialog.xml) :

<?xml version="1.0" encoding="utf-8"?>
<ScrollView android:id="@+id/ScrollView01"
    android:layout_width="fill_parent" android:layout_height="fill_parent"
    xmlns:android="http://schemas.android.com/apk/res/android" style="@style/white_background_bl_aatharv">

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="vertical" android:layout_width="fill_parent"
        android:layout_height="wrap_content" android:scrollbars="vertical"
        android:scrollbarAlwaysDrawVerticalTrack="true" android:id="@+id/instructions_view">

        <TextView android:id="@+id/TextView01" android:layout_width="wrap_content"
            android:layout_height="wrap_content" android:textColor="#FFFFFF"
            android:text="text here " />
    </LinearLayout>
</ScrollView>

here is the code to set layout on alert dialog :

AlertDialog alert = cndtnsbuilder.create();
alert.setView(LayoutInflater.from(
currentactivity.this).inflate(
R.layout.dialog, null));
alert.show();

Upvotes: 1

Jamal S
Jamal S

Reputation: 1835

I had the same problem with my custom dialog based on the Alertdialog.Builder, which had a black background showing in the title and the body when i use: 

builder.setView(rootView)
  .setTitle(dialog_title)
  .setMessage(dialog_mesg)

solution was 1- Use one of the pre-defines alert dialog builder's themes:

  • THEME_DEVICE_DEFAULT_DARK
  • THEME_DEVICE_DEFAULT_LIGHT
  • THEME_HOLO_DARK
  • THEME_HOLO_LIGHT THEME_TRADITIONAL

THEME_DEVICE_DEFAULT_LIGHT worked best for me

2 - set the default dialog button (positive / negative) colors to which ever color you desire like so:

 Button b = mAlertDialog.getButton(AlertDialog.BUTTON_POSITIVE);
 Button d = mAlertDialog.getButton(AlertDialog.BUTTON_NEGATIVE);
 b.setTextColor(ContextCompat.getColor(getActivity(), R.color.primary));
 d.setTextColor(ContextCompat.getColor(getActivity(), R.color.primary));

check the below blog post for more detail and tricks to theming options: http://blog.supenta.com/2014/07/02/how-to-style-alertdialogs-like-a-pro/

tested on Oreo 8.1

Upvotes: 0

Khobaib
Khobaib

Reputation: 1597

Sonehow getWindow().setBackgroundDrawable() didn't work for me with AlertDialog. I found an easier solution using Dialog. Here's my 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.popup_window);
        dialog.show();

Upvotes: 27

Charu
Charu

Reputation: 1075

Try this:

myDialog.getWindow().clearFlags(LayoutParams.FLAG_DIM_BEHIND);

Upvotes: 25

Mani
Mani

Reputation: 969

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

Upvotes: 0

sancho
sancho

Reputation: 608

Just change Dialog parent them.

With black backround

<style name="MyDialog2" parent="@android:Theme.Dialog">

Without black background

<style name="MyDialog2" parent="@android:style/Theme.DeviceDefault.Light.Dialog">

Upvotes: 1

fk_androidd
fk_androidd

Reputation: 11

//code style in style.xml :

<style name="translucentDialog" parent="android:Theme.Holo.Dialog">
    <item name="android:windowBackground">@android:color/transparent</item>
</style>

// in activity :set style to dialog :

   Dialog dialogconf = new Dialog(TreeAct.this, R.style.translucentDialog);
            dialogconf.getWindow().requestFeature(Window.FEATURE_NO_TITLE);
                   dialogconf.setContentView(R.layout.dialog_layout);

Upvotes: 1

Pedro Rom&#227;o
Pedro Rom&#227;o

Reputation: 2327

To remove the background color, on layout, you just need to set the background to @null

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@null">

Upvotes: 0

Anson VanDoren
Anson VanDoren

Reputation: 1066

After trying dozens of other solutions for this problem, what ended up working for me is:

<style name="translucentDialog" parent="android:Theme.Holo.Dialog">
    <item name="android:windowBackground">@android:color/transparent</item>
</style>

And then setting my dialog to use this theme.

Upvotes: 10

Gaurav Darji
Gaurav Darji

Reputation: 488

Following method worked for me:

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

Upvotes: 1

Related Questions