Styling titleDivider in Dialog

Question

I am wondering how it is possible to get rid of (or change color) titleDivider in Dialog. It is a blue line below dialog title shown on honeycomb+ devices.

I guess this is relevant piece of layout from SDK, but since there is no style attribute I dont know how to style it. If i try with findViewById there is no android.R.id.titleDivider

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:fitsSystemWindows="true">
    <TextView android:id="@android:id/title" style="?android:attr/windowTitleStyle"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:minHeight="@android:dimen/alert_dialog_title_height"
        android:paddingLeft="16dip"
        android:paddingRight="16dip"
        android:gravity="center_vertical|left" />
    <View android:id="@+id/titleDivider"
            android:layout_width="match_parent"
            android:layout_height="2dip"
            android:background="@android:color/holo_blue_light" />
    <FrameLayout
        android:layout_width="match_parent" android:layout_height="wrap_content"
        android:layout_weight="1"
        android:orientation="vertical"
        android:foreground="?android:attr/windowContentOverlay">
        <FrameLayout android:id="@android:id/content"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />
    </FrameLayout>
</LinearLayout>

I have tried to override dialogTitleDecorLayout which is only reference to dialog_title_holo.xml in my theme.xml, but without success. Error is:

error: Error: No resource found that matches the given name: attr 'dialogTitleDecorLayout'.

Answer 1

I solved the issue by using DialogFragment.STYLE_NO_TITLE theme and then faking title bar in dialog layout.

Answer 2

Thanku All but I got the Solution to get reference to titledivider of alertdialog to change its color using below code.Hope this helps somebody.

int divierId = dialog.getContext().getResources()
                .getIdentifier("android:id/titleDivider", null, null);
View divider = dialog.findViewById(divierId);
divider.setBackgroundColor(getResources().getColor(R.color.creamcolor));

Answer 3

You need to implement

myDialog = builder.create();
myDialog.setOnShowListener(new OnShowListenerMultiple());

//----------------------------
//Function to change the color of title and divider of AlertDialog
public static class OnShowListenerMultiple implements DialogInterface.OnShowListener {
    @Override
    public void onShow( DialogInterface dialog ) {
        if( !(dialog instanceof Dialog) )
            return;

        Dialog d = ((Dialog) dialog);
        final Resources resources = d.getContext().getResources();
        final int color = AppUtility.getColor( resources, R.color.defaultColor );

        try {
            int titleId = resources.getIdentifier( "android:id/alertTitle", null, null );
            TextView titleView = d.findViewById( titleId );
            titleView.setTextColor( color );
        }
        catch( Exception e ) {
            Log.e( "XXXXXX", "alertTitle could not change color" );
        }

        try {
            int divierId = resources.getIdentifier( "android:id/titleDivider", null, null );
            View divider = d.findViewById( divierId );
            divider.setBackgroundColor( color );
        }
        catch( Exception e ) {
            Log.e( "XXXXXX", "titleDivider could not change color" );
        }
    }
}

Answer 4

