Android--UI之DatePicker、TimePicker...

简介:

前言

  这一篇博客分别讲解Android平台下,关于日期和时间的几个相关控件。包括DatePicker(日期选择控件)、TimePicker(时间选择控件)、DatePickerDialog(日期选择对话框)、TimePickerDialog(时间选择对话框)、AnalogClock(模拟时钟控件)、DigitalClock(数字时钟控件)。对于时间控件,无非就是一个展示、修改、获取等操作,下面一一讲解。

 

DatePicker、TimePicker

  DatePickerTimePicker都继承自android.widget.FrameLayout,并且默认展示风格、与操作风格也类似。DatePicker用于展示一个日期选择控件,TimePicker用于展示一个时间选择控件。

  作为一个日期选择控件,DatePicker可以通过设置属性来确定日期选择范围,也可以通过定义好的方法获取到当前选中的时间,并且在修改日期的时候,有响应的事件对其进行响应。

  DatePicker常用相关属性:

  • android:calendarViewShown:是否显示日历。
  • android:startYear:设置可选开始年份。
  • android:endYear:设置可选结束年份。
  • android:maxDate:设置可选最大日期,以mm/dd/yyyy格式设置。
  • android:minDate:设置可选最小日期,以mm/dd/yyyy格式设置。

  DatePicker的方法而言,除了常用获取属性的setter、getter方法之外,还需要特别注意一个初始化的方法init()方法,用于做DatePicker控件的初始化,并且设置日期被修改后,回调的响应事件。此方法的签名如下:

   init(int year, int monthOfYear, int dayOfMonth, DatePicker.OnDateChangedListener onDateChangedListener)

  从上面的init()方法可以看到,DatePicker被修改时响应的事件是DatePicker.OnDateChangedListener事件,如果要响应此事件,需要实现其中的onDateChanged()方法,其中参数从签名即可了解意思,这里不再累述。

   onDateChanged(DatePicker view, int year, int monthOfYear, int dayOfMonth)

 

  作为一个时间选择控件来说,TimePicker需要与时间相关的getter、setter方法之外,还需要有时间被修改够,回调的响应事件。

  TimePicker常用方法有如下几个:

  • is24HourView():判断是否为24小时制。
  • setIs24HourView():设置是否为24小时制显示。
  • getCurrentXxx():获取当前时间。
  • setCurrentXxx():设置当前时间。
  • setOnTimeChangedListener():设置时间被修改的回调方法。

  TimePicker控件被修改的回调方法,通过setOnTimeChangedListener()方法设置,其传递一个TimePicker.OnTimeChangedListener接口,需要实现其中的onTimeChanged()方法。

  

   下面通过一个示例来讲解这两个控件的使用,在示例中分别展示了这两个控件,并在其修改之后,把修改值通过Toast的方式展示到屏幕上。

  布局代码:

复制代码
 1 <?xml version="1.0" encoding="utf-8"?>
 2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 3     android:layout_width="match_parent"
 4     android:layout_height="match_parent"
 5     android:orientation="vertical" >
 6 
 7     <DatePicker
 8         android:id="@+id/dpPicker"
 9         android:calendarViewShown="false"
10         android:layout_width="match_parent"
11         android:layout_height="wrap_content" />
12 
13     <TimePicker
14         android:id="@+id/tpPicker"
15         android:layout_width="match_parent"
16         android:layout_height="wrap_content" />
17 
18 
19 </LinearLayout>
复制代码

  实现代码: 

复制代码
 1 package com.bgxt.datatimepickerdemo;
 2 
 3 import java.text.SimpleDateFormat;
 4 import java.util.Calendar;
 5 
 6 import android.app.Activity;
 7 import android.os.Bundle;
 8 import android.widget.DatePicker;
 9 import android.widget.DatePicker.OnDateChangedListener;
