How to add datepicker field like TextField, Label etc. in the .FXML file (JavaFX)


Question

I am trying to add datepicker field in .fxml (JavaFX). But I don't what is correct way to do? Please help me how to add datepicker field in .fxml file.

<?xml version="1.0" encoding="UTF-8"?>

<?import java.lang.*?>
<?import java.util.*?>
<?import javafx.collections.*?>
<?import javafx.scene.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>

<AnchorPane id="AnchorPane" prefHeight="705.9998779296875" prefWidth="499.9998779296875" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1" fx:controller="processbuilder.controler.NewActivityController">
  <children>
    <GridPane prefHeight="615.9998779296875" prefWidth="499.9998779296875" AnchorPane.bottomAnchor="90.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
      <children>
        <Label prefHeight="24.0" prefWidth="53.0" text="Name : " GridPane.columnIndex="0" GridPane.halignment="CENTER" GridPane.rowIndex="0" GridPane.valignment="CENTER" />
        <Label text="Description :" translateY="30.0" GridPane.columnIndex="0" GridPane.halignment="CENTER" GridPane.rowIndex="1" GridPane.valignment="TOP" />
        <TextField fx:id="name" prefWidth="200.0" GridPane.columnIndex="1" GridPane.rowIndex="0" />
        <TextArea fx:id="desc" prefWidth="200.0" wrapText="true" GridPane.columnIndex="1" GridPane.rowIndex="1" />
        
      <columnConstraints>
        <ColumnConstraints hgrow="SOMETIMES" maxWidth="177.0" minWidth="10.0" prefWidth="76.0" />
        <ColumnConstraints hgrow="SOMETIMES" maxWidth="394.0" minWidth="10.0" prefWidth="394.0" />
      </columnConstraints>
      <rowConstraints>
        <RowConstraints maxHeight="194.0" minHeight="10.0" prefHeight="49.0" vgrow="SOMETIMES" />
        <RowConstraints maxHeight="317.0" minHeight="10.0" prefHeight="265.0" vgrow="SOMETIMES" />
        <RowConstraints maxHeight="194.0" minHeight="10.0" prefHeight="42.0" vgrow="SOMETIMES" />
        <RowConstraints maxHeight="261.0" minHeight="10.0" prefHeight="261.0" vgrow="SOMETIMES" />
      </rowConstraints>
    </GridPane>
    <Button fx:id="create" mnemonicParsing="false" onAction="#handleCreateActivity" prefWidth="64.0" text="Create" AnchorPane.bottomAnchor="30.0" AnchorPane.leftAnchor="345.0" AnchorPane.rightAnchor="91.0" />
    <Button fx:id="cancel" mnemonicParsing="false" onAction="#handleCancel" prefHeight="20.9998779296875" prefWidth="63.9998779296875" text="Cancel" AnchorPane.bottomAnchor="30.0" AnchorPane.leftAnchor="116.0" AnchorPane.rightAnchor="320.0" />
    <Button fx:id="modify" layoutX="345.0" layoutY="655.0" mnemonicParsing="false" onAction="#handleModify" prefWidth="63.9998779296875" text="Modify" visible="false" />
  </children>
</AnchorPane>

1
0
11/20/2014 9:27:45 AM

Just use a DatePicker tag to add a DatePicker in your fxml

A sample example where I have added a DatePicker to the provided FXML is:

<?xml version="1.0" encoding="UTF-8"?>

<?import java.lang.*?>
<?import java.util.*?>
<?import javafx.collections.*?>
<?import javafx.scene.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>

<AnchorPane id="AnchorPane" prefHeight="705.9998779296875" prefWidth="499.9998779296875" xmlns="http://javafx.com/javafx/8" xmlns:fx="http://javafx.com/fxml/1">
  <children>
    <GridPane prefHeight="615.9998779296875" prefWidth="499.9998779296875" AnchorPane.bottomAnchor="90.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
      <children>
        <Label prefHeight="24.0" prefWidth="53.0" text="Name : " GridPane.columnIndex="0" GridPane.halignment="CENTER" GridPane.rowIndex="0" GridPane.valignment="CENTER" />
        <Label text="Description :" translateY="30.0" GridPane.columnIndex="0" GridPane.halignment="CENTER" GridPane.rowIndex="1" GridPane.valignment="TOP" />
        <TextField fx:id="name" prefWidth="200.0" GridPane.columnIndex="1" GridPane.rowIndex="0" />
        <TextArea fx:id="desc" prefWidth="200.0" wrapText="true" GridPane.columnIndex="1" GridPane.rowIndex="1" />
        <Label prefHeight="24.0" prefWidth="87.0" text="DatePicker : " GridPane.halignment="CENTER" GridPane.rowIndex="2" GridPane.valignment="CENTER" />
            <DatePicker fx:id="datepicker" GridPane.columnIndex="1" GridPane.rowIndex="2" />
        </children>
      <columnConstraints>
        <ColumnConstraints hgrow="SOMETIMES" maxWidth="177.0" minWidth="10.0" prefWidth="76.0" />
        <ColumnConstraints hgrow="SOMETIMES" maxWidth="394.0" minWidth="10.0" prefWidth="394.0" />
      </columnConstraints>
      <rowConstraints>
        <RowConstraints maxHeight="194.0" minHeight="10.0" prefHeight="49.0" vgrow="SOMETIMES" />
        <RowConstraints maxHeight="317.0" minHeight="10.0" prefHeight="265.0" vgrow="SOMETIMES" />
        <RowConstraints maxHeight="194.0" minHeight="10.0" prefHeight="42.0" vgrow="SOMETIMES" />
        <RowConstraints maxHeight="261.0" minHeight="10.0" prefHeight="261.0" vgrow="SOMETIMES" />
      </rowConstraints>
    </GridPane>
    <Button fx:id="create" mnemonicParsing="false" onAction="#handleCreateActivity" prefWidth="64.0" text="Create" AnchorPane.bottomAnchor="30.0" AnchorPane.leftAnchor="345.0" AnchorPane.rightAnchor="91.0" />
    <Button fx:id="cancel" mnemonicParsing="false" onAction="#handleCancel" prefHeight="20.9998779296875" prefWidth="63.9998779296875" text="Cancel" AnchorPane.bottomAnchor="30.0" AnchorPane.leftAnchor="116.0" AnchorPane.rightAnchor="320.0" />
    <Button fx:id="modify" layoutX="345.0" layoutY="655.0" mnemonicParsing="false" onAction="#handleModify" prefWidth="63.9998779296875" text="Modify" visible="false" />
  </children>
</AnchorPane>
1
11/20/2014 9:43:52 AM

Licensed under: CC-BY-SA with attribution
Not affiliated with: Stack Overflow
Icon