Android中自定义日期选择对话框

系统系统的日期选择对话框有时候无法满足我们的需要，尤其是需要修改文字之类的时候，但自定义一个太麻烦。当然，我们可以选择一个第三方的日期选择器，但是需要引入三方依赖，如果只是简单的改改UI风格，改个文字内容，就没有必要引入三方了。这里我提供一个自定义日期选择对话框的方法。

首先还是老规矩，我们准备一些资源。

1.先是我们的颜色，在colors.xml中加入如下颜色

<color name="black">#000000</color>
<color name="white">#ffffff</color>
<color name="transparent">#00000000</color>
<color name="blue">#0099ff</color>

当然，这个我们可以到时候根据自己需要自己定义。

2.接着是我们的风格，在styles.xml中加入如下代码

<style name="CustomDateDialog" parent="@android:style/Theme.Dialog">
    <item name="android:windowFrame">@null</item>
    <item name="android:windowNoTitle">true</item>
    <item name="android:windowBackground">@color/transparent</item>
    <item name="android:windowIsTranslucent">true</item>
</style>

3.然后是我们的弹框布局，这里我命名为date_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:background="@color/transparent"
    android:gravity="center"
    android:orientation="vertical"
    android:paddingLeft="40dp"
    android:paddingRight="40dp" >

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:orientation="vertical"
        android:background="@color/white" >

        <TextView
            android:id="@+id/tv_title"
            android:layout_width="match_parent"
            android:layout_height="60dp"
            android:paddingLeft="10dp"
            android:gravity="left|center"
            android:text="请选择日期"
            android:textColor="@color/blue"
            android:textSize="22sp" />

        <View
            android:layout_width="match_parent"
            android:layout_height="2dp"
            android:background="@color/blue" />

        <DatePicker
            android:id="@+id/dp_date"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:calendarViewShown="false"
            android:gravity="center"
            android:spinnersShown="true"
            android:datePickerMode="spinner" />

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

        <Button
            android:id="@+id/btn_ok"
            android:layout_width="match_parent"
            android:layout_height="60dp"
            android:background="@null"
            android:gravity="center"
            android:text="确定"
            android:textColor="@color/black"
            android:textSize="17sp" />
    </LinearLayout>
</LinearLayout>

其中的DatePicker有spinner和calendar两个选择。如果是spinner是滑动滚轮的效果，如果是calendar是日历的效果。

4.接着就是我们的自定义弹框了

import android.app.Dialog;
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.DatePicker;
import android.widget.TextView;

public class CustomDateDialog implements View.OnClickListener {
    private Dialog dialog; // 声明一个对话框对象
    private View view; // 声明一个视图对象
    private TextView tv_title;
    private DatePicker dp_date; // 声明一个日期选择器对象

    public CustomDateDialog(Context context) {
        // 根据布局文件dialog_date.xml生成视图对象
        view = LayoutInflater.from(context).inflate(R.layout.date_dialog, null);
        // 创建一个指定风格的对话框对象
        dialog = new Dialog(context, R.style.CustomDateDialog);
        tv_title = view.findViewById(R.id.tv_title);
        // 从布局文件中获取名叫dp_date的日期选择器
        dp_date = view.findViewById(R.id.dp_date);
        view.findViewById(R.id.btn_ok).setOnClickListener(this);
    }

    // 设置日期对话框的标题文本
    public void setTitle(String title) {
        tv_title.setText(title);
    }

    // 设置日期对话框内部的年、月、日，以及日期变更监听器
    public void setDate(int year, int month, int day, OnDateSetListener listener) {
        dp_date.init(year, month, day, null);
        mDateSetListener = listener;
    }

    // 显示对话框
    public void show() {
        // 设置对话框窗口的内容视图
        dialog.getWindow().setContentView(view);
        // 设置对话框窗口的布局参数
        dialog.getWindow().setLayout(
                ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.WRAP_CONTENT);
        dialog.show(); // 显示对话框
    }

    // 关闭对话框
    public void dismiss() {
        // 如果对话框显示出来了，就关闭它
        if (dialog != null && dialog.isShowing()) {
            dialog.dismiss();
        }
    }

    // 判断对话框是否显示
    public boolean isShowing() {
        if (dialog != null) {
            return dialog.isShowing();
        } else {
            return false;
        }
    }

    @Override
    public void onClick(View v) {
        if (v.getId() == R.id.btn_ok) { // 点击了确定按钮
            dismiss(); // 关闭对话框
            if (mDateSetListener != null) { // 如果存在月份变更监听器
                dp_date.clearFocus(); // 清除日期选择器的焦点
                // 回调监听器的onDateSet方法
                mDateSetListener.onDateSet(dp_date.getYear(),
                        dp_date.getMonth() + 1, dp_date.getDayOfMonth());
            }
        }
    }

    // 声明一个日期变更的监听器对象
    private OnDateSetListener mDateSetListener;
    // 定义一个日期变更的监听器接口
    public interface OnDateSetListener {
        void onDateSet(int year, int monthOfYear, int dayOfMonth);
    }
}

我把引入的包也留下，防止大家引入包的时候引入错误。

5.最后在我们要显示日期选择的页面加入如下代码

 // 显示自定义的日期对话框
private void showDateDialog() {
    Calendar calendar = Calendar.getInstance();
    // 创建一个自定义的日期对话框实例
    CustomDateDialog dialog = new CustomDateDialog(this);
    // 设置日期对话框上面的年、月、日，并指定日期变更监听器
    dialog.setDate(calendar.get(Calendar.YEAR), calendar.get(Calendar.MONTH)
    ,calendar.get(Calendar.DAY_OF_MONTH), new DateListener());
    dialog.show(); // 显示日期对话框
}

// 定义一个日期变更监听器，一旦点击对话框的确定按钮，就触发监听器的onDateSet方法
private class DateListener implements CustomDateDialog.OnDateSetListener {
    @Override
    public void onDateSet(int year, int month, int day) {
        String desc = String.format("您选择的日期是%d年%d月%d日", year, month, day);
        Toast.makeText(MainActivity.this,desc,Toast.LENGTH_SHORT).show();
    }
}

当我们调用showDateDialog方法时，就会显示我们的日期选择器。而用户选择后点击确定，就会触发DateListener中的onDateSet方法。这里我们主要是关注第3步中的布局文件。我们可以对这个文件进行修改。如果我们仅仅只是修改布局，主题元素没有发生变化的话。只要保证tv_title(TextView)，dp_date(DatePicker)，btn_ok(Button)这三个id的控件正常存在，并且对应控件类型一致即可。其他元素可以随意放置。如果需要进行更多修改需要配合第4步中的CustomDateDialog进行修改。