10 import android.widget.TextView;
11 import android.widget.TimePicker;
12 import android.widget.Toast;
13 
14 public class DataTimePicker extends Activity {
15     private DatePicker datePicker;
16     private TimePicker timePicker;
17 
18     @Override
19     protected void onCreate(Bundle savedInstanceState) {
20         super.onCreate(savedInstanceState);
21         setContentView(R.layout.activity_datatimepicker);
22 
23         datePicker = (DatePicker) findViewById(R.id.dpPicker);
24         timePicker = (TimePicker) findViewById(R.id.tpPicker);
25 
26         datePicker.init(2013, 8, 20, new OnDateChangedListener() {
27 
28             @Override
29             public void onDateChanged(DatePicker view, int year,
30                     int monthOfYear, int dayOfMonth) {
31                 // 获取一个日历对象,并初始化为当前选中的时间
32                 Calendar calendar = Calendar.getInstance();
33                 calendar.set(year, monthOfYear, dayOfMonth);
34                 SimpleDateFormat format = new SimpleDateFormat(
35                         "yyyy年MM月dd日  HH:mm");
36                 Toast.makeText(DataTimePicker.this,
37                         format.format(calendar.getTime()), Toast.LENGTH_SHORT)
38                         .show();
39             }
40         });
41 
42         timePicker.setIs24HourView(true);
43         timePicker
44                 .setOnTimeChangedListener(new TimePicker.OnTimeChangedListener() {
45                     @Override
46                     public void onTimeChanged(TimePicker view, int hourOfDay,
47                             int minute) {
48                         Toast.makeText(DataTimePicker.this,
49                                 hourOfDay + "小时" + minute + "分钟",
50                                 Toast.LENGTH_SHORT).show();
51                     }
52                 });
53 
54     }
55 }
复制代码

  效果展示:

 

DatePickerDialog、TimePickerDialog

  DatePickerDialogTimePickerDialog是两个对话框控件,一个弹出对话框用于选择日期,一个弹出对话框用于选择时间,都继承自android.app.AlertDialog。

  这两个控件的开发过程,其主要就是开发其选择后日期或时间后,相应的事件。

  对于DatePickeDialog而言,通过构造函数可以设置弹出的日期控件的初始值,并且可以指定选中日期后,回调事件的实现,构造函数的签名如下:

    DatePickerDialog(Context context, DatePickerDialog.OnDateSetListener callBack, int year, int monthOfYear, int dayOfMonth)

  其中DatePickerDialog.OnDateSetListener为日期选中的响应事件,其他为日期弹出窗口初始化的日期,对于一个OnDateSetListener接口而言,需要实现其中的onDateSet()方法,在这个方法内,可以得到用户选中的日期。

  对于TimePickerDialog而言,同样可以通过构造函数设置初始值,并且设定选中日期后,回调事件的实现,构造函数的签名如下:

    TimePickerDialog(Context context, TimePickerDialog.OnTimeSetListener callBack, int hourOfDay, int minute, boolean is24HourView)

  其中TimePickerDialog.OnTimeSetListener为时间选中的响应事件,其他为时间弹出窗口初始化的时间,对于一个OnTimeSetListener接口而言,需要实现其中的onTimeSet()方法,在这个方法内,可以得到用户选中的时间。

 

AnalogClock、DigitalClock

   AnalogClockDigitalClock为两个时间展示控件,切只是展示的风格不同而已,没有什么太大的区别。有一点值得注意的就是,这两个控件展示的时间是无法修改的,仅为系统当前时间。看示例就能明白,没什么好详细说的。

  下面通过一个例子说明一下DatePickerDialog、TimePickerDialog、AnalogClock、DigitalClock四个控件的使用。

  布局代码:

复制代码
 1 <?xml version="1.0" encoding="utf-8"?>
 2 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 3     android:layout_width="match_parent"
 4     android:layout_height="match_parent"
 5     android:orientation="vertical" >
 6 
 7     <TextView
 8         android:layout_width="fill_parent"
 9         android:layout_height="wrap_content"
10         android:text="指针时钟:" />
11 
12     <AnalogClock
13         android:layout_width="fill_parent"
14         android:layout_height="wrap_content" />
15 
16     <TextView
17         android:layout_width="fill_parent"
18         android:layout_height="wrap_content"
19         android:text="数字时钟:" />
20 
21     <DigitalClock
22         android:layout_width="fill_parent"
23         android:layout_height="wrap_content"
24         android:textSize="20dp" />
25     <Button
26         android:id="@+id/btnTimePickerDialog"
27         android:layout_width="fill_parent"
28         android:layout_height="wrap_content"
29         android:text="Show TimePickerDialog"
30          />
31     <Button
32         android:id="@+id/btnDatePickerDialog"
33         android:layout_width="fill_parent"
34         android:layout_height="wrap_content"
35         android:text="Show DatePickerDialog"
36          />
37 </LinearLayout>
复制代码

  

  实现代码:

