DOC-03-26 日期选择控件(Date Picker)

本章将概述JavaFX中对日期数据类型的支持,以及介绍DatePicker控件的基本特性。

JavaFX中的DatePicker控件提供了从给定日历中选择某一天的功能。它主要用在需要用户输入日期的Web站点或应用程序中。DatePicker控件由一个带有日期信息域的Combo Box和一个日期选择器组成。

了解时间数据和日期格式

在JDK8中引入的日期和时间API允许你对日期和时间数据进行各种操作,包括根据不同时区设置日历和本地时间。

在日期和时间API中的基础包是java.time。它提供了如下类来定义基于国际标准化组织(ISO)历法的日历系统中的时间。

· Clock ——时钟类可以指定一个时区,它可以获得当前的时刻、日期和时间

· Duration ——表示一段时间

· Instant ——表示在时间轴上的一个瞬间

· LocalDate——在ISO-8601日历系统中的一个不带时区的日期

· LocalDateTime ——在ISO-8601日历系统中的一个不带时区的日期和时间

· LocalTime ——在ISO-8601日历系统中的一个不带时区的时间

· MonthDay ——在ISO-8601日历系统中的一个月份中的日期

· OffsetDateTime ——在ISO-8601日历系统中的一个日期和时间,它加入了格林威治/UTC 时间偏移量

· OffsetTime ——在ISO-8601日历系统中的一个时间,它加入了格林威治/UTC 时间偏移量

· Period – 以天为单位的一段时间

· Year ——在ISO-8601日历系统中的一年

· YearMonth ——在ISO-8601日历系统中的一年中的月份

· ZonedDateTime ——在ISO-8601日历系统中的一个带有时区的日期和时间

· ZoneId ——表示一个时区ID

· ZoneOffset —— 表示与格林威治/UTC时间的时区偏移量

如果希望获得更多相关的功能和代码样例信息,可以参考Java教程中对日期和时间API的讲解。

Date Picker设计概览

为了使用JDK8日期时间API的新功能来改进JavaFX应用程序的UI,JavaFX SDK引入了DatePicker控件。DatePicker控件由一个可编辑的ComboBox(日期信息域)和一个日历(日期选择器)组成,如图26-1所示。

26-1 Date Picker控件样例

3-26-1 date-picker-sample

向应用程序UI中添加Date Picker

DatePicker类位于javafx.scene.control包之中,它可以用来在你的JavaFX应用程序用户界面中添加一个日期选择器,如例26-1所示。

26–1 增加一个Date Picker 组件

例26-1实现了一个典型的酒店入住登记时进行日期选择的界面。当你编译并运行此程序时会显示如图26-2所示的组件。

26-2 Date Picker组件的初始界面

3-26-2 date-picker-add1

注意日期信息域在初始时为空,不过这种默认行为是可以改变的。在进行日期选择前你可以指定在日期信息域中要显示的日期。可以通过DatePicker的构造方法或者通过调用从ComboBox类继承而来的setValue方法来设置value属性的值。例26-3展示了用于设置LocalDate值的一些可选项。

26–2 设置日期值

一旦初始值被设置了,那当你编译并运行程序后,它将会显示在日期信息域。图26-3展示了在日期信息域指定了初始日期的情况。

26-3 指定了初始日期的日期信息域

3-26-3 date-picker-add

DatePicker API提供了一些属性和方法来改变日期选择器的默认外观和行为。特别是你可以控制周次的显隐、自定义日期格式,并且可以定义和应用日期单元工厂。

自定义Date Picker

你可以通过DatePicker类的setShowNumbers方法控制是否在日历中显示ISO日历系统的周次。例26-3中的代码行展示了调用checkInDatePicker的此方法。

26–3 Date Picker中显示周次

26-4 在日历中展示周次

3-26-4 date-picker-week

在默认情况下,在日期信息域中的日期会按系统本地和ISO日历系统的格式来展示。因此在例26-1中选择的日期将会按这样的格式显示:mm/dd/yyyy。一般情况下你不需要修改默认格式,不过如果需要进行修改则可以使用DatePicker类的converter属性和setConverter方法来设置日期的可选格式。如果将converter的值设置为null则会恢复默认的日期格式。