Here is how I resolved that (thanks to http://joerg-richter.fuyosoft.com/?p=181 ):

MyDialogBuilder.class

public class MyDialogBuilder extends android.app.AlertDialog.Builder {

public MyDialogBuilder(Context context) {
    super(context);
}

@NonNull
@Override
public android.app.AlertDialog create() {
    final android.app.AlertDialog alertDialog = super.create();

    alertDialog.setOnShowListener(new DialogInterface.OnShowListener() {
        @Override
        public void onShow(DialogInterface dialog) {
            int titleDividerId = getContext().getResources()
                    .getIdentifier("titleDivider", "id", "android");

            View titleDivider = alertDialog.findViewById(titleDividerId);
            if (titleDivider != null) {
                titleDivider.setBackgroundColor(getContext().getResources()
                        .getColor(R.color.alert_dialog_divider));
            }
        }
    });

    return alertDialog;
}
}

Answer 5

use

 <View android:id="@+id/titleDivider"
        android:layout_width="match_parent"
        android:layout_height="2dip"
        android:background=#CC3232 />

Answer 6

Before write dialog.show(), write:

int divierId = dialog.getContext().getResources().getIdentifier("android:id/titleDivider",   null, null);
View divider = dialog.findViewById(divierId);
if(divider!=null){
divider.setBackgroundColor(getResources().getColor(R.color.transparent));}

In colors.xml:

<color name="transparent">#00000000</color>

Answer 7

If you don't want to use Default style, don't use AlertDialog. You could go with Activity(with your custom layout) with Dialog Theme.

<activity android:theme="@android:style/Theme.Dialog">

Answer 8

This one is tested on some 4.x devices:

    TextView title = (TextView)getWindow().getDecorView().findViewById(android.R.id.title);
    ((ViewGroup)title.getParent()).getChildAt(1).setVisibility(View.GONE);

Answer 9

Your idea was correct. However, dialogTitleDecorLayout you were looking for is a private resource, so you can't access it in a normal way. But you still can access it using * syntax:

<item name="*android:dialogTitleDecorLayout">@layout/dialog_title</item>

Adding this to my own style and simply copying dialog_title.xml to my app and changing it slightly solved the problem in my case.

Answer 10

Do you watchthis and there is a pcecial library for that, you can watch it there. And the last link will solve you problem

Answer 11

you can make a custom dialog like this:

    Dialog dialog = new Dialog(this);
    dialog.setContentView(R.layout.custom_dialog);
    Button okay = (Button) dialog.findViewById(R.id.button1);
    okay.setOnClickListener(new OnClickListener() {

         public void onClick(View arg0) {

           // do your work
         }
    });

Set a custom title in layout don't use android

     dialog.setTitle();

and your custom_dialog.xml

  <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
   xmlns:android1="http://schemas.android.com/apk/res/android"
   android:id="@+id/layout_root"
   android:layout_width="fill_parent"
   android:layout_height="fill_parent"
   android:orientation="vertical"
   android:padding="10dp">

  <TextView
      android:id="@+id/textView1"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:textColor="#ffffff"
      android:textSize="40sp" 
      android:text="Hello"/>


    <Button
        android:id="@+id/button1"
        android:layout_width="100dp"
        android:layout_height="wrap_content"
        android:layout_marginLeft="150dp"
        android:text="OK" />

    </RelativeLayout>

Answer 12

"Removing the blue line" if I guess correctly means dropping the border between the title of the dialog and it's body. That border come from the Holo theme, so it's not possible to drop it without using your custom layout.

Create a file named custom-dialog.xml with the following content (it's just an example..modify it as you want):

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

    <ImageView
        android:id="@+id/dialogTopImage"
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="0.12"
        android:padding="10dp" />

    <LinearLayout
        android:id="@+id/dialogLine"
        android:layout_width="fill_parent"
        android:layout_height="3dp"
        android:background="@drawable/green_btn"
        android:orientation="vertical" />

    <TextView
        android:id="@+id/dialogText"
        android:layout_width="fill_parent"
        android:layout_height="0dp"
        android:layout_weight="0.32"
        android:padding="5dp"
        android:text=""
         />

    <LinearLayout
        android:id="@+id/general_dialog_layout"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_gravity="center"
        android:layout_marginBottom="5dp"
        android:layout_weight="0.11"
        android:gravity="center"
        android:orientation="horizontal" >

        <Button
            android:id="@+id/dialogButton"
            android:layout_width="100dp"
            android:textSize="8pt"
            android:layout_height="wrap_content"
            android:layout_marginRight="10dp"
            android:background="@drawable/green_btn"
            android:gravity="center"
            android:text="Ok" />

</LinearLayout>

As you see I'm using resources and stuff that won't be in your project, but you can remove them safely. The result in my case is more or less the following one, with an image at top that I'll programatically set in the code.

To create the dialog then use something like:

private Dialog createAndShowCustomDialog(String message, Boolean positive, Drawable d, View.OnClickListener cl, String text1) {

    final Dialog dialog = new Dialog(this);
    dialog.requestWindowFeature(Window.FEATURE_NO_TITLE);
    dialog.setContentView(R.layout.general_dialog_layout);
    // BIND
    ImageView image = (ImageView) dialog.findViewById(R.id.dialogTopImage);
    TextView text = (TextView) dialog.findViewById(R.id.dialogText);
    Button button = (Button) dialog.findViewById(R.id.dialogButton);
    LinearLayout line = (LinearLayout) dialog.findViewById(R.id.dialogLine);

    // SET WIDTH AND HEIGHT
    DisplayMetrics displaymetrics = new DisplayMetrics();
    getWindowManager().getDefaultDisplay().getMetrics(displaymetrics);
    int width = (int) (displaymetrics.widthPixels * 0.85);
    int height = (int) (displaymetrics.heightPixels * 0.60);
    WindowManager.LayoutParams params = getWindow().getAttributes();
    params.width = width;
    dialog.getWindow().setLayout(width, height);


    // SET TEXTS
    text.setText(message);
    button.setText(text1);

    // SET IMAGE
    if (d == null) {
        image.setImageDrawable(getResources().getDrawable(R.drawable.font_error_red));
    } else {
        image.setImageDrawable(d);
    }

    // SET ACTION
    if (cl == null) {
        button.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                dialog.dismiss();
            }
        });
    } else {
        button.setOnClickListener(cl);
    }


    // SHOW
    dialog.show();
    return dialog;
}

Answer 13

These is no way hiding it by control brotha.. I've had the same problem. only thing you can do is create your own CustomDialog

Here is a sample App

Download and have look at the design pattern, then it will be easy

Here is one Tutorial About making Custom Dialog

Important part is after creating the DialogObject don't set the Title by setTitle() create TextView inside your CustomLayout and call it from findViewByID() and set your title

Answer 14

In colors.xml:

<color name="transparent">#00000000</color>

In dialog:

int divierId = dialog.getContext().getResources().getIdentifier("android:id/titleDivider",null, null);

View divider = d.findViewById(divierId); divider.setBackgroundColor(getResources().getColor(R.color.transparent));

Answer 15

In order to hide the default blue line completely (assuming you're in DialogFragment):

    Dialog dialog = getDialog();
    if (dialog != null) {
        final int dividerId = dialog.getContext().getResources()
                .getIdentifier("android:id/titleDivider", null, null);
        View divider = dialog.findViewById(dividerId);
        if  (divider != null) {
            divider.setBackground(null);
        }
    }