下邳桥下

我在坯桥上，千古钦英风
  博客园  :: 首页  :: 新随笔  :: 联系 :: 订阅 订阅  :: 管理
安卓开发中的双日期选择控件（可隐藏日，只显示年月）

在安卓开发中，会碰到选开始日期和结束日期的问题。特别是在使用Pad时，如果弹出一个Dialog，能够同时选择开始日期和结束日期，那将是极好的。我在开发中在DatePickerDialog的基础上做了修改，实现了这种Dialog。效果如下：

具体实现方法为：

先新建一个安卓项目DoubleDatePicker，在res/layout文件夹下新建date_picker_dialog.xml，内容如下：

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 3     android:layout_width="wrap_content"
 4     android:layout_height="wrap_content"
 5     android:gravity="center_horizontal"
 6     android:orientation="horizontal"
 7     android:paddingTop="10dp" >
 8 
 9     <LinearLayout
10         android:layout_width="wrap_content"
11         android:layout_height="wrap_content"
12         android:gravity="center_horizontal"
13         android:orientation="vertical"
14         android:padding="5dip" >
15 
16         <TextView
17             android:layout_width="wrap_content"
18             android:layout_height="wrap_content"
19             android:text="开始日期" />
20 
21         <DatePicker
22             android:id="@+id/datePickerStart"
23             android:layout_width="wrap_content"
24             android:layout_height="wrap_content"
25             android:calendarViewShown="false" />
26     </LinearLayout>
27 
28     <ImageView
29         android:layout_width="wrap_content"
30         android:layout_height="fill_parent"
31         android:src="@drawable/fenge" />
32 
33     <LinearLayout
34         android:layout_width="wrap_content"
35         android:layout_height="wrap_content"
36         android:gravity="center_horizontal"
37         android:orientation="vertical"
38         android:padding="5dip" >
39 
40         <TextView
41             android:layout_width="wrap_content"
42             android:layout_height="wrap_content"
43             android:text="结束日期" />
44 
45         <DatePicker
46             android:id="@+id/datePickerEnd"
47             android:layout_width="wrap_content"
48             android:layout_height="wrap_content"
49             android:calendarViewShown="false" />
50     </LinearLayout>
51 
52 </LinearLayout>

