How to change the background color around a DialogFragment?

Question

I'm building a custom DialogFragment. The dialog layout is set to my_dialog.xml, but how can I modify the color around the dialog (the transparent grey)?

my_dialog.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="center" >

    <TextView
        android:id="@+id/hello"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:background="@android:color/holo_orange_light"
        android:gravity="center"
        android:text="hello" />

</RelativeLayout>

MyDialogFragment.java

public class MyDialogFragment extends DialogFragment {

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {

        View view = inflater.inflate(R.layout.my_dialog, container);

        getDialog().getWindow().requestFeature(Window.FEATURE_NO_TITLE);

        return view;
    }
}

Answer 1

I had to set android:windowIsFloating to false and android:windowBackground to my custom color in the dialog style:

styles.xml

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

    <style name="MyDialog" parent="@android:style/Theme.Dialog">
        <item name="android:windowFrame">@null</item>
        <item name="android:windowBackground">@color/orange_transparent</item>
        <item name="android:windowIsFloating">false</item>
        <item name="android:windowContentOverlay">@null</item>
        <item name="android:windowTitleStyle">@null</item>
        <item name="android:colorBackgroundCacheHint">@null</item>
        <item name="android:windowAnimationStyle">@android:style/Animation.Dialog</item>
        <item name="android:windowSoftInputMode">stateUnspecified|adjustPan</item>
        <item name="android:gravity">center</item>
    </style>

</resources>

MyDialogFragment

public class MyDialogFragment extends DialogFragment {

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setStyle(DialogFragment.STYLE_NO_TITLE, R.style.MyDialog);
    }
}

Answer 2

To get a fully transparent dialog, you can set in onCreateView the following

• setBackgroundDrawable to Color.TRANSPARENT
• setDimAmount to 0

See code example here:

public class TextEditor extends DialogFragment {

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragment_text_editor, container);

        // make dialog itself transparent
        getDialog().getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));

        // remove background dim 
        getDialog().getWindow().setDimAmount(0);

        //[add more custom code here...]

        return view;
    }
}

Answer 3

I wanted a transparent background for my DialogFragment, and, in code, this works fine:

@Override
public void onStart() {
    super.onStart();

    Window window = getDialog().getWindow();
    window.setBackgroundDrawableResource(android.R.color.transparent);
}

Of course, you can specify any color or Drawable using setBackgroundDrawable() or setBackgroundDrawableResource().

This works at least in onStart(), but not in onCreate(), and not necessarily in onCreateView(), it seems.

That said, in most cases it's probably cleaner to do this in XML, using styles, along these lines:

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

Answer 4

I found I just needed to do this:

<style name="MyDialog" parent="@android:style/Theme.Dialog">
    <!--  other attributes  -->
    <item name="android:backgroundDimEnabled">false</item>
</style>

Answer 5

Those who are using AlertDialog builder in 'onCreateDialog' instead of 'onCreateView' can assign theme like following code. Complete set of themes can be found from R.style. Don't forget that some of them supported recently and are not available on old device phones.

@Override
    public Dialog onCreateDialog(Bundle savedInstanceState) {

        AlertDialog.Builder builder = new AlertDialog.Builder(getActivity(), android.R.style.Theme_Translucent);
        View view = getActivity().getLayoutInflater().inflate(R.layout.dialog_album, null);
        builder.setView(view);

        return builder.create();
    }

Answer 6

Overriding onCreate and setting the style there should work.

@Override
public void onCreate(Bundle savedInstance){
    super.onCreate(savedInstance);
    setStyle(DialogFragment.STYLE_NO_FRAME, android.R.style.Theme_Translucent);
}

Answer 7

change your Text Background on the XML i just edited your code replace it with yours

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center" >

<TextView
    android:id="@+id/hello"
    android:layout_width="100dp"
    android:layout_height="100dp"
    android:gravity="center"
    android:text="hello" />

because you gave the TextView height and width of 100dp. and set a background for it that will fill the whole dialog. since your main layout is wrap_content. please do accept the answer if that helped you.
Edit : to change the background just add to your layout or to your textview android:background="#232323" you can change these number to any color you like. or you can set a background from the drawable like android:background="@drawable/yourpicturename"

Answer 8

Jul's answer was almost good for me. But it seems it doesn't work when using an AlertDialog.Builder.

I had to set the style here:

@Override
public Dialog onCreateDialog(Bundle savedInstanceState) {

    // Use the Builder class for convenient dialog construction
    AlertDialog.Builder builder = new AlertDialog.Builder(getActivity(), R.style.MyDialog );