title: JavaFX JFXDrawer not hidden completely when program starts
body: <p>I'm trying to add a JFXDrawer to my program which I have succeeded in doing that however I have only one issue that I cannot figure out why its happening. When my program first runs the JFXDrawer should be completely hidden and shown when I click on the Hamburger button but if you look at the below image the red space highlighted(which I added as a background color for the drawer to make it clear),  that space is always shown when the program starts but when I click on the hamburger to open and close it returns normal hidden, its just on startup.</p>
  <p><a href="https://i.stack.imgur.com/VN48a.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/VN48a.png" alt="jfxdrawer image" /></a></p>
  <p>This is how its working now:
  <a href="https://i.stack.imgur.com/fbFie.gif" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/fbFie.gif" alt="enter image description here" /></a>
  The following is a reproducible example code:</p>
  <p><strong>NavigationDrawerTest</strong></p>
  <pre><code>    public class NavigationDrawerTest extends Application {
      
      @Override
      public void start(Stage stage) throws IOException {
          
          Parent root = FXMLLoader.load(getClass().getResource(&quot;Main.fxml&quot;));
          
          Scene scene = new Scene(root);
          stage.initStyle(StageStyle.UNDECORATED);
          stage.setScene(scene);
          
          stage.show();
      }
  
      /**
       * @param args the command line arguments
       */
      public static void main(String[] args) {
          launch(args);
      }
      
  }
  </code></pre>
  <p><strong>MainController</strong>:</p>
  <pre><code>public class MainController implements Initializable {
  
      /**
       * Initializes the controller class.
       */
      @FXML
      private AnchorPane anchorPane;
  
      @FXML
      private JFXHamburger hamburger;
  
      @FXML
      private JFXDrawer drawer;
      @Override
      public void initialize(URL url, ResourceBundle rb) {
      try {
              // TODO
              VBox box = FXMLLoader.load(getClass().getResource(&quot;NavDrawer.fxml&quot;));
              drawer.setSidePane(box);
              
          } catch (IOException ex) {
              Logger.getLogger(MainController.class.getName()).log(Level.SEVERE, null, ex);
          }
          HamburgerSlideCloseTransition task = new HamburgerSlideCloseTransition(hamburger);
          task.setRate(-1);
          hamburger.addEventHandler(MouseEvent.MOUSE_CLICKED, (Event event) -&gt; {
              drawer.toggle();
          });
          drawer.setOnDrawerOpening((event) -&gt; {
              task.setRate(task.getRate() * -1);
              task.play();
              drawer.setMinWidth(220);
          });
          drawer.setOnDrawerClosed((event) -&gt; {
              task.setRate(task.getRate() * -1);
              task.play();
              drawer.setMinWidth(0);
          });    
      }
  }
  </code></pre>
  <p><strong>Main.fxml</strong></p>
  <pre><code>&lt;BorderPane maxHeight=&quot;790.0&quot; maxWidth=&quot;1280.0&quot; prefHeight=&quot;790.0&quot; prefWidth=&quot;1280.0&quot; xmlns=&quot;http://javafx.com/javafx/8.0.171&quot; xmlns:fx=&quot;http://javafx.com/fxml/1&quot; fx:controller=&quot;navigationdrawertest.MainController&quot;&gt;
     &lt;center&gt;
        &lt;AnchorPane id=&quot;AnchorPane&quot; fx:id=&quot;anchorPane&quot; prefHeight=&quot;720.0&quot; prefWidth=&quot;1280.0&quot;&gt;
           &lt;children&gt;
              &lt;JFXHamburger fx:id=&quot;hamburger&quot; layoutX=&quot;14.0&quot; layoutY=&quot;14.0&quot; /&gt;
              &lt;JFXTextField fx:id=&quot;tf_search&quot; focusColor=&quot;#ffc107&quot; layoutX=&quot;80.0&quot; layoutY=&quot;54.0&quot; prefHeight=&quot;40.0&quot; prefWidth=&quot;925.0&quot; promptText=&quot;SEARCH HERE&quot; unFocusColor=&quot;#c5c5c5&quot; AnchorPane.leftAnchor=&quot;80.0&quot; AnchorPane.rightAnchor=&quot;80.0&quot; AnchorPane.topAnchor=&quot;54.0&quot;&gt;
                 &lt;font&gt;
                    &lt;Font name=&quot;Exo Regular&quot; size=&quot;18.0&quot; /&gt;
                 &lt;/font&gt;
              &lt;/JFXTextField&gt;
              &lt;TableView fx:id=&quot;personTable&quot; layoutX=&quot;80.0&quot; layoutY=&quot;132.0&quot; prefHeight=&quot;577.0&quot; prefWidth=&quot;1040.0&quot; AnchorPane.leftAnchor=&quot;10.0&quot; AnchorPane.rightAnchor=&quot;10.0&quot; AnchorPane.topAnchor=&quot;152.0&quot;&gt;
                 &lt;columns&gt;
                    &lt;TableColumn fx:id=&quot;T1Column&quot; editable=&quot;false&quot; prefWidth=&quot;195.0&quot; sortType=&quot;DESCENDING&quot; text=&quot;T1&quot; /&gt;
                    &lt;TableColumn fx:id=&quot;T2Column&quot; editable=&quot;false&quot; minWidth=&quot;6.0&quot; prefWidth=&quot;220.0&quot; sortType=&quot;DESCENDING&quot; text=&quot;T2&quot; /&gt;
                    &lt;TableColumn fx:id=&quot;T3Column&quot; editable=&quot;false&quot; prefWidth=&quot;97.0&quot; sortType=&quot;DESCENDING&quot; text=&quot;T3&quot; /&gt;
                 &lt;/columns&gt;
              &lt;/TableView&gt;
           &lt;/children&gt;
        &lt;/AnchorPane&gt;
     &lt;/center&gt;
     &lt;left&gt;
        &lt;JFXDrawer fx:id=&quot;drawer&quot; defaultDrawerSize=&quot;220.0&quot; prefWidth=&quot;0.0&quot; style=&quot;-fx-background-color: red;&quot; BorderPane.alignment=&quot;CENTER&quot; /&gt;
     &lt;/left&gt;
     
  &lt;/BorderPane&gt;
  </code></pre>
  <p><strong>NavDrawer.fxml</strong></p>
  <pre><code>&lt;VBox style=&quot;-fx-background-color: black;&quot; xmlns=&quot;http://javafx.com/javafx/8.0.171&quot; xmlns:fx=&quot;http://javafx.com/fxml/1&quot; fx:controller=&quot;navigationdrawertest.NavDrawerController&quot;&gt;
     &lt;children&gt;
        &lt;JFXButton alignment=&quot;BASELINE_LEFT&quot; focusTraversable=&quot;false&quot; graphicTextGap=&quot;15.0&quot;  prefHeight=&quot;32.0&quot; prefWidth=&quot;220.0&quot; ripplerFill=&quot;WHITE&quot; text=&quot;Button 1&quot; textFill=&quot;#c1fff9&quot;&gt;         
           &lt;padding&gt;
              &lt;Insets bottom=&quot;5.0&quot; left=&quot;30.0&quot; top=&quot;5.0&quot; /&gt;
           &lt;/padding&gt;
        &lt;/JFXButton&gt;
        &lt;JFXButton alignment=&quot;BASELINE_LEFT&quot; focusTraversable=&quot;false&quot; graphicTextGap=&quot;15.0&quot; layoutX=&quot;10.0&quot; layoutY=&quot;10.0&quot;  prefHeight=&quot;32.0&quot; prefWidth=&quot;220.0&quot; ripplerFill=&quot;WHITE&quot; text=&quot;Button 2&quot; textFill=&quot;#c1fff9&quot;&gt;         
           &lt;padding&gt;
              &lt;Insets bottom=&quot;5.0&quot; left=&quot;30.0&quot; top=&quot;5.0&quot; /&gt;
           &lt;/padding&gt;
        &lt;/JFXButton&gt;
        &lt;JFXButton alignment=&quot;BASELINE_LEFT&quot; focusTraversable=&quot;false&quot; graphicTextGap=&quot;15.0&quot; layoutX=&quot;10.0&quot; layoutY=&quot;45.0&quot;  prefHeight=&quot;32.0&quot; prefWidth=&quot;220.0&quot; ripplerFill=&quot;WHITE&quot; text=&quot;Button 3&quot; textFill=&quot;#c1fff9&quot;&gt;         
           &lt;padding&gt;
              &lt;Insets bottom=&quot;5.0&quot; left=&quot;30.0&quot; top=&quot;5.0&quot; /&gt;
           &lt;/padding&gt;
        &lt;/JFXButton&gt;
        &lt;JFXButton alignment=&quot;BASELINE_LEFT&quot; focusTraversable=&quot;false&quot; graphicTextGap=&quot;15.0&quot; layoutX=&quot;10.0&quot; layoutY=&quot;80.0&quot;  prefHeight=&quot;32.0&quot; prefWidth=&quot;220.0&quot; ripplerFill=&quot;WHITE&quot; text=&quot;Button 4&quot; textFill=&quot;#c1fff9&quot;&gt;         
           &lt;padding&gt;
              &lt;Insets bottom=&quot;5.0&quot; left=&quot;30.0&quot; top=&quot;5.0&quot; /&gt;
           &lt;/padding&gt;
        &lt;/JFXButton&gt;
        &lt;JFXButton alignment=&quot;BASELINE_LEFT&quot; focusTraversable=&quot;false&quot; graphicTextGap=&quot;15.0&quot; layoutX=&quot;10.0&quot; layoutY=&quot;115.0&quot;  prefHeight=&quot;32.0&quot; prefWidth=&quot;220.0&quot; ripplerFill=&quot;WHITE&quot; text=&quot;Button 5&quot; textFill=&quot;#c1fff9&quot;&gt;
           &lt;padding&gt;
              &lt;Insets bottom=&quot;5.0&quot; left=&quot;30.0&quot; top=&quot;5.0&quot; /&gt;
           &lt;/padding&gt;
        &lt;/JFXButton&gt;
     &lt;/children&gt;
  &lt;/VBox&gt;
  </code></pre>
  <p><strong>NavDrawerController</strong></p>
  <pre><code>public class NavDrawerController implements Initializable {
  
  
      /**
       * Initializes the controller class.
       */
      @Override
      public void initialize(URL url, ResourceBundle rb) {
          // TODO
      }    
  
      
  }
  </code></pre>
  <p>I have also tried using stackpane and the a border pane within it as I have seen on some tutorials but still getting same problem.</p>
  <p>Unfortunately there aren't much examples regarding using JFXDrawer which i'm not sure why.</p>