remove white background in dialogfragment

Question

Here's how I called my DialogFragment:

DialogSelectAccount myDiag=new DialogSelectAccount();
myDiag.show(ft,"Diag" );

Here's how (partially) my DialogFragment is created:

public class DialogSelectAccount extends DialogFragment {
public DialogSelectAccount() {

    }

@Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setRetainInstance(true);
 }

@Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        View rootView = inflater.inflate(R.layout.dialog_select_account, container, false);
tvMessage = (TextView) rootView.findViewById(R.id.tvMessage);
        btnAccountPublic = (Button) rootView.findViewById(R.id.btnAccountPublic);
        btnAccountEnterprise = (Button) rootView.findViewById(R.id.btnAccountEnterprise);
        tvMessage.setText(message);
        btnAccountPublic.setOnClickListener(new View.OnClickListener() {

            @Override
            public void onClick(View v) {
                Login.setAccountType = 2;
                dismiss();
            }
        });
        btnAccountEnterprise.setOnClickListener(new View.OnClickListener() {

            @Override
            public void onClick(View v) {
                Login.setAccountType = 1;
                dismiss();
            }
        });
        return rootView;
    }

and here's the xml for my DialogSelectAccount

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="#ff26b4e9"
    android:orientation="vertical" >

    <TextView
        android:id="@+id/tvMessage"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_margin="10dp"
        android:textColor="@android:color/black"
        android:textSize="15dp"
        android:textAlignment="center"
        android:gravity="center_horizontal"
        android:background="#ff26b4e9"
        android:autoText="true">
    </TextView>

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:background="#ff26b4e9"
        android:orientation="horizontal" >

        <Button
            android:id="@+id/btnAccountPublic"
            android:layout_width="150dp"
            android:layout_height="wrap_content"
            android:clickable="true"
            android:text="@string/accountPub"
            android:textColor="#ffffffff"
            android:background = "@drawable/roundedbutton" />

        <Button
            android:id="@+id/btnAccountEnterprise"
            android:layout_width="150dp"
            android:layout_height="wrap_content"
            android:layout_marginLeft="5dp"
            android:clickable="true"
            android:text="@string/accountEnt"
            android:textColor="#ffffffff"
            android:background = "@drawable/roundedbutton" />
    </LinearLayout>

</LinearLayout>

the problem is there's always an innoying white background displayed, as shown below. How do I remove it?

Solution 1

In the onCreateView() of your DialogFragment, replace

View rootView = inflater.inflate(R.layout.dialog_select_account, container, false);

with

View rootView = inflater.inflate(R.layout.dialog_select_account, container);

Also, add this to onViewCreated():

getDialog().requestWindowFeature(Window.FEATURE_NO_TITLE);
getDialog().getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));
setStyle(DialogFragment.STYLE_NO_FRAME, android.R.style.Theme);

and in the outermost LinearLayout of the XML, change

android:layout_width="fill_parent"
android:layout_height="fill_parent"

to

android:layout_height="wrap_content"
android:layout_width="wrap_content"

Try this. This should work.

Solution 2

I suggest you create an alert dialog with your custom UI in onCreateDialog in your DialogFragment instead. Then you can then also easily add a style to it that will remove the white background.

 override fun onCreateDialog(savedInstanceState: Bundle?): Dialog {
    val view = activity!!.layoutInflater.inflate(R.layout.dialogfragment_my_custom_view, null)
    val builder = AlertDialog.Builder(activity!!, R.style.MyDialogTheme)
    return builder
            .setView(view)
            .create()
}

Then you can just create the "MyDialogTheme" like this:

<style name="ProgressDialogTheme" parent="Theme.AppCompat.Light.Dialog.Alert">
    <item name="android:windowBackground">@color/automile_transparent</item>
</style>

Solution 3

Higher android version devices automatically remove title space. But for lower version we have to add some line of code.

It is more effective to add Window.FEATURE_NO_TITLE in onCreateDialog() method. Same as below :

@Override
public Dialog onCreateDialog(Bundle savedInstanceState) {

   Dialog dialog = super.onCreateDialog(savedInstanceState);
   // request a dialog window without the title
   dialog.getWindow().requestFeature(Window.FEATURE_NO_TITLE);
   return dialog;
}

Solution 4

You can create style for your dialog:

<style name="DialogStyle" parent="Base.Theme.AppCompat.Dialog">
    <item name="android:windowNoTitle">true</item>
</style>

And use it in code by method:

@Override
public Dialog onCreateDialog(Bundle savedInstanceState) {
    return new Dialog(getActivity(), R.style.DialogStyle);
}

Or you can set FEATURE_NO_TITLE for your dialog only in your code as is shown in the code below:

@Override
public Dialog onCreateDialog(Bundle savedInstanceState) {
  Dialog dialog = super.onCreateDialog(savedInstanceState);
  dialog.getWindow().requestFeature(Window.FEATURE_NO_TITLE);
  return dialog;
}

View more solutions