然后，在src的 默认包下新建文件DoubleDatePickerDialog.java，内容如下：

  1 /*
  2  * Copyright (C) 2007 The Android Open Source Project
  3  *
  4  * Licensed under the Apache License, Version 2.0 (the "License");
  5  * you may not use this file except in compliance with the License.
  6  * You may obtain a copy of the License at
  7  *
  8  *      http://www.apache.org/licenses/LICENSE-2.0
  9  *
 10  * Unless required by applicable law or agreed to in writing, software
 11  * distributed under the License is distributed on an "AS IS" BASIS,
 12  * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 13  * See the License for the specific language governing permissions and
 14  * limitations under the License.
 15  */
 16 
 17 package com.example.doubledatepicker;
 18 
 19 import java.lang.reflect.Field;
 20 
 21 import android.app.AlertDialog;
 22 import android.content.Context;
 23 import android.content.DialogInterface;
 24 import android.content.DialogInterface.OnClickListener;
 25 import android.os.Bundle;
 26 import android.view.LayoutInflater;
 27 import android.view.View;
 28 import android.widget.DatePicker;
 29 import android.widget.DatePicker.OnDateChangedListener;
 30 
 31 /**
 32  * A simple dialog containing an {@link android.widget.DatePicker}.
 33  *
 34  * <p>
 35  * See the <a href="{@docRoot}guide/topics/ui/controls/pickers.html">Pickers</a>
 36  * guide.
 37  * </p>
 38  */
 39 public class DoubleDatePickerDialog extends AlertDialog implements OnClickListener, OnDateChangedListener {
 40 
 41     private static final String START_YEAR = "start_year";
 42     private static final String END_YEAR = "end_year";
 43     private static final String START_MONTH = "start_month";
 44     private static final String END_MONTH = "end_month";
 45     private static final String START_DAY = "start_day";
 46     private static final String END_DAY = "end_day";
 47 
 48     private final DatePicker mDatePicker_start;
 49     private final DatePicker mDatePicker_end;
 50     private final OnDateSetListener mCallBack;
 51 
 52     /**
 53      * The callback used to indicate the user is done filling in the date.
 54      */
 55     public interface OnDateSetListener {
 56 
 57         /**
 58          * @param view
 59          *            The view associated with this listener.
 60          * @param year
 61          *            The year that was set.
 62          * @param monthOfYear
 63          *            The month that was set (0-11) for compatibility with
 64          *            {@link java.util.Calendar}.
 65          * @param dayOfMonth
 66          *            The day of the month that was set.
 67          */
 68         void onDateSet(DatePicker startDatePicker, int startYear, int startMonthOfYear, int startDayOfMonth,
 69                 DatePicker endDatePicker, int endYear, int endMonthOfYear, int endDayOfMonth);
 70     }
 71 
 72     /**
 73      * @param context
 74      *            The context the dialog is to run in.
 75      * @param callBack
 76      *            How the parent is notified that the date is set.
 77      * @param year
 78      *            The initial year of the dialog.
 79      * @param monthOfYear
 80      *            The initial month of the dialog.
 81      * @param dayOfMonth
 82      *            The initial day of the dialog.
 83      */
 84     public DoubleDatePickerDialog(Context context, OnDateSetListener callBack, int year, int monthOfYear, int dayOfMonth) {
 85         this(context, 0, callBack, year, monthOfYear, dayOfMonth);
 86     }
 87 
 88     public DoubleDatePickerDialog(Context context, int theme, OnDateSetListener callBack, int year, int monthOfYear,
 89             int dayOfMonth) {
 90         this(context, 0, callBack, year, monthOfYear, dayOfMonth, true);
 91     }
 92 
 93     /**
 94      * @param context
 95      *            The context the dialog is to run in.
 96      * @param theme
 97      *            the theme to apply to this dialog
 98      * @param callBack
 99      *            How the parent is notified that the date is set.
100      * @param year
101      *            The initial year of the dialog.
102      * @param monthOfYear
103      *            The initial month of the dialog.
104      * @param dayOfMonth
105      *            The initial day of the dialog.
106      */
107     public DoubleDatePickerDialog(Context context, int theme, OnDateSetListener callBack, int year, int monthOfYear,
108             int dayOfMonth, boolean isDayVisible) {
109         super(context, theme);
110 
111         mCallBack = callBack;
112 
113         Context themeContext = getContext();
114         setButton(BUTTON_POSITIVE, "确 定", this);
115         setButton(BUTTON_NEGATIVE, "取 消", this);
116         // setButton(BUTTON_POSITIVE,
117         // themeContext.getText(android.R.string.date_time_done), this);
118         setIcon(0);
119 
120         LayoutInflater inflater = (LayoutInflater) themeContext.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
121         View view = inflater.inflate(R.layout.date_picker_dialog, null);
122         setView(view);
123         mDatePicker_start = (DatePicker) view.findViewById(R.id.datePickerStart);
124         mDatePicker_end = (DatePicker) view.findViewById(R.id.datePickerEnd);
125         mDatePicker_start.init(year, monthOfYear, dayOfMonth, this);
126         mDatePicker_end.init(year, monthOfYear, dayOfMonth, this);
127         // updateTitle(year, monthOfYear, dayOfMonth);
128 
129         // 如果要隐藏当前日期，则使用下面方法。
130         if (!isDayVisible) {
131             hidDay(mDatePicker_start);
132             hidDay(mDatePicker_end);
133         }
134     }
135 
136     /**
137      * 隐藏DatePicker中的日期显示
138      * 
139      * @param mDatePicker
140      */
141     private void hidDay(DatePicker mDatePicker) {
142         Field[] datePickerfFields = mDatePicker.getClass().getDeclaredFields();
143         for (Field datePickerField : datePickerfFields) {
144             if ("mDaySpinner".equals(datePickerField.getName())) {
145                 datePickerField.setAccessible(true);
146                 Object dayPicker = new Object();
147                 try {
148                     dayPicker = datePickerField.get(mDatePicker);
149                 } catch (IllegalAccessException e) {
150                     e.printStackTrace();
151                 } catch (IllegalArgumentException e) {
152                     e.printStackTrace();
153                 }
154                 // datePicker.getCalendarView().setVisibility(View.GONE);
155                 ((View) dayPicker).setVisibility(View.GONE);
156             }
157         }
158     }
159 
160     public void onClick(DialogInterface dialog, int which) {
161         // Log.d(this.getClass().getSimpleName(), String.format("which:%d",
162         // which));
163         // 如果是“取 消”按钮，则返回，如果是“确 定”按钮，则往下执行
164         if (which == BUTTON_POSITIVE)
165             tryNotifyDateSet();
166     }
167 
168     @Override
169     public void onDateChanged(DatePicker view, int year, int month, int day) {
170         if (view.getId() == R.id.datePickerStart)
171             mDatePicker_start.init(year, month, day, this);
172         if (view.getId() == R.id.datePickerEnd)
173             mDatePicker_end.init(year, month, day, this);
174         // updateTitle(year, month, day);
175     }
176 
177     /**
178      * 获得开始日期的DatePicker
179      *
180      * @return The calendar view.
181      */
182     public DatePicker getDatePickerStart() {
183         return mDatePicker_start;
184     }
185 
186     /**
187      * 获得结束日期的DatePicker
188      *
189      * @return The calendar view.
190      */
191     public DatePicker getDatePickerEnd() {
192         return mDatePicker_end;
193     }
194 
195     /**
196      * Sets the start date.
197      *
198      * @param year
199      *            The date year.
200      * @param monthOfYear
201      *            The date month.
202      * @param dayOfMonth
203      *            The date day of month.
204      */
205     public void updateStartDate(int year, int monthOfYear, int dayOfMonth) {
206         mDatePicker_start.updateDate(year, monthOfYear, dayOfMonth);
207     }
208 
209     /**
210      * Sets the end date.
211      *
212      * @param year
213      *            The date year.
214      * @param monthOfYear
215      *            The date month.
216      * @param dayOfMonth
217      *            The date day of month.
218      */
219     public void updateEndDate(int year, int monthOfYear, int dayOfMonth) {
220         mDatePicker_end.updateDate(year, monthOfYear, dayOfMonth);
221     }
222 
223     private void tryNotifyDateSet() {
224         if (mCallBack != null) {
225             mDatePicker_start.clearFocus();
226             mDatePicker_end.clearFocus();
227             mCallBack.onDateSet(mDatePicker_start, mDatePicker_start.getYear(), mDatePicker_start.getMonth(),
228                     mDatePicker_start.getDayOfMonth(), mDatePicker_end, mDatePicker_end.getYear(),
229                     mDatePicker_end.getMonth(), mDatePicker_end.getDayOfMonth());
230         }
231     }
232 
233     @Override
234     protected void onStop() {
235         // tryNotifyDateSet();
236         super.onStop();
237     }
238 
239     @Override
240     public Bundle onSaveInstanceState() {
241         Bundle state = super.onSaveInstanceState();
242         state.putInt(START_YEAR, mDatePicker_start.getYear());
243         state.putInt(START_MONTH, mDatePicker_start.getMonth());
244         state.putInt(START_DAY, mDatePicker_start.getDayOfMonth());
245         state.putInt(END_YEAR, mDatePicker_end.getYear());
246         state.putInt(END_MONTH, mDatePicker_end.getMonth());
247         state.putInt(END_DAY, mDatePicker_end.getDayOfMonth());
248         return state;
249     }
250 
251     @Override
252     public void onRestoreInstanceState(Bundle savedInstanceState) {
253         super.onRestoreInstanceState(savedInstanceState);
254         int start_year = savedInstanceState.getInt(START_YEAR);
255         int start_month = savedInstanceState.getInt(START_MONTH);
256         int start_day = savedInstanceState.getInt(START_DAY);
257         mDatePicker_start.init(start_year, start_month, start_day, this);
258 
259         int end_year = savedInstanceState.getInt(END_YEAR);
260         int end_month = savedInstanceState.getInt(END_MONTH);
261         int end_day = savedInstanceState.getInt(END_DAY);
262         mDatePicker_end.init(end_year, end_month, end_day, this);
263 
264     }
265 }

