Change style for AlertDialog lower grey panel

Question

What style is causing the grey bar in the bottom of an AlertDialog?

Either I need to change the rest of the dialog to match the color or vice versa. I've tried modifying @android:buttonStyle and @android:buttonBarStyle. That helps but there's still some grey peeking out from the edges of the region.

Here are my current styles:

<style name="MyAlertDialog" parent="@android:style/Theme.Dialog">
  <item name="@android:background">#FF000000</item>
  <item name="@android:buttonBarStyle">@style/MyButtonBar</item>
</style>

<style name="MyButtonBar" parent="@android:style/ButtonBar">
  <item name="@android:background">#FF000000</item>
</style>

And it looks like this:

enter image description here

Good idea! I'm trying that but it's turning out to be harder. If you look at the image above, you see there's a black band around the thin grey border. That is not part of the dialog layout and is being added by the builder. Not sure how to either get rid of it or work with it. — Peri Hartman, Apr 29 '15 at 01:37
Go to my answer here: http://stackoverflow.com/questions/25174165/transparent-alertdialog-has-black-background/25174316#25174316 — Rod_Algonquin, Apr 29 '15 at 01:51
I gave you an upvote. I'll add, though, that even this wasn't intuitive. You cannot use any of the Alert builder methods to add content to the dialog. You can't even name your button "button1" and get a response from it. Basically, you have to do the whole dialog and OnClick handlers yourself. Still worth it, because you get the popup displayed in a reasonable location with its semi modal behavior. — Peri Hartman, Apr 30 '15 at 21:41

score 0 · Accepted Answer · answered Apr 30 '15 at 21:58

Here is a working solution, based on Rod_Algonquin's idea of using a custom layout.

  private void showCustomAlert (String message)
  {
    // build dialog
    LayoutInflater inflater = getLayoutInflater();
    View alertView = inflater.inflate (R.layout.custom_dialog, null);
    AlertDialog.Builder builder = new AlertDialog.Builder (this, R.style.CustomAlertDialog);
    builder.setView (alertView);
    final AlertDialog alert = builder.create();

    // message
    ((TextView)alertView.findViewById (R.id.message)).setText (message);

    // ok button
    alertView.findViewById (R.id.cancel).setOnClickListener (new View.OnClickListener()
    {
      @Override public void onClick(View v) { alert.dismiss(); }
    });

    // show
    alert.show();
  }

Here is a layout that works with this code:

<LinearLayout
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:orientation="vertical"
  android:background="#FF000000">

  <TextView android:id="@+id/alertTitle"
      android:singleLine="true"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:minHeight="50dp"
      android:gravity="center"
      android:background="@android:color/black"
      android:textColor="@android:color/white"
      android:textAppearance="@android:style/TextAppearance.Large"
      android:text="@string/custom_alert_title" />

  <TextView android:id="@+id/message"
      style="@android:attr/textAppearanceMedium"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:padding="20dp"
      android:background="@android:color/black"
      android:textColor="@android:color/white"
      android:textAppearance="@android:style/TextAppearance.Medium" />

  <LinearLayout
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:orientation="horizontal"
      android:gravity="center"
      android:background="@android:color/black"
      android:measureWithLargestChild="true">

    <Button android:id="@+id/cancel"
        style="?android:attr/buttonBarButtonStyle"
        android:layout_height="wrap_content" 
        android:layout_width="wrap_content" 
        android:minHeight="50dp"
        android:minWidth="100dp"
        android:textSize="14sp"
        android:text="@android:string/ok" />
  </LinearLayout>
</LinearLayout>

Finally, here's the styles, from styles.xml, I referenced; you may not need them depending on your dialog coloring.

  <style name="CustomAlertDialog" parent="@android:style/Theme.Dialog">
    <item name="@android:background">#FF000000</item>
    <item name="@android:buttonBarStyle">@style/CustomButtonBar</item>
  </style>

  <style name="CustomButtonBar" parent="@android:style/ButtonBar">
    <item name="@android:background">#FF000000</item>
  </style>

Change style for AlertDialog lower grey panel

1 Answers1