Vaadin DateField
教程
在 Vaadin DateField
教程中,我们学习 Vaadin DateField
组件的基础。 在 Vaadin DateField
示例中,所选日期将转换为回教日期,并显示在Label
组件中。
Vaadin
Vaadin 是一种流行的 Java Web 开发框架,用于构建单页 Web 应用。
Vaadin DateField
DateField
是日期输入组件,它将实际的日期选择器显示为弹出窗口。
Vaadin DateField
示例
以下程序演示了 Vaadin DateField
组件的用法。 所选日期将转换为回教日期,并显示在Label
组件中。
NetBeans IDE 可用于轻松创建 Vaadin Web 应用。 我们需要安装 NetBeans Vaadin 插件,然后创建一个新的 Vaadin Web 应用项目。
MyUI.java
package com.zetcode.main;
import javax.servlet.annotation.WebServlet;
import com.vaadin.annotations.Theme;
import com.vaadin.annotations.VaadinServletConfiguration;
import com.vaadin.data.HasValue;
import com.vaadin.server.VaadinRequest;
import com.vaadin.server.VaadinServlet;
import com.vaadin.ui.DateField;
import com.vaadin.ui.Label;
import com.vaadin.ui.Notification;
import com.vaadin.ui.UI;
import com.vaadin.ui.VerticalLayout;
import com.zetcode.service.DateConvert;
import java.time.LocalDate;
import java.time.chrono.HijrahDate;
@Theme("mytheme")
public class MyUI extends UI {
@Override
protected void init(VaadinRequest vaadinRequest) {
VerticalLayout layout = new VerticalLayout();
DateField field = new DateField();
Label lbl = new Label();
field.addValueChangeListener((HasValue.ValueChangeEvent<LocalDate> event) -> {
LocalDate date = (LocalDate) event.getValue();
HijrahDate hjdate = DateConvert.toIslamic(date);
lbl.setValue(hjdate.toString() + "!");
});
layout.addComponents(field, lbl);
layout.setMargin(true);
layout.setSpacing(true);
setContent(layout);
}
@WebServlet(urlPatterns = "/*", name = "MyUIServlet", asyncSupported = true)
@VaadinServletConfiguration(ui = MyUI.class, productionMode = false)
public static class MyUIServlet extends VaadinServlet {
}
}
这是MyUI
类。
VerticalLayout layout = new VerticalLayout();
在我们的示例中,我们在VerticalLayout
列中显示两个组件。
DateField field = new DateField();
创建一个DateField
组件。
Label lbl = new Label("");
Label
组件将支付从日期字段中选择的值。
field.addValueChangeListener((HasValue.ValueChangeEvent<LocalDate> event) -> {
LocalDate date = (LocalDate) event.getValue();
HijrahDate hjdate = DateConvert.toIslamic(date);
lbl.setValue(hjdate.toString() + "!");
});
使用addValueChangeListener()
,我们为DateField
中的值更改添加了一个监听器。 我们用getValue()
方法获得DateField
当前选择的项目。 使用DateConvert.toIslamic()
将检索到的值转换为回教日期,并使用setValue()
方法将其设置为标签。
layout.addComponents(field, lbl);
通过addComponents()
方法将这两个组件添加到VerticalLayout
。
layout.setMargin(true);
我们在VerticalLayout
周围留了一些余量。
DateConvert.java
package com.zetcode.service;
import java.time.LocalDate;
import java.time.chrono.HijrahChronology;
import java.time.chrono.HijrahDate;
public class DateConvert {
public static HijrahDate toIslamic(LocalDate date) {
HijrahDate hjdate = HijrahChronology.INSTANCE.date(date);
return hjdate;
}
}
在DateConvert
类中,我们使用HijrahChronology
计算伊斯兰日期。
图:Vaadin DateField
在本教程中,我们展示了 Vaadin DateField
组件的基础。 您可能也对相关教程感兴趣: Vaadin 网格教程, Vaadin 链接教程, Vaadin Button
教程, Vaadin 滑块教程, Vaadin CheckBox
教程, Java 教程。