这些代码是以DatePickerDialog.java为基础修改的。总的来说，阅读源码是一种好习惯。这里面最需要注意的是hidDay方法，该方法如果调用，则隐藏“日”的选择框，只能选择“年月”。这个方法的实现也比较有难度，需要通过反射，找出DatePicker中表示日的字段，并将其设置为隐藏。

还有一点需要注意的是，为了让控件显示更加好看，我用了一张名字为fenge.png的图片，图片在我提供的源码中可以找到。

下面就需要编辑activity_main.xml了，这个内容相当简单，只要一个显示的text和一个button即可，代码如下：

 1 <?xml version="1.0" encoding="utf-8"?>
 2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 3     android:id="@+id/LinearLayout01"
 4     android:layout_width="fill_parent"
 5     android:layout_height="fill_parent"
 6     android:orientation="vertical" >
 7 
 8     <EditText
 9         android:id="@+id/et"
10         android:layout_width="fill_parent"
11         android:layout_height="wrap_content"
12         android:cursorVisible="false"
13         android:editable="false" />
14 
15     <Button
16         android:id="@+id/dateBtn"
17         android:layout_width="fill_parent"
18         android:layout_height="wrap_content"
19         android:text="日期对话框" />
20 
21 </LinearLayout>

最后，在MainActivity.java中，加入测试代码：

 1 package com.example.doubledatepicker;
 2 
 3 import java.util.Calendar;
 4 
 5 import android.app.Activity;
 6 import android.os.Bundle;
 7 import android.view.View;
 8 import android.widget.Button;
 9 import android.widget.DatePicker;
