CODEWITHSUNDEEP
vaadin8
Thang Le
Thang Le

Reputation: 1449

Customize DateTimeField in Vaadin 8

In DateTimeField component, it displays both date (year, month, day) and hour (hour, minute, second). Now i don't want to get date. Any idea to only allow to show and get time ( hour:minute:second) ?

Upvotes: 2

Views: 1380

Answers (3)

Thang Le
Thang Le

Reputation: 1449

now Vaadin 14.2.x provided new DateTimePicker component to solve this problem.

https://vaadin.com/releases/vaadin-14

Upvotes: 0

Meik Behnfeldt
Meik Behnfeldt

Reputation: 117

In my solution I used a TextField and added a custom validator to the relevant binder:

.withValidator(this::validateTime, "Invalid time")

I implemented the validate method as follows:

private boolean validateTime(final String timeString) {

    try {
        LocalTime.parse(timeString);
        return true;
    } catch (final DateTimeParseException e) {
        return false;
    }
}

Upvotes: 0

Basil Bourque
Basil Bourque

Reputation: 338276

tl;dr

No built-in way to display time-of-day only, as of Vaadin 8.1.

You can make your own.

Details

The existing DateTimeField]() widget supports only the legacy GregorianCalendar class which is a combination of a date and a time-of-day plus a time zone. So not useful for time-of-day only values.

Unfortunately, as of Vaadin 8.1, it seems the bundled field widgets have not yet been updated for the java.time types such as the java.time.LocalTime you would want.

As a workaround for the lack of an intelligent LocalTime-savvy field, I suggest either:

  • Try the date-time-fields Add-on.
    An add-on is an extension you can add to your Vaadin project, to deliver some nugget of Vaadin-related functionality. An add-on may be visual widget related, or may be non-visual backend feature. If visual such as this, you may need to do a rebuild of your project to cause the widgetset to be re-created. Perhaps a Maven clean and install (not sure as the technique for this keeps changing with various Vaadin releases).
  • Make your own. Use a regular text field. Write a validator to verify user input parses as a LocalTime object. You have a choice of writing a Vaadin-specific validator or a standard Bean Validation validator. See How to add Validators in Vaadin 8?

Example

Here is some rough code for creating your own LocalTime-savvy field. This is by no means complete, but may help point you in the right direction.

final Label whenLabel = new Label( "when?" );
final TextField whenField = new TextField( );
whenField.setCaption( "When:" );
whenField.setValueChangeMode( ValueChangeMode.BLUR );
whenField.addValueChangeListener( new HasValue.ValueChangeListener < String >( )
{
    static final long serialVersionUID = 201710132100L;

    @Override
    public void valueChange ( HasValue.ValueChangeEvent < String > valueChangeEvent )
    {
        String input = whenField.getValue( );
        System.out.println( "input: " + input );
        try
        {
            // DateTimeFormatter f = DateTimeFormatter.ISO_LOCAL_TIME; // Constant ISO_LOCAL_TIME is for time-of-day in standard ISO 8601 format.
            // DateTimeFormatter f = DateTimeFormatter.ofLocalizedTime( FormatStyle.SHORT ).withLocale( Locale.CANADA_FRENCH ); // Automatically localize.
            DateTimeFormatter f = DateTimeFormatter.ofLocalizedTime( FormatStyle.SHORT ).withLocale( Locale.US ); // Automatically localize.
            LocalTime localTime = LocalTime.parse( input , f );
            String timeIso8601 = localTime.toString( );
            whenLabel.setValue( timeIso8601 );
        } catch ( DateTimeParseException e )
        {
            whenLabel.setValue( e.getClass().getCanonicalName() );
            System.out.println( "ERROR - failed to parse input: " + input );
        }
    }
} );

Upvotes: 1

Related Questions