title: Add custome item in .fxml
body: <p>I have created a class which is named <code>NavButton</code>. I want to be able to use this into an .fxml file.</p>
  
  <p><strong>The Problem Is---></strong>
  I created an .fxml file with <code>SceneBuilder</code> which contains some buttons, and then replacing the tag <code>Button</code>  with <code>NavButton</code>, but it doesn't work.</p>
  
  <p>I can find tutorials on how to add a costume item in .fxml with SceneBuilder but no how i can do this mannually.</p>
  
  <blockquote>
    <p>The <strong>NavButton</strong> class:</p>
  </blockquote>
  
  <pre><code> import javafx.beans.property.BooleanProperty;
   import javafx.beans.property.BooleanPropertyBase;
   import javafx.css.PseudoClass;
   import javafx.scene.control.Button;
  
   public class NavButton extends Button {
  
          /** Define a pseudo class */
          private PseudoClass MARKED_PSEUDO_CLASS = PseudoClass.getPseudoClass("marked");
          BooleanProperty marked = new BooleanPropertyBase(false) {
              public void invalidated() {
                  pseudoClassStateChanged(MARKED_PSEUDO_CLASS, marked.get());
              }
  
              @Override
              public Object getBean() {
                  return NavButton.this;
              }
  
              @Override
              public String getName() {
                  return "marked";
              }
  
          };
  
          public void setMarked(boolean m) {
              marked.set(m);
          }
      }
  </code></pre>
  
  <blockquote>
    <p><strong>The problematic .fxml file:</strong></p>
  </blockquote>
  
  <pre><code>    &lt;?xml version="1.0" encoding="UTF-8"?&gt;
  
  &lt;?import javafx.geometry.Insets?&gt;
  &lt;?import javafx.scene.control.Button?&gt;
  &lt;?import javafx.scene.layout.BorderPane?&gt;
  &lt;?import javafx.scene.layout.ColumnConstraints?&gt;
  &lt;?import javafx.scene.layout.GridPane?&gt;
  &lt;?import javafx.scene.layout.HBox?&gt;
  &lt;?import javafx.scene.layout.RowConstraints?&gt;
  
  &lt;fx:root prefHeight="44.0" prefWidth="626.0" style="-fx-border-color: white;" type="BorderPane" xmlns="http://javafx.com/javafx/8.0.60" xmlns:fx="http://javafx.com/fxml/1"&gt;
    &lt;center&gt;
    &lt;GridPane prefHeight="32.0" prefWidth="514.0" BorderPane.alignment="CENTER"&gt;
       &lt;columnConstraints&gt;
          &lt;ColumnConstraints /&gt;
          &lt;ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" /&gt;
          &lt;ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" /&gt;
          &lt;ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" /&gt;
       &lt;/columnConstraints&gt;
       &lt;rowConstraints&gt;
          &lt;RowConstraints /&gt;
          &lt;RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" /&gt;
       &lt;/rowConstraints&gt;
       &lt;children&gt;
          &lt;NavButton id="navigationBarButton" fx:id="djMode" mnemonicParsing="false" prefHeight="40.0" prefWidth="150.0" text="DJMode" GridPane.columnIndex="1" GridPane.halignment="CENTER" GridPane.rowIndex="1" /&gt;
          &lt;NavButton id="navigationBarButton" fx:id="simpleMode" mnemonicParsing="false" prefHeight="40.0" prefWidth="150.0" text="SimpleMode" GridPane.columnIndex="2" GridPane.halignment="CENTER" GridPane.rowIndex="1" /&gt;
          &lt;NavButton id="navigationBarButton" fx:id="librariesMode" mnemonicParsing="false" prefHeight="40.0" prefWidth="170.0" text="LibrariesMode" GridPane.columnIndex="3" GridPane.halignment="CENTER" GridPane.rowIndex="1" /&gt;
       &lt;/children&gt;
     &lt;/GridPane&gt;
    &lt;/center&gt;
   &lt;padding&gt;
     &lt;Insets bottom="10.0" left="5.0" right="5.0" top="5.0" /&gt;
   &lt;/padding&gt;
  &lt;left&gt;
     &lt;Button fx:id="settings" mnemonicParsing="false" BorderPane.alignment="CENTER" /&gt;
   &lt;/left&gt;
   &lt;right&gt;
     &lt;HBox prefHeight="32.0" prefWidth="94.0" BorderPane.alignment="CENTER"&gt;
        &lt;children&gt;
           &lt;Button fx:id="minimize" mnemonicParsing="false" styleClass="specialButton" /&gt;
           &lt;Button fx:id="maximize_normalize" mnemonicParsing="false" styleClass="specialButton" /&gt;
           &lt;Button fx:id="close" mnemonicParsing="false" styleClass="specialButton" /&gt;
        &lt;/children&gt;
     &lt;/HBox&gt;
   &lt;/right&gt;
  &lt;/fx:root&gt;
  </code></pre>
  
  <blockquote>
    <p>The <strong>error</strong> is:</p>
  </blockquote>
  
  <pre><code>javafx.fxml.LoadException: NavButton is not a valid type.
   /C:/eclipse/Building%20The%20XRPlayer/builder/bin/fxmls/NavigationBar.fxml:25
  
  at javafx.fxml.FXMLLoader.constructLoadException(FXMLLoader.java:2597)
  at javafx.fxml.FXMLLoader.createElement(FXMLLoader.java:2774)
  at javafx.fxml.FXMLLoader.processStartElement(FXMLLoader.java:2704)
  at javafx.fxml.FXMLLoader.loadImpl(FXMLLoader.java:2527)
  at javafx.fxml.FXMLLoader.loadImpl(FXMLLoader.java:2441)
  at javafx.fxml.FXMLLoader.load(FXMLLoader.java:2409)
  at windows.MainWindow$NavigationBar.&lt;init&gt;(MainWindow.java:533)
   ..........
  </code></pre>