Android 原生DatePicker的自定义用法

最近项目中要用到日期选择器,但是原生的DatePicker又不能满足UI的要求,

显然

1.原生的图多了上面的标题栏显示当前的日期,

2.原生的没有确定/取消按钮

3.原生的datepicker宽度固定,不能充满布局

4.原生的字体大小,字体颜色也有出入

原生:

UI:

所以我们要解决的问题就是:

1.在datePicker外包一层布局,将按钮放进去

2.需要隐藏头部标题

3.需要改变datePicker的宽度

4.需要改变字体颜色,字体大小

5.需要改变字体大小

1.在datePicker外包一层布局,将按钮放进去,

这个没有什么难度

<LinearLayout
  android:paddingTop="@dimen/x40"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:background="@drawable/all_bg"
  android:orientation="vertical">
  <FrameLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="center_vertical">
    <DatePicker
      android:id="@+id/datePicker"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:theme="@style/ThemeDateDialog"
      android:layout_gravity="center" />
  </FrameLayout>

  <View
    android:layout_width="match_parent"
    android:layout_height="@dimen/y2"
    android:background="#e6e6e6" />
  <LinearLayout
    android:layout_width="match_parent"
    android:layout_height="@dimen/y98"
    android:orientation="horizontal">
    <TextView
      android:id="@+id/cancel"
      android:layout_width="0dp"
      android:layout_height="match_parent"
      android:layout_weight="1"
      android:gravity="center"
      android:text="取消"
      android:textAppearance="@style/Text_color_999999_sp_28"
      android:textStyle="bold" />

    <View
      android:layout_width="@dimen/x2"
      android:layout_height="match_parent"
      android:background="#e6e6e6" />

    <TextView
      android:id="@+id/confirm"
      android:layout_width="0dp"
      android:layout_height="match_parent"
      android:layout_weight="1"
      android:gravity="center"
      android:text="确认"
      android:textAppearance="@style/Text_color_333333_sp_28"
      android:textStyle="bold" />
  </LinearLayout>
</LinearLayout>

2.需要隐藏头部标题,

这个是百度找到的方法,试了一下果然有用

//隐藏头部
ViewGroup mContainer = (ViewGroup) popupUpdateBinding.datePicker.getChildAt(0);
View header = mContainer.getChildAt(0);
header.setVisibility(View.GONE);

3.改变datePicker的宽度

改变宽度,就没有那么简单了,网上查了很久,试了各种方法都没有用

最终只能曲线救国,通过缩放datePicker来实现

int measuredWidth = popupUpdateBinding.datePicker.getMeasuredWidth();
float scaleX = (float) width / (float) measuredWidth;
popupUpdateBinding.datePicker.setScaleX(scaleX);
popupUpdateBinding.datePicker.setScaleY(scaleX);

4.需要改变字体颜色

 改变字体颜色很简单,只需要设置Theme

 <DatePicker
      android:id="@+id/datePicker"
      android:layout_width="wrap_content"
      android:layout_height="wrap_content"
      android:theme="@style/ThemeDateDialog"
      android:layout_gravity="center" />

<style name="ThemeDateDialog" parent="android:Theme.DeviceDefault.Light.Dialog">
  <!-- 初始化的那一天和选中时的圆圈的颜色-->
  <item name="android:colorControlActivated">#4D5588</item>
  <!-- 整个日历day字体的颜色-->
  <item name="android:textColorSecondary">#333333</item>
  <!-- 日历头部month/year字体的颜色，不可选的日期依然有置灰效果-->
  <item name="android:textColorPrimary">#333333</item>
</style>

5.需要改变字体大小

改变字体大小确实没有像样的方法,网上查了很久,试了各种方法都没有用

最终也只能曲线救国,通过调整弹框的scaleDensity来实现字体的调整

//弹出前,将字体scaledensity 设置为原始值,以正常显示datepicker
popupUpdateBinding.datePicker.getResources().getDisplayMetrics().scaledDensity =1.3f;


//弹框取消的时候,将字体scaledensity 恢复为适配值
popupUpdateBinding.datePicker.getResources().getDisplayMetrics().scaledDensity = 1.0f;
updateDialog.dismiss();