10 import android.widget.TextView;
11 
12 public class MainActivity extends Activity {
13 
14     Button btn;
15     TextView et;
16 
17     @Override
18     protected void onCreate(Bundle savedInstanceState) {
19         super.onCreate(savedInstanceState);
20         setContentView(R.layout.activity_main);
21 
22         btn = (Button) findViewById(R.id.dateBtn);
23         et = (TextView) findViewById(R.id.et);
24 
25         btn.setOnClickListener(new View.OnClickListener() {
26             Calendar c = Calendar.getInstance();
27 
28             @Override
29             public void onClick(View v) {
30                 // 最后一个false表示不显示日期，如果要显示日期，最后参数可以是true或者不用输入
31                 new DoubleDatePickerDialog(MainActivity.this, 0, new DoubleDatePickerDialog.OnDateSetListener() {
32 
33                     @Override
34                     public void onDateSet(DatePicker startDatePicker, int startYear, int startMonthOfYear,
35                             int startDayOfMonth, DatePicker endDatePicker, int endYear, int endMonthOfYear,
36                             int endDayOfMonth) {
37                         String textString = String.format("开始时间：%d-%d-%d\n结束时间：%d-%d-%d\n", startYear,
38                                 startMonthOfYear + 1, startDayOfMonth, endYear, endMonthOfYear + 1, endDayOfMonth);
39                         et.setText(textString);
40                     }
41                 }, c.get(Calendar.YEAR), c.get(Calendar.MONTH), c.get(Calendar.DATE), true).show();
42             }
43         });
44     }
45 }

可以看到，在新建DoubleDatePickerDialog时， 我们实现了一个new DoubleDatePickerDialog.OnDateSetListener()的匿名类，这个类被DoubleDatePickerDialog引用，当DoubleDatePickerDialog中的“确 定”按钮被点击时，就会调用匿名类的onDateSet方法。（这也是事件绑定的基本原理）。

DoubleDatePickerDialog构造函数的最后一个参数，true为显示日期，false为不显示日期。

当最后一个参数为true时，显示效果如下：

当最后一个参数为false时，显示如下

 

源码下载地址：https://github.com/jilianggqq/DoubleDatePicker

 

posted on 2014-12-03 11:28  下邳桥下  阅读(81113)  评论(4)  编辑  收藏  举报