复制代码
 1 package com.bgxt.datatimepickerdemo;
 2 
 3 import android.app.Activity;
 4 import android.app.DatePickerDialog;
 5 import android.app.DatePickerDialog.OnDateSetListener;
 6 import android.app.TimePickerDialog;
 7 import android.app.TimePickerDialog.OnTimeSetListener;
 8 import android.os.Bundle;
 9 import android.view.View;
10 import android.view.View.OnClickListener;
11 import android.widget.Button;
12 import android.widget.DatePicker;
13 import android.widget.TimePicker;
14 import android.widget.Toast;
15 
16 public class AnalogDigitalClock extends Activity implements OnClickListener {
17     private Button btnDate, btnTime;
18 
19     @Override
20     protected void onCreate(Bundle savedInstanceState) {
21         super.onCreate(savedInstanceState);
22         setContentView(R.layout.activity_anologdigital);
23         btnDate = (Button) findViewById(R.id.btnDatePickerDialog);
24         btnTime = (Button) findViewById(R.id.btnTimePickerDialog);
25         btnDate.setOnClickListener(this);
26         btnTime.setOnClickListener(this);
27     }
28 
29     @Override
30     public void onClick(View v) {
31         switch (v.getId()) {
32         case R.id.btnDatePickerDialog:
33             DatePickerDialog datePicker=new DatePickerDialog(AnalogDigitalClock.this, new OnDateSetListener() {
34                 
35                 @Override
36                 public void onDateSet(DatePicker view, int year, int monthOfYear,
37                         int dayOfMonth) {
38                     // TODO Auto-generated method stub
39                     Toast.makeText(AnalogDigitalClock.this, year+"year "+(monthOfYear+1)+"month "+dayOfMonth+"day", Toast.LENGTH_SHORT).show();
40                 }
41             }, 2013, 7, 20);
42             datePicker.show();
43             break;
44 
45         case R.id.btnTimePickerDialog:
46             TimePickerDialog time=new TimePickerDialog(AnalogDigitalClock.this, new OnTimeSetListener() {
47                 
48                 @Override
49                 public void onTimeSet(TimePicker view, int hourOfDay, int minute) {
50                     // TODO Auto-generated method stub
51                     Toast.makeText(AnalogDigitalClock.this, hourOfDay+"hour "+minute+"minute", Toast.LENGTH_SHORT).show();
52                 }
53             }, 18, 25, true);
54             time.show();
55             break;
56         }
57 
58     }
59 }
复制代码

  效果展示:

  源码下载

总结

   以上就讲解了在Android平台下,几个与时间相关的控件,没有什么特别的,注意设置与响应事件即可。


本文转自承香墨影博客园博客,原文链接:http://www.cnblogs.com/plokmju/p/android_DatePiceker.html,如需转载请自行联系原作者


