Android 继承DialogFragment实现对话框

前言

在重构项目UI时，由于需要重新改下对话框界面，然后期望效果图如下：

虽然简单，但是感觉很久都没动手写UI，差不多都忘了[尴尬]，所以搞起来也是稍微耗了点时间，于是打算记录下。

问题

继承DialogFragment后，如果什么都不处理，则效果如下：

与期望的效果差别：
1.对话框顶部有白色块
2.对话框顶部有蓝色线条（部分5.0以下手机）
3.对话框左右边缘与屏幕边缘有间隙
4.背景不是完全透明
5.顶部添加阴影

1.去除对话框顶部有白色块
顶部多出的白色块可以通过调用getDialog().getWindow().requestFeature(Window.FEATURE_NO_TITLE)去除，调用时机可以在onCreateView方法或onActivityCreated方法，

 @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        getDialog().getWindow().requestFeature(Window.FEATURE_NO_TITLE);  // 去掉空白部分
        View inflate = inflater.inflate(R.layout.dialog_test, container, false);
        return inflate;
    }

或

    @Override
    public void onActivityCreated(Bundle savedInstanceState) {
        getDialog().getWindow().requestFeature(Window.FEATURE_NO_TITLE); // 需在super.onActivityCreated方法前调用
        super.onActivityCreated(savedInstanceState);
    }

效果如下：

2.去除对话框顶部蓝色线条
方式一：
通过1中调用getDialog().getWindow().requestFeature(Window.FEATURE_NO_TITLE)可以实现去除。
方式二
如果没有调用getDialog().getWindow().requestFeature(Window.FEATURE_NO_TITLE)
方法，则在5.0以下系统还需调用如下方法去掉（在onStart方法调用）：

		  if (Build.VERSION.SDK_INT < Build.VERSION_CODES.LOLLIPOP) {  // 对于部分低于5.0系统的手机的对话框顶部出现蓝色线条
                int dividerId = getResources().getIdentifier("android:id/titleDivider", null, null);
                if (dividerId != 0) {
                    View divider = getDialog().findViewById(dividerId);
                    divider.setBackgroundColor(Color.TRANSPARENT);
                }
            }

效果如下：

此种方式还需要去title空白区域，可以调用如下方法(在onStart方法中)：

getDialog().getWindow().setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));

效果和***1.去除对话框顶部有白色块***一样。

3.去除对话框左右边缘与屏幕边缘间隙
4.设置背景透明
上述两项可通过Window对象重新设置相应的属性来实现。

 @Override
    public void onStart() {
        super.onStart();
        Dialog dialog = getDialog();
        Window dialogWindow = dialog.getWindow();
        if (dialogWindow != null) {
            dialogWindow.setBackgroundDrawable(new ColorDrawable(Color.TRANSPARENT));  // 设置对话框背景透明，即隐藏title的空白区域
            WindowManager.LayoutParams attributes = dialogWindow.getAttributes();
            attributes.gravity = Gravity.BOTTOM; // 底部显示
            attributes.width = WindowManager.LayoutParams.MATCH_PARENT; // 设置宽度为手机宽度（去除间隙）
            attributes.dimAmount = 0.0f; // 设置背景透明（0-1，0为完全透明，1为不透明）
            dialogWindow.setAttributes(attributes);

            if (Build.VERSION.SDK_INT < Build.VERSION_CODES.LOLLIPOP) {  // 对于部分低于5.0系统的手机的对话框顶部出现蓝色线条
                int dividerId = getResources().getIdentifier("android:id/titleDivider", null, null);
                if (dividerId != 0) {
                    View divider = dialog.findViewById(dividerId);
                    divider.setBackgroundColor(Color.TRANSPARENT);
                }
            }
        }
    }

效果如下：

5.顶部添加阴影
1.通过自定义drawable实现阴影效果(dialog_with_shadow.xml)

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" >

    <item >
        <shape android:shape="rectangle" >
            <gradient
                android:angle="90"
                android:endColor="#00000000"
                android:startColor="#AF000000" />
        </shape>
    </item>
    
 <!--需要设置阴影长度-->
    <item android:top="10dp">
        <shape android:shape="rectangle" >
            <solid android:color="#FFFFFFFF"/>
        </shape>
    </item>

</layer-list> 

2.布局引用上面自定的drawable

<?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="wrap_content">

    <!--需要多加个对话框嵌套层，并且需要属性android:paddingTop="10dp"设置阴影长度-->
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:paddingTop="10dp"  // 设置阴影长度，实际代码要去掉此注释
        android:background="@drawable/dialog_with_shadow"  // 引用阴影drawable文件，实际代码要去掉此注释
        android:orientation="vertical">

        <TextView
            android:id="@+id/tv_dialog_title"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/colorWhite"
            android:gravity="left|center"
            android:paddingBottom="10dp"
            android:paddingLeft="16dp"
            android:paddingTop="10dp"
            android:text="Title"
            android:textColor="@color/colorBlack"
            android:textSize="@dimen/text_medium" />

        <View
            android:layout_width="match_parent"
            android:layout_height="1dp"
            android:background="@color/colorGray" />

        <TextView
            android:id="@+id/tv_dialog_message"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/colorWhite"
            android:gravity="left|center_vertical"
            android:paddingBottom="25dp"
            android:paddingLeft="16dp"
            android:paddingTop="25dp"
            android:text="This is a dialog"
            android:textColor="@color/colorBlack"
            android:textSize="@dimen/text_medium" />

        <View
            android:layout_width="match_parent"
            android:layout_height="1dp"
            android:background="@color/colorGray" />

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal">

            <TextView
                android:id="@+id/tv_ok"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:background="@color/colorWhite"
                android:gravity="center"
                android:padding="10dp"
                android:text="OK"
                android:textColor="@color/colorBlack"
                android:textSize="@dimen/text_medium" />

            <View
                android:layout_width="1dp"
                android:layout_height="match_parent"
                android:background="@color/colorGray" />

            <TextView
                android:id="@+id/tv_cancel"
                android:layout_width="0dp"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:background="@color/colorWhite"
                android:gravity="center"
                android:padding="10dp"
                android:text="NO"
                android:textColor="@color/colorGray"
                android:textSize="@dimen/text_medium" />

        </LinearLayout>

    </LinearLayout>

</LinearLayout>

**备注：**上述布局缺失的资源
color:

    <color name="colorBlack">#000000</color> <!--黑色-->
    <color name="colorWhite">#FFFFFF</color> <!--白色-->
    <color name="colorGray">#DBDBDB</color> <!--灰色-->

dimen:

    <dimen name="text_medium">18sp</dimen>