JavaFX Slide Panel

[MichaProgs]

Guten Abend zusammen,

ich versuche gerade eine Navigation zu basteln, die beim hovern eines Buttons eine Subnavigation expandet (Denglisch ftw :bae.

Zuerst die FXML in Kurzfassung:

<VBox>
    <children>
       <Button id="buttonNav" fx:id="btnHome" text="Home" />
       <Button id="buttonNav" fx:id="btnCustomer" text="Kundenstamm" />
       <VBox fx:id="expandpanel">
         <!-- SubButtons -->
     </VBox>
    <Button id="buttonNav" fx:id="btnProducts" text="Artikelstamm" />
    <Button id="buttonNav" fx:id="btnDeliverer" text="Lieferantenstamm" />
  </children>
</VBox>

Nun wollte ich die VBox mit den Subbuttons zwar in der FXML-Datei belassen, allerdings so initialisieren, dass die Höhe gleich 0 ist, und dann beim Hovern die benötigte Höhe annimmt - geht aber leider nicht. Die VBox lässt sich mit diesem Inhalt nicht auf 0 setzen und somit "unsichtbar" machen.
Die Buttons erst beim Hovern in der entsprechenden Methode hinzufügen halte ich für zu Umständlich und Performancelastig. Außerdem würde der Vorteil der FXML-Datei entfallen, da die Buttons der Subnavigation in Java geschrieben werden müssten.

Hat jemand eine Idee?

Gruß
TB94

P.S. Das TitledPane habe ich schon versucht, entspricht aber nicht ganz meiner Vorstellung.

 

[Ruzmanz]

Kannst du mal ein Bild oder eine Skizze von deinem Menü machen, das sieht nicht so aus als würde es prinzipell klappen ... Da müsste irgendwo ein StackPane sein, um andere UI-Elemente nicht zu beeinflussen. Zudem müsste das Menü mMn so formatiert sein:

<VBox>
    <children>
       <Button id="buttonNav" fx:id="btnHome" text="Home" />
       <VBox fx:id="expandpanel">
         <Button id="buttonNav" fx:id="btnCustomer" text="Kundenstamm" />
         <!-- SubButtons -->
     </VBox>
    <Button id="buttonNav" fx:id="btnProducts" text="Artikelstamm" />
    <Button id="buttonNav" fx:id="btnDeliverer" text="Lieferantenstamm" />
  </children>
</VBox>

 

[MichaProgs]

Hallo Ruzmanz,

danke für deine schnelle Antwort. Im Anhang ein Bild der Navigation (FXML).

Hier die FXML wie auf dem Bild zu sehen:

<VBox>
       <children>
           <Button id="buttonNav" fx:id="btnHome" text="Home" />
           <Button id="buttonNav" fx:id="btnCustomer" text="Kundenstamm" />
           <VBox fx:id="expandpanel">
         	<Button id="buttonNav" text="Kunde anzeigen" />
         	<Button id="buttonNav" text="Kunde suchen" />
         	<Button id="buttonNav" text="Kunde anlegen" />
          </VBox>
          <Button id="buttonNav" fx:id="btnProducts" text="Artikelstamm" />
          <Button id="buttonNav" fx:id="btnDeliverer" text="Lieferantenstamm" />
   </children>
</VBox>

Den zweiten Versuch den ich gestern dann doch noch gestartet habe, war die Buttons über Java zu erstellen

@FXML private void initialize(){
		
	this.btnCustomerData = new Button("Kunde anzeigen");
	this.btnCustomerData.setId("buttonNav");
	this.btnCustomerSearch = new Button("Kunde suchen");
	this.btnCustomerSearch.setId("buttonNav");
	this.btnCustomerNew = new Button("Kunde anlegen");
	this.btnCustomerNew.setId("buttonNav");
		
	this.mouseHover();
		
}

und via Methode der VBox (expandpanel) hinzuzufügen, bzw wieder zu entfernen.

private void mouseHover(){
		
	final EventHandler<MouseEvent> mouseenter = new EventHandler<MouseEvent>() {

		@Override
		public void handle(MouseEvent event) {
				
			if(event.getSource() == btnCustomer){
					
				expandpanel.getChildren().addAll(btnCustomerData, btnCustomerSearch, btnCustomerNew);
					
			}
				
		}
			
	};
		
	final EventHandler<MouseEvent> mouseexit = new EventHandler<MouseEvent>() {

		@Override
		public void handle(MouseEvent event) {
				
			if(event.getSource() == btnCustomer){
					
				expandpanel.getChildren().clear();
					
			}
				
				
		}
	};
		
	btnCustomer.setOnMouseEntered(mouseenter);
	btnCustomer.setOnMouseExited(mouseexit);
		
}

Das Problem hierbei: Sobald man mit der Maus den Button "Kundenstamm" verlässt, werden die Buttons logischerweise wieder gelöscht. Da müsste ich nochmal eine if-Funktion einbauen, dass wenn die Maus die jeweiligen Subbuttons berührt, diese nicht entfernt werden.

Finde dieses Verfahren darum auch leider nicht so schön und würde es gern komplett in der FXML-Datei lösen.

Ich hoffe die Erklärung ist halbwegs Verständlich.

Gruß
TB94