2

I've been trying to customize with css my JavaFX application...so far so good untill I reach the Datepicker... I tried a lot of different aproaches but none of them seem to work. Is there a way to make the Datepicker round just like my TextFields?

Actual JavaFX interface that I'm working on: Actual JavaFX interface that I'm working on

(btw, I'm using Java 8_111 with Netbeans 8.2 if that helps on something)

Greetings!

Louys Patrice Bessette
  • 33,375
  • 6
  • 36
  • 64
David Reyes
  • 23
  • 3

1 Answers1

3

You just need to individually set the background-radius for the date-picker itself, plus it's underlying text-field and arrow-button (which is the calendar button).

For example, using the following CSS:

.date-picker {
    -fx-background-radius: 10 10 10 10;
}
.date-picker > .text-field {
    -fx-background-radius: 10 0 0 10;
}

.date-picker > .arrow-button {
    -fx-background-radius: 0 10 10 0;
}

Produces this DatePicker:

screenshot

For future CSS styling needs, you can learn a lot by referencing the default modena.css stylesheet used internally by JavaFX. This is valuable for learning many of the additional selectors available which aren't described in the "official" CSS Reference Guide.

Zephyr
  • 9,885
  • 4
  • 28
  • 63
  • I just wonder if you need the `border-radius`? AFAIK borders are not set on most controls (the *popup* associated with the date picker is an exception, but not the date picker itself). – James_D Jun 13 '21 at 20:37
  • Ah; right you are, @James_D. I will update my answer. – Zephyr Jun 13 '21 at 20:48