Search code examples
androiddialogfragmentandroid-dialogfragment

Change background color of header in DialogFragment android


I have DialogFragment, which show some information. It's work nice, but I need different header, I need white Title color text and blue background of the header. This is my xml:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">
    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@mipmap/ic_launcher"
                android:id="@+id/icon_teacher"
                android:layout_marginTop="20dp"
                android:layout_marginLeft="20dp"/>

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="@string/teacher"
                android:id="@+id/teacher"
                android:layout_marginLeft="10dp"
                android:layout_alignTop="@+id/icon_teacher"
                android:layout_toRightOf="@+id/icon_teacher"
                android:layout_toEndOf="@+id/icon_teacher" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="@string/name_of_teacher"
                android:textColor="@android:color/black"
                android:textSize="16dp"
                android:id="@+id/teacher_name"
                android:layout_below="@+id/teacher"
                android:layout_alignLeft="@+id/teacher"
                android:layout_alignStart="@+id/teacher" />

            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@mipmap/ic_launcher"
                android:id="@+id/icon_time"
                android:layout_below="@+id/icon_teacher"
                android:layout_marginTop="20dp"
                android:layout_marginLeft="20dp"/>

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="@string/teacher"
                android:id="@+id/time"
                android:layout_marginLeft="10dp"
                android:layout_alignTop="@+id/icon_time"
                android:layout_toRightOf="@+id/icon_time"
                android:layout_toEndOf="@+id/icon_time" />
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="@string/name_of_teacher"
                android:textColor="@android:color/black"
                android:textSize="16dp"
                android:id="@+id/time_name"
                android:layout_below="@+id/time"
                android:layout_alignLeft="@+id/time"
                android:layout_alignStart="@+id/time" />

            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@mipmap/ic_launcher"
                android:id="@+id/icon_place"
                android:layout_below="@+id/icon_time"
                android:layout_marginTop="20dp"
                android:layout_marginLeft="20dp"/>

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="@string/teacher"
                android:id="@+id/place"
                android:layout_marginLeft="10dp"
                android:layout_alignTop="@+id/icon_place"
                android:layout_toRightOf="@+id/icon_place"
                android:layout_toEndOf="@+id/icon_place" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="@string/name_of_teacher"
                android:textColor="@android:color/black"
                android:textSize="16dp"
                android:id="@+id/place_name"
                android:layout_below="@+id/place"
                android:layout_alignLeft="@+id/place"
                android:layout_alignStart="@+id/place" />

            <ImageView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@mipmap/ic_launcher"
                android:id="@+id/icon_home"
                android:layout_below="@+id/icon_place"
                android:layout_marginTop="20dp"
                android:layout_marginLeft="20dp"/>

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="@string/teacher"
                android:id="@+id/home"
                android:layout_marginLeft="10dp"
                android:layout_alignTop="@+id/icon_home"
                android:layout_toRightOf="@+id/icon_home"
                android:layout_toEndOf="@+id/icon_home" />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="@string/name_of_teacher"
                android:textColor="@android:color/black"
                android:textSize="16dp"
                android:id="@+id/place_home"
                android:layout_below="@+id/home"
                android:layout_alignLeft="@+id/home"
                android:layout_alignStart="@+id/home" />
            <View
                android:layout_width="match_parent"
                android:layout_height="1dp"
                android:id="@+id/divider1"
                android:layout_below="@+id/icon_home"
                android:layout_marginTop="10dp"
                android:background="@android:color/darker_gray"/>
            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_below="@+id/divider1"
                android:layout_marginTop="10dp">
                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:src="@mipmap/ic_launcher"
                    android:layout_marginLeft="10dp"
                    android:id="@+id/imageView" />
                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="@string/alert"
                    android:id="@+id/alert"
                    android:layout_marginLeft="10dp"
                    android:layout_gravity="center_vertical"/>
            </LinearLayout>
        </RelativeLayout>
    </ScrollView>
</RelativeLayout>

And my DialogFragment, but i think it won't be helpful so much:

public class LessonDialogFragment extends DialogFragment {

    View view;
    String title;

    public LessonDialogFragment(String title) {
        this.title = title;
    }

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        view = inflater.inflate(R.layout.detail_dialog_fragment, container, false);
        getDialog().setTitle(title);
        return view;
    }
    }

I don't know how change it, maybe you can help me.


Solution

  • for custom layout:

    https://developer.android.com/guide/topics/ui/dialogs.html#CustomLayout

    AlertDialog dialog = builder.show();

    // Set title divider color
    int titleDividerId = getResources().getIdentifier("titleDivider", "id", "android");
    View titleDivider = dialog.findViewById(titleDividerId);
    if (titleDivider != null)
        titleDivider.setBackgroundColor(getResources().getColor(android.R.color.holo_purple));
    

    Customising the background of the header is slightly more complex... You need to define in your theme an alertDialogStyle defining how you draw each area of the dialog. For example:

    <style name="Theme.Yours" parent="@android:style/Theme.Holo">
        ...
        <item name="android:alertDialogStyle">@style/AlertDialog_Yours</item>
    </style>
    
    <style name="AlertDialog_Yours">
        <item name="android:fullDark">...</item>
        <item name="android:topDark">...</item>
        <item name="android:centerDark">...</item>
        <item name="android:bottomDark">...</item>
        <item name="android:fullBright">...</item>
        <item name="android:topBright">...</item>
        <item name="android:centerBright">...</item>
        <item name="android:bottomBright">...</item>
        <item name="android:bottomMedium">...</item>
        <item name="android:centerMedium">...</item>
    </style>