पिकर के साथ तिथि या समय फ़ील्ड कैसे बनाएँ

उद्देश्य. एक ऐसा फ़ील्ड बनाना जो टैप मिलने पर DatePicker (कैलेंडर) या TimePicker (घड़ी) खोलता है और फ़ील्ड को locale के अनुसार फ़ॉर्मैटेड रूप में भरता है। उपयोगकर्ता मास्क के साथ सीधे टाइप भी कर सकता है।

उपयोग की गई APIs

• campo.setMode(EditMode.DATE, true) — maskedEdit के साथ तिथि मोड। locale से मास्क निकालता है: LocaleFormats.dateFormat == YMD → "9999-99-99", अन्यथा "99/99/9999" (LocaleFormats.dateSeparator का उपयोग करते हुए); validChars = "0123456789"; keyboard = DATE। टैप करने पर, DatePicker खोलता है।
• campo.setMode(EditMode.TIME, true) — मास्क "99:99" के साथ समय मोड (LocaleFormats.timeSeparator का उपयोग करते हुए); keyboard = TIME। टैप करने पर, TimePicker खोलता है।
• TextField.getText() — विभाजकों के साथ फ़ॉर्मैटेड टेक्स्ट ("15/03/2024", "14:30")।
• TextField.getTextWithoutMask() — केवल अंक ("15032024", "1430")।

आंतरिक व्यवहार (स्वचालित, बिना अतिरिक्त कोड के):

• खुलने पर, फ़ील्ड पिकर को वर्तमान मान से पूर्व-भरता है, यदि वह पार्स करने योग्य हो (तिथि के लिए DateTimeUtils.parseDate; समय के लिए hhmm अंक)।
• पिकर में पुष्टि करने पर, आंतरिक onSelect, फ़ॉर्मैटेड मान के साथ setText(...) को कॉल करता है और फोकस को टेक्स्ट के अंत में पुनर्स्थापित करता है (restoreFocusAtEnd)।
• DatePicker/TimePicker प्रति इंस्टेंस एक बार बनाया जाता है (lazy) और पुनः उपयोग किया जाता है।

पिकर को मैन्युअल रूप से खोलने के लिए (किसी फ़ील्ड के बाहर), new DatePicker().onSelect(...).show() या new TimePicker().onSelect(...).show() का उपयोग करें। उपयोगी getter: DatePicker.getSelectedDay()/getDisplayMonth()/getDisplayYear(), TimePicker.getHour()/getMinute()/getTimeText()।

पूर्ण उदाहरण (कॉपी करें, पेस्ट करें और चलाएँ)

package com.exemplo;

import dev.crossfly.ui.*;
import dev.crossfly.ui.layout.*;
import dev.crossfly.ui.style.*;   // TextFieldStyle (style में config)

/** चलाने योग्य मुख्य स्क्रीन। launcher (classname) की ओर संकेत करें और चलाएँ: gradlew :lwjgl3:run */
public class MainWindow extends Window
{
   @Override
   public void onShow() throws Exception
   {
      super.onShow();
      setLayout(new VerticalLayout());

      // दिनांक field — छूने पर DatePicker खोलता है
      TextField data = new TextField("");
      data.caption("Data");
      data.setMode(EditMode.DATE, true);

      // समय field — छूने पर TimePicker खोलता है
      TextField hora = new TextField("");
      hora.caption("Hora");
      hora.setMode(EditMode.TIME, true);

      Label resultado = new Label("");

      Button salvar = new Button("Salvar");
      salvar.onAction(o ->
      {
         String dataFmt = data.getText();            // "15/03/2024"
         String horaFmt = hora.getText();            // "14:30"
         if (dataFmt.isEmpty() || horaFmt.isEmpty())
         {
            Hint.show("Preencha data e hora", 2000);
            return;
         }
         resultado.setText("Agendado para " + dataFmt + " às " + horaFmt);
      });

      add(LAY_FILL, data);
      add(LAY_FILL, hora);
      add(LAY_AUTO, salvar);
      add(LAY_FILL, resultado);
   }
}

नीचे दिया गया अंश केवल मुख्य भाग दिखाता है। चलाने के लिए, इसे ऊपर दिए गए MainWindow ढाँचे में रखें।

न्यूनतम अंश

import dev.crossfly.ui.*;
import dev.crossfly.ui.style.*;
import static dev.crossfly.ui.UIConstants.EditMode;

// दिनांक field — छूने पर DatePicker खोलता है
TextField data = new TextField("");
data.caption("Data");
data.setMode(EditMode.DATE, true);

// समय field — छूने पर TimePicker खोलता है
TextField hora = new TextField("");
hora.caption("Hora");
hora.setMode(EditMode.TIME, true);

Button salvar = new Button("Salvar");
salvar.onAction(o ->
{
   String dataFmt = data.getText();            // "15/03/2024"
   String horaFmt = hora.getText();            // "14:30"
   String dataDig = data.getTextWithoutMask(); // "15032024"
   // ... सहेजता है
});

गहराई से जानें

• DatePicker · मास्क और कीबोर्ड
• सहयोगी रेसिपी: CPF/CEP/तिथि मास्क · न्यूमेरिक कीबोर्ड