Is there a way to make the datepicker display Months in an other language than the default English?

For example setting it in German/DE to display June as Juni ?

CodePudding user response：

You can I18N-ize the DatePicker by setting a setI18n(DatePicker.DatePickerI18n) value. E.g.

def datePicker = new DatePicker().tap {
    setI18n(new DatePicker.DatePickerI18n().tap {
        def locale = Locale.GERMAN

        // date formats
        setDateFormats(
            DateTimeFormatterBuilder.getLocalizedDateTimePattern(
                FormatStyle.MEDIUM,
                null,
                IsoChronology.INSTANCE,
                locale
            ).replace('y', 'yyyy'),
            // this would be useful in theory, but is not in practice, because the first format always wins
            DateTimeFormatterBuilder.getLocalizedDateTimePattern(
                FormatStyle.SHORT,
                null,
                IsoChronology.INSTANCE,
                locale
            )
        )

        // days
        def daysOfWeek = [DayOfWeek.SUNDAY]   DayOfWeek.values().toList() // sunday first, because ISO is a joke for some
        setWeekdays(daysOfWeek*.getDisplayName(TextStyle.FULL, locale))
        setWeekdaysShort(daysOfWeek*.getDisplayName(TextStyle.SHORT, locale))
        setFirstDayOfWeek(WeekFields.of(locale).firstDayOfWeek.value % 7) // this works because, because value is   1

        // months
        setMonthNames(Month.values()*.getDisplayName(TextStyle.FULL, locale))

        // words (use your translation backend here)
        setWeek("Woche")
        setToday("Heute")
        setCancel("Abbrechen")
    })
    addValueChangeListener{
        Notification.show(it.value.toString())
    }
}

CodePudding user response：

Hmm, interestingly, we don’t have code examples in our docs for this. I hope the API docs are sufficient for now:

Java: https://vaadin.com/api/platform/23.1.0/com/vaadin/flow/component/datepicker/DatePicker.html#getI18n()

TypeScript: https://cdn.vaadin.com/vaadin-web-components/23.1.0/#/elements/vaadin-date-picker#property-i18n