Uporaba DatePickers v uporabniškem vmesniku tvoje JavaFX aplikacije ponuja uporabniku prijazen način izbire datumskih vrednosti. V tem priročniku te bom popeljal skozi implementacijo DatePickerja, ki ti ne samo omogoča izbiro začetnega datuma, temveč tudi prikazuje število dni med dvema datumoma. Poglejmo!

Najpomembnejše ugotovitve

  • Naučil se boš, kako ustvariti DatePicker v JavaFX.
  • Prikazano bo, kako dodati funkcionalnost orodne vrstice, ki prikazuje število dni med izbranim datumom in začetnim datumom.
  • Ustrezna uporaba postavitev in uvozov bo obravnavana, da ustvarimo urejen uporabniški vmesnik.

Priročnik po korakih

Za integracijo DatePickerja v tvojo JavaFX aplikacijo sledi tem korakom:

Začni z ustvarjanjem osnovne strukture za svoj DatePicker. V ta namen ustvari nov objekt DatePicker. Lahko delaš na primer z začetnim datumom in končnim datumom. Najprej dodamo DatePicker za začetni datum.

Implementacija izbira datuma v JavaFX

Koda za ustvarjanje DatePickerja izgleda takole:

DatePicker startDatePicker = new DatePicker();

Pri tem uvoziš potrebno razred za DatePicker, da zagotoviš, da vse deluje. Želimo tudi dodati oznako, ki jasno označuje pomen tega DatePickerja.

Implementacija izbire datuma v JavaFX

Oznako ustvariš takole:

Label startLabel = new Label("Začetni datum:");

Sedaj vse dodamo v GridPane, da bodo elementi lepo prikazani. GridPane je koristna postavitev, ki ti pomaga razporediti UI elemente v vrstice in stolpce.

Implementacija DatePickerja v JavaFX

Uporabi naslednjo kodo, da dodaš elemente v GridPane in določiš njihovo pozicijo:

Zdaj, ko imamo postavljene osnove za naš DatePicker, preizkusimo vidnost v uporabniškem vmesniku. Videti bi moral začetni datum, ki se zdaj prikazuje v tvoji aplikaciji.

Če zdaj želiš izbrati specifičen datum, to lahko storiš tako, da izbereš datum v DatePickerju. Da prikažeš trenutni dan, uporabljamo LocalDate.now().

Implementacija izbire datuma v JavaFX

Koda za izračun trenutnega datuma izgleda takole:

startDatePicker.setValue(LocalDate.now());

Ker zdaj imaš delujoč DatePicker, želimo dodati funkcionalnost orodnih vrstic. To omogoča, da ob večanju nad datumom prikaže število dni med izbranim datumom in trenutnim datumom.

Implementacija DatePickera v JavaFX

Dodajmo povratni poziv za DateCells. To se izvede preko metode setDayCellFactory(), kar ti omogoča, da oblikuješ vedenje vsake posamezne dnevne celice.

Implementacija DatePicker v JavaFX

Na ta način prikažemo število dni med trenutnim izbranim datumom in datumom, nad katerim se premika miš, v orodni vrstici.

Zdaj je čas, da vse to preizkusimo. Ko z mišem premikaš različne dni, bi moral zdaj videti število preostalih dni.

Implementacija DatePickerja v JavaFX

Če vse izgleda dobro, lahko zdaj na podoben način dodaš še en DatePicker za tvoj končni datum. To lahko služi kot vaja. Zdaj imaš preprosto in učinkovito rešitev za implementacijo DatePickerja v tvoji JavaFX aplikaciji.

Implementacija izbire datuma v JavaFX

V naslednjem videu nas čakajo zanimive teme, vključno z implementacijo ColorPickerjev.

Povzetek – JavaFX DatePicker – Priročnik po korakih za izbiro datumov

V tem priročniku si se naučil, kako implementirati DatePicker v JavaFX in ga razširiti s funkcionalnostjo orodne vrstice. To bistveno izboljša uporabniško izkušnjo, saj nudi dodatne informacije kadar koli je to potrebno.

Pogosta vprašanja

Kaj je DatePicker v JavaFX?DatePicker je UI element v JavaFX, ki uporabnikom omogoča izbiro datumskih vrednosti.

Kako dodam orodno vrstico za DatePicker?Orodno vrstico lahko dodaš tako, da uporabiš metodo setDayCellFactory() in ustvariš povratni poziv.

Kako nastavim trenutni datum v DatePickerju?Za nastavitev trenutnega datuma lahko uporabiš startDatePicker.setValue(LocalDate.now()).

Ali lahko v eni aplikaciji uporabim več DatePickerjev?Da, lahko dodaš kolikor želiš DatePickerjev, tako da vsakemu dodeliš svoj objekt.

Ali obstaja način za izračun števila dni med dvema datumoma?Da, lahko uporabiš ChronoUnit.DAYS.between(startDate, endDate), da izračunaš število dni med dvema datumskima vrednostma.