Make alert dialog background transparent

Question

I am creating an alert dialog on Android Jelly Beans OS. Everything works well but what I want is that instead of the black background of the alert dialog I want a transparent background. I read so many articles and user's question on stackoverflow but none of them is helping me out.

Here is my code:

AlertDialog.Builder builder =  new AlertDialog.Builder(this, R.style.CustomAlertDialog);
    builder.setPositiveButton(android.R.string.ok, new DialogInterface.OnClickListener() {
        public void onClick(DialogInterface dialog1, int which) {
            gActivityResult = REQUEST_PICK_CONTACT;
            onResume();
            return;
        } }); 
    builder.setNegativeButton(android.R.string.cancel, new DialogInterface.OnClickListener() {
        public void onClick(DialogInterface dialog1, int which) {
            return;
        } }); 
    View view = getLayoutInflater().inflate(R.layout.alert_dialog, null);
    builder.setTitle(R.string.gender_age);
    builder.setInverseBackgroundForced(false);
    builder.setView (view);


    dialog = builder.create ();

Here is my CustomAlertDialog which is defined in res/values/styles.xml

<style name="CustomAlertDialog" parent="@android:style/Theme.Dialog">
    <!-- All customizations that are NOT specific to a particular API-level can go here. -->
    <item name="android:windowFrame">@null</item>
    <item name="android:windowIsFloating">true</item> 
    <item name="android:windowContentOverlay">@null</item>
    <item name="android:windowAnimationStyle">@android:style/Animation.Dialog</item>
    <item name="android:windowBackground">@color/transparent_color</item>
    <item name="android:windowSoftInputMode">stateUnspecified|adjustPan</item>
    <item name="android:colorBackgroundCacheHint">@null</item>
    <item name="android:gravity">left</item>
</style>

Here is the color.xml

<resources>
   <color name="transparent_color">#00000000</color>
</resources>

But it didn't help me.

My question: Is this doable? If yes, can you please guide me in the right direction?

Hutt

Is your goal only to make it transparent? Or Are there other reasons for which you chose to build a custom theme? Transparency can be brought even without the custom theme. – Kraut

I need it only to be transparent. – Hutt

Answer 1

If you haven't read Style attributes of custom styled AlertDialog question, you should go ahead and read. The answer suggests to use Dialog instead of Alert Dialog. Moreover reading Why does LayoutInflater ignore the layout_width and layout_height layout parameters I've specified? issue with LayoutInflater might clear a bit more. Hope it helps. Try it and let me know if it works.

Kraut

Thanks Shobhit!! Converting the Alert Dialog to Dialog did help me to make the background as transparent. However, it means that I need to add my own "OK" and "Cancel" button and add listeners to them? Also, now I am not able to see the border of the dialog!! – Hutt

okay. Don't convert to Dialog. On your AlertDialog ( NOT on the builder) try: dialog.getWindow().setBackgroundDrawable(new ColorDrawable(android.graphics.Color.TRANSPARENT)). – Kraut

I tried that before but it didn't work. I also tried dialog.getWindow().setBackgroundDrawable(new ColorDrawable(0)) which also didn't work. I am not sure why it should be a big deal to give transparent background to the alert dialog. – Hutt

You're right. Maybe that's the reason why they created dialogs. I generally either use Dialogs or "an activity with a Dialog theme", if I require something ike what you wish for. – Kraut

Answer 2

I found this way that is compatible with AlertDialog.Builder . Using the "Dump View Hierarchy" button in the Android "Devices" tab in Eclipse, I saw many nested FrameLayouts and it seemed like the background was in these, vs the window.

Traversing these Views and setting background to transparent on each actually worked (my custom view then floats over the dimmed app, with no frames or backgrounds, and there is no change in layout). I had a custom view, so traversed down from it, but traversing ViewGroups up from the Window should also work.

I am using an AlertDialog.Builder in my own DialogFragment subclass with a custom view.

   @Override
   public Dialog onCreateDialog(Bundle savedInstanceState) {
    final AlertDialog.Builder builder = new AlertDialog.Builder(getActivity());
    configureDialogBuilder(builder);

    final LayoutInflater inflater = getActivity().getLayoutInflater();
    customView = inflater.inflate(customViewId, null);
    builder.setView(customView);

    final AlertDialog dialog = builder.create();
    return dialog;
  }

  @Override
  public void onStart() {
    super.onStart();
    clearBackgrounds(customView);
  }

  private void clearBackgrounds(View view) {
    while (view != null) {
      view.setBackgroundResource(android.graphics.Color.TRANSPARENT);

      final ViewParent parent = view.getParent();
      if (parent instanceof View) {
        view = (View) parent;
      } else {
        view = null;
      }
    }
  }

Encompass

This works, but then the buttons area of the alert dialog don't have a background. How do you deal with it? – Jinn

Answer 3

I had to do something similar for one of my projects. What I did was to create an Activity just for the AlertDialog.

Not sure if this is what you are after but posting it here in case it helps you...

Activity

public class ShowAlertDialogActivity extends FragmentActivity {

    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.alert_dialog);

        AlertDialog.Builder builder = new AlertDialog.Builder(this);
        // create the builder

        AlertDialog alert = builder.create();
        alert.show();
    }
}

And I set the background to transparent in the layout (alert_dialog.xml)...

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

And added the activity to the Manifest...

<activity
    android:name=".ShowAlertDialogActivity"
    android:label="@string/app_title"
    android:theme="@style/AppTheme"
    android:launchMode="singleTask" />

This did the job for me.

Hope this helps.

Godroon

This is highly demotivating answer I have ever read! An activity as a dialog; creativity at peak. Workarounds have limits, not to be crossed! – Muscarine

@Muscarine there is something like this in the docs developer.android.com/guide/topics/ui/dialogs#ActivityAsDialog – Maccabean

@Ahmedna A use-case is clearly mentioned in that doc. But this may complicate scenarios where you strictly want to keep a tab on the context of a specific Activity. And to be precise, I mean workarounds are not solutions! But yeah we have to patch things up now-and-then as developers. Thanks for pointing that one out buddy! :) – Muscarine

Answer 4

simply call,

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

just before

customDialog.show();

Hepner