Android日期时间选择器实现以及自定义大小

Android⽇期时间选择器实现以及⾃定义⼤⼩
本⽂主要讲两个内容：1.如何将DatePicker和TimePicker放在⼀个dialog⾥⾯；2.改变他们的宽度；
问题1：其实现思路就是⾃定义⼀个Dialog，然后往⾥⾯同时放⼊DatePicker和TimePicker，直接贴代码：
date_time_picker.xml：
<LinearLayout xmlns:android="/apk/res/android"
xmlns:tools="/tools"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:orientation="horizontal" >
<!-- <DatePicker
android:id="@+id/new_act_date_picker"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="0.6"
android:calendarViewShown="false" />
<TimePicker
android:id="@+id/new_act_time_picker"
android:layout_width="0dip"
android:layout_height="wrap_content"
android:layout_weight="0.3"/> -->
<DatePicker
android:id="@+id/new_act_date_picker"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:calendarViewShown="false" />
<TimePicker
android:id="@+id/new_act_time_picker"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
然后在需要显⽰⽇期时间选择器的地⽅（⼀般是⼀个onClickListener中）实例化dialog：
DemoActivity.java
arriveAtBtn.setOnClickListener(new View.OnClickListener(){
@SuppressLint("NewApi")
@Override
public void onClick(View v) {
View view = View.inflate(getApplicationContext(), yout.date_time_picker, null);
final DatePicker datePicker = (DatePicker)view.findViewById(R.id.new_act_date_picker);
final TimePicker timePicker = (TimePicker)view.findViewById(R.id.new_act_time_picker);
// Init DatePicker
int year;
int month;
int day;
if (StringUtils.isEmpty(arriveDateBtn.getText().toString())) {
// Use the current date as the default date in the picker
final Calendar c = Calendar.getInstance();
year = c.get(Calendar.YEAR);
month = c.get(Calendar.MONTH);
day = c.get(Calendar.DAY_OF_MONTH);
} else {
year = NewActActivity.arrive_year;
month = NewActActivity.arrive_month;
day = NewActActivity.arrive_day;
}
datePicker.init(year, month, day, null);
// Init TimePicker
int hour;
int minute;
if (StringUtils.isEmpty(arriveTimeBtn.getText().toString())) {
// Use the current time as the default values for the picker
final Calendar c = Calendar.getInstance();
hour = c.get(Calendar.HOUR_OF_DAY);
minute = c.get(Calendar.MINUTE);
} else {
hour = NewActActivity.arrive_hour;
minute = NewActActivity.arrive_min;
}
timePicker.setIs24HourView(true);
timePicker.setCurrentHour(hour);
timePicker.setCurrentMinute(minute);
// Build DateTimeDialog
AlertDialog.Builder builder = new AlertDialog.Builder(NewActActivity.this);
builder.setView(view);
builder.setTitle(R.string.new_act_date_time_picker_title);
builder.setPositiveButton(android.R.string.ok, new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
arrive_year = datePicker.getYear();
arrive_month = datePicker.getMonth();
arrive_day = datePicker.getDayOfMonth();
String dateStr = DateUtil.formatDate(arrive_year, arrive_month, arrive_day);
arriveDateBtn.setText(dateStr);
arrive_hour = timePicker.getCurrentHour();
arrive_min = timePicker.getCurrentMinute();
String timeStr = DateUtil.formatTime(arrive_hour, arrive_min);
arriveTimeBtn.setText(timeStr);
}
});
builder.show();
}
});
这样就可以实现⽇期时间选择器了，这⾥就有点layout上的⼩问题，你是需要datepicker和timepicker⽔平排列还是竖直排列，竖直排列是没问题的：下⾯给出两个数值排列的效果图：
（1）DatePicker控件中设置android:calendarViewShown="false" 时的效果图：
（2）（1）DatePicker控件中设置android:spinnersShown="false" 时的效果图：
当然，如果你android:calendarViewShown和android:spinnersShown都不设置为false的话，会同时显⽰⽇历和滚动条样式，我想⼀般不会
有⼈想要这样的视图吧。

⽔平排列是有问题的，那就是屏幕太挤，两个控件显⽰不全，看看效果图：
可是有⼈就是有⽔平排列的需求怎么办？这就是本⽂要讲的第⼆个问题：改变datepicker和timepicker的宽度。

⽹上找了很久，没有发现很有效的⽅法，说是这两个控件的⼦元素的宽度是不能⾃定义的，实际上把控件的所有属性看了⼀遍，也确实没有发现相关的属性；有⼈是通过⾃定义DatePicker和TimePicker来实现的，找了个demo，确实是实现了，不过已经相当于是⾃⼰写了⼀个插件了，我嫌⿇烦，加之稳定性⽅⾯的考虑，没有去⽤，不过我会在最后把这个demo的src带上，有需要的⼈可以⾃⼰下载来研究。