在例26-4中,你将创建一个converter来将日期格式转换为:yyyy-MM-dd。当用户在日期信息域输入一个日期时,它会把输入的文本转换成LocalDate类型的对象。同时它也能把在日历中选择的日期所对应LocalDate对象转换为在日期信息域中显示的文本。

26-4 转换日期格式

除了进行日期转换之外,为了告诉用户输入所需要的日期格式,例26-4还为日期信息域设置了提示信息。图26-5展示了应用了日期格式转换器的Date Picker的两种状态。在图中提示信息和被选择的日期都以新格式进行显示。

26-5 带有格式转换器和提示文本信息的Date Picker

3-26-5 date-picker-format

你也可以修改日历元素中任何一个单元或多个单元的默认外观并设置特定的行为。为了完成这个任务,我们可以考虑这样一个真实的用例:在进行酒店前台登记时选择入住和离店日期。例26-5创建了一个带有两个Date Picker的典型用户界面。

26–5 添加两个Date Picker 组件

在例26-5中checkInDatePicker的预定义值是LocalDate.now(),它与系统时钟中的当前日期一致。checkOutDatePicker的预定义值是当前日期的下一天。

如果你在2013年9月19日编译并运行此样例,它将会产生如图26-6所示的界面输出。

26–6 两个Date Picker 组件

3-26-6 date-picker-cell

在默认情况下,日历元素的所有单元格都是可选的。这可能会导致离店日期在入住日期之前的情况,而这显然是不正确的。

例26-6为checkOutDatePicker创建了一个日期Cell Factory,它会将checkInDatePicker所选择的日期及其之前的日期单元格都禁用。

26–6 实现一个日期 Cell Factory 来禁用某些日期

dayCellFactory会应用到checkOutDatePicker之上,它在一个DateCell项上调用了setDisable和setStyle方法,以此来避免日期被选择并且将它们变成粉红色。

当你编译并运行例26-6中的代码,DatePickerSample程序会产生如图26-7所示的UI界面。

26–7 禁用Calendar元素中的部分单元格

3-26-7 date-picker-cell-disable

现在你已经知道了如何创建日期Cell Factory,你可以扩展checkOutDatePicker的默认行为并且为日期单元格的选择提供扩展功能。

例26-7计算了checkInDatePicker中选择日期与当前日期单元中的日期之间的间隔。计算结果会在日期单元的提示信息框(Tooltip)中显示。

26–7 计算时间间隔

当你编译并运行修改后的DatePickerSample程序时,如果你将鼠标移过某个日期单元,你会看见对应的Tooltip。图26-8展示了当你将鼠标光标放到9月30日对应的单元格之上时的界面截图。Tooltip显示出在9月19日和9月30日之间的间隔是11天。

26–8为日期单元格设置Tooltip

3-26-8 date-picker-cell-tooltip

改变日历系统

在JDK8中引入的日期时间JavaAPI不仅仅允许开发者使用基于ISO标准的日历系统,也允许使用其他历法,例如日本历、回历、民国纪年历、泰国佛教历。

DatePicker控件也支持非ISO标准的日历系统,它可以表示合适的年份。比如在回历中的月份日期与ISO标准日期并不一致,它提供了附加的可视化主题来区分每个月的ISO标准日期和回历日期。

例26-8在checkInDatePicker上应用了泰国佛教历,而在checkOutDatePicker上应用了回历。

26–8应用泰国佛教历和回历

当这些代码行被添加到DatePickerSample程序中,对应的DatePicker将会改变其外观,如图26-9。

26–9 使用其它历法

3-26-9 date-picker-chronology

你可以在相关的Java教程中了解到对非ISO日历支持情况的更多信息。

相关的文档

· 日期时间的 Java 教程

· DatePicker

· DateCell

打赏一下
支付宝
微信
除非注明,博客文章均为原创,转载请标明文章地址
本文地址: http://www.javafxchina.net/blog/2015/04/doc03_datepicker/
百度已收录