相关文章
|
9月前
|
前端开发
element-ui组件DatePicker日期选择器移动端兼容
element-ui组件DatePicker日期选择器移动端兼容
element-ui组件DatePicker日期选择器移动端兼容
|
JavaScript
vue element-ui (DatePicker)日期选择器获取开始时间和结束时间-均为yyyy-MM-dd 格式
vue element-ui (DatePicker)日期选择器获取开始时间和结束时间-均为yyyy-MM-dd 格式
529 0
|
JavaScript
关于Element-Ui 时间范围选择器DatePicker禁用范围日期问题
饿了么组件库的[DatePicker](https://element.eleme.cn/#/zh-CN/component/date-picker) 日期范围选择,
|
Java Android开发
【安卓开发】Android中日期选择器DatePicker和TimePicker的使用
【安卓开发】Android中日期选择器DatePicker和TimePicker的使用
961 0
【安卓开发】Android中日期选择器DatePicker和TimePicker的使用
|
iOS开发
iOS开发UI篇—Date Picker和UITool Bar控件简单介绍
iOS开发UI篇—Date Picker和UITool Bar控件简单介绍 一、Date Picker控件 1.简单介绍: Date Picker显示时间的控件 有默认宽高,不用设置数据源和代理 如何改成中文的? (1)查看当前系统是否为中文的,把模拟器改成是中文的 (2)属性,locale选择地区 如果默认显示不符合需求。
789 0
|
Android开发
Android DatePicker
前言 话说日期时间选择控件许多项目都会用到,今天小可不才,也发一个自己写的日期选择控件 先上图 CC8V2$(JPZ`{WT42ICK7F}K.png demo.gif 1、首先自定义日期选择工具类 里面注释比较详细,我就不在这里一一赘述了。
792 0
swift UI专项训练28 DatePicker日期老虎机
    如果你设置过iPhone中的日期,那么你对日期老虎机一定不陌生。它的基类是UIDatePicker。
1112 0

热门文章

最新文章

  • 1
    用自然语言控制电脑,字节跳动开源 UI-TARS 的桌面版应用!内附详细的安装和配置教程
  • 2
    UI-TARS:字节跳动开源专注于多平台 GUI 自动化交互的视觉语言模型
  • 3
    【11】flutter进行了聊天页面的开发-增加了即时通讯聊天的整体页面和组件-切换-朋友-陌生人-vip开通详细页面-即时通讯sdk准备-直播sdk准备-即时通讯有无UI集成的区别介绍-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
  • 4
    移动端UI名词 - AxureMost
  • 5
    【02】Java+若依+vue.js技术栈实现钱包积分管理系统项目-商业级电玩城积分系统商业项目实战-ui设计图figmaUI设计准备-figma汉化插件-mysql数据库设计-优雅草卓伊凡商业项目实战
  • 6
    unity判断鼠标在不在UI上
  • 7
    如何修复 Android 和 Windows 不支持视频编解码器的问题?
  • 8
    Android历史版本与APK文件结构
  • 9
    【08】flutter完成屏幕适配-重建Android,增加GetX路由,屏幕适配,基础导航栏-多版本SDK以及gradle造成的关于fvm的使用(flutter version manage)-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
  • 10
    【04】flutter补打包流程的签名过程-APP安卓调试配置-结构化项目目录-完善注册相关页面-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程
  • 1
    Cellebrite UFED 4PC 7.71 (Windows) - Android 和 iOS 移动设备取证软件
    24
  • 2
    【03】仿站技术之python技术,看完学会再也不用去购买收费工具了-修改整体页面做好安卓下载发给客户-并且开始提交网站公安备案-作为APP下载落地页文娱产品一定要备案-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
    32
  • 3
    Android历史版本与APK文件结构
    120
  • 4
    【02】仿站技术之python技术,看完学会再也不用去购买收费工具了-本次找了小影-感觉页面很好看-本次是爬取vue需要用到Puppeteer库用node.js扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-优雅草卓伊凡
    27
  • 5
    【01】仿站技术之python技术,看完学会再也不用去购买收费工具了-用python扒一个app下载落地页-包括安卓android下载(简单)-ios苹果plist下载(稍微麻烦一丢丢)-客户的麻将软件需要下载落地页并且要做搜索引擎推广-本文用python语言快速开发爬取落地页下载-优雅草卓伊凡
    23
  • 6
    APP-国内主流安卓商店-应用市场-鸿蒙商店上架之必备前提·全国公安安全信息评估报告如何申请-需要安全评估报告的资料是哪些-优雅草卓伊凡全程操作
    56
  • 7
    【09】flutter首页进行了完善-采用android studio 进行真机调试开发-增加了直播间列表和短视频人物列表-增加了用户中心-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
    37
  • 8
    当flutter react native 等混开框架-并且用vscode-idea等编译器无法打包apk,打包安卓不成功怎么办-直接用android studio如何打包安卓apk -重要-优雅草卓伊凡
    73
  • 9
    【08】flutter完成屏幕适配-重建Android,增加GetX路由,屏幕适配,基础导航栏-多版本SDK以及gradle造成的关于fvm的使用(flutter version manage)-卓伊凡换人优雅草Alex-开发完整的社交APP-前端客户端开发+数据联调|以优雅草商业项目为例做开发-flutter开发-全流程-商业应用级实战开发-优雅草Alex
    118
  • 10
    Android经典面试题之Kotlin中Lambda表达式和匿名函数的区别
    29