难道真不能改宽度吗？突然想到我是不是能从代码中的datePicker对象⼀步步往下找到其child，直接改child的宽度呢，于是debug，果然通过这种⽅式成功改变了宽度值，代码如下，只要在DemoActivity.java中增加⼀块专门⽤于实现改宽度的代码就⾏：
DemoActivity.java：
arriveAtBtn.setOnClickListener(new View.OnClickListener(){
@SuppressLint("NewApi")
@Override
public void onClick(View v) {
View view = View.inflate(getApplicationContext(), yout.date_time_picker, null);
final DatePicker datePicker = (DatePicker)view.findViewById(R.id.new_act_date_picker);
final TimePicker timePicker = (TimePicker)view.findViewById(R.id.new_act_time_picker);
// Change DatePicker layout
LinearLayout dpContainer = (LinearLayout)datePicker.getChildAt(0) ; // LinearLayout
LinearLayout dpSpinner = (LinearLayout)dpContainer.getChildAt(0); // 0 : LinearLayout; 1 : CalendarView
for(int i = 0; i < dpSpinner.getChildCount(); i ++) {
NumberPicker numPicker = (NumberPicker)dpSpinner.getChildAt(i); // 0-2 : NumberPicker
LayoutParams params1 = new LayoutParams(120, LayoutParams.WRAP_CONTENT);
params1.leftMargin = 0;
params1.rightMargin = 30;
numPicker.setLayoutParams(params1);
// EditText cusET = (EditText)numPicker.getChildAt(0); // CustomEditText
// cusET.setTextSize(14);
// cusET.setWidth(70);
}
// Change TimePicker layout
LinearLayout tpContainer = (LinearLayout)timePicker.getChildAt(0) ; // LinearLayout
LinearLayout tpSpinner = (LinearLayout)tpContainer.getChildAt(0); // 0 : LinearLayout; 1 : CalendarView
for(int i = 0; i < tpSpinner.getChildCount(); i ++) {
// child(1) is a TextView ( : )
if (i == 1) {
continue;
}
NumberPicker numPicker = (NumberPicker)tpSpinner.getChildAt(i); // 0 : NumberPicker; 1 : TextView; 2 : NumberPicker
LayoutParams params3 = new LayoutParams(100, LayoutParams.WRAP_CONTENT);
params3.leftMargin = 0;
params3.rightMargin = 30;
numPicker.setLayoutParams(params3);
// EditText cusET = (EditText)numPicker.getChildAt(0); // CustomEditText
// cusET.setTextSize(14);
// cusET.setWidth(70);
}
// Init DatePicker
int year;
int month;
int day;
if (StringUtils.isEmpty(arriveDateBtn.getText().toString())) {
// Use the current date as the default date in the picker
final Calendar c = Calendar.getInstance();
year = c.get(Calendar.YEAR);
month = c.get(Calendar.MONTH);
day = c.get(Calendar.DAY_OF_MONTH);
} else {
year = NewActActivity.arrive_year;
month = NewActActivity.arrive_month;
day = NewActActivity.arrive_day;
}
datePicker.init(year, month, day, null);
// Init TimePicker
int hour;
int minute;
if (StringUtils.isEmpty(arriveTimeBtn.getText().toString())) {
// Use the current time as the default values for the picker
final Calendar c = Calendar.getInstance();
hour = c.get(Calendar.HOUR_OF_DAY);
minute = c.get(Calendar.MINUTE);
} else {
hour = NewActActivity.arrive_hour;
minute = NewActActivity.arrive_min;
}
timePicker.setIs24HourView(true);
timePicker.setCurrentHour(hour);
timePicker.setCurrentMinute(minute);
// Build DateTimeDialog
AlertDialog.Builder builder = new AlertDialog.Builder(NewActActivity.this);
builder.setView(view);
builder.setTitle(R.string.new_act_date_time_picker_title);
builder.setPositiveButton(android.R.string.ok, new DialogInterface.OnClickListener() {
@Override
public void onClick(DialogInterface dialog, int which) {
arrive_year = datePicker.getYear();
arrive_month = datePicker.getMonth();
arrive_day = datePicker.getDayOfMonth();
String dateStr = DateUtil.formatDate(arrive_year, arrive_month, arrive_day);
arriveDateBtn.setText(dateStr);
arrive_hour = timePicker.getCurrentHour();
arrive_min = timePicker.getCurrentMinute();
String timeStr = DateUtil.formatTime(arrive_hour, arrive_min);
arriveTimeBtn.setText(timeStr);
}
});
builder.show();
}
});
通过这种⽅式实现的效果图如下：
其实这种⽅法也有问题：我的⼿机是1080P（5.5⼨）的屏，显⽰效果是这样，如果屏幕⼩点，分辨率更低的屏呢，很可能屏幕宽度不够显⽰，当然你可以修改⼀下上⾯代码的逻辑，根据屏幕⼤⼩来动态设置控件的宽度值，⽽不是设成定值，具体的这些细节按⾃⼰的需求来做吧，我这⾥只是想记录⼀下⾃⼰发现的这种改变datepicker和timepicker宽度的⽅法，⾄于是否实⽤，我不负责，我只当是学习⼀下android。

不过我的项⽬⾥最终没有⽤这个⽅案，最终选择了垂直排列的⽇历格式那个⽅案。

最后附上别⼈实现的⾃定义DatePicker和TimePicker（MyPicker）
(120 KB)。