跳转至

Vaadin DateField教程

原文: http://zetcode.com/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 DateField组件的基础。 您可能也对相关教程感兴趣: Vaadin 网格教程Vaadin 链接教程Vaadin Button教程Vaadin 滑块教程Vaadin CheckBox教程Java 教程



回到顶部