Comment redimensionner des composants lorsque le volet d'onglet est redimensionné avec la souris glisser

Question

J'ai implémenté un simple glisser de la souris de l'onglet situé au centre. Le redimensionnement de la souris est très basique et ça ne marche pas très bien mais pour l'instant je peux faire glisser la bordure des onglets et augmenter la taille.

j'ai trouvé un problème. Lorsque je redimensionne les onglets situés au centre, les composants situés à côté du centre ne sont pas repoussés et cités automatiquement comme l'utilisateur peut s'y attendre, ils sont placés derrière le composant que je redimensionne. Puis-je d'une manière ou d'une autre régler tous les composants à repousser lorsque j'étends le composant principal avec la souris?

Answer 1

Comme d'autres ici, je vous recommande d'utiliser la classe SplitPane pour gérer la division de l'écran pour vous. Voici un exemple (basé sur votre capture d'écran) des volets divisés. Si vous n'aimez pas l'affichage de la barre de séparation, vous pouvez modifier le CSS en fonction de vos besoins.

import javafx.application.Application; 
import javafx.geometry.Orientation; 
import javafx.scene.Node; 
import javafx.scene.Parent; 
import javafx.scene.Scene; 
import javafx.scene.control.SplitPane; 
import javafx.scene.control.Tab; 
import javafx.scene.control.TabPane; 
import javafx.scene.control.TextArea; 
import javafx.scene.layout.BorderPane; 
import javafx.stage.Stage; 


public class FXSplitTabs extends Application{ 

    @Override 
    public void start(Stage stage) throws Exception { 
     stage.setTitle("SplitTabs"); 
     stage.setWidth(700); 
     stage.setHeight(500); 

     //Setup Center and Right 
     TabPaneWrapper wrapper = new TabPaneWrapper(Orientation.HORIZONTAL, .9); 
     TabPane centerPane = new TabPane(); 
     centerPane.getTabs().addAll(generateTab("Tab 1"),generateTab("Tab 2"), generateTab("Tab 3"), generateTab("Tab N")); 

     TabPane rightPane = new TabPane(); 
     rightPane.getTabs().addAll(generateTab("Tab 1"),generateTab("Tab 2"), generateTab("Tab 3"), generateTab("Tab N")); 
     SplitPane.setResizableWithParent(rightPane, false); 
     wrapper.addNodes(centerPane, rightPane); 

     //Add bottom 
     TabPane bottomPane = new TabPane(); 
     bottomPane.getTabs().addAll(generateTab("Tab 1"),generateTab("Tab 2"), generateTab("Tab 3"), generateTab("Tab N")); 
     TabPaneWrapper wrapperBottom = new TabPaneWrapper(Orientation.VERTICAL, .7); 
     wrapperBottom.addNodes(wrapper.getNode(), bottomPane); 

     //Add left 
     TabPane leftPane = new TabPane(); 
     leftPane.getTabs().addAll(generateTab("Tab 1"),generateTab("Tab 2"), generateTab("Tab 3"), generateTab("Tab N")); 
     TabPaneWrapper wrapperleft = new TabPaneWrapper(Orientation.HORIZONTAL, .1); 
     wrapperleft.addNodes(leftPane, wrapperBottom.getNode()); 

     Scene myScene = new Scene(wrapperleft.getNode()); 
     stage.setScene(myScene); 
     stage.sizeToScene(); 
     stage.show(); 
    } 

    public Tab generateTab(String name){ 
     Tab result = new Tab(name); 
     BorderPane content = new BorderPane(); 
     TextArea text = new TextArea(); 
     content.setCenter(text); 
     result.setContent(content); 
     return result; 
    } 

    public static void main(String[] args){ 
     FXSplitTabs.launch(args); 
    } 

    public static class TabPaneWrapper{ 
     SplitPane split; 

     public TabPaneWrapper(Orientation o, double splitLocation){ 
      split = new SplitPane(); 

      //Change the CSS (uncomment if using an external css) 
      //split.getStylesheets().add("test.css"); 

      split.setOrientation(o); 
      split.setDividerPosition(0, splitLocation); 
     } 

     public void addNodes(final Node node1, final Node node2){ 
      //Add to the split pane 
      split.getItems().addAll(node1, node2); 
     } 

     public Parent getNode(){ 
      return split; 
     } 
    } 

} 

Et si vous vouliez utiliser le CSS pour changer la façon dont les séparateurs regardent, décommentez la ligne CSS du code ci-dessus, créez un fichier test.css dans le package de base et insérez les spécifications css (est ici un exemple qui rend les diviseurs transparents):

.split-pane-divider { 
    -fx-border-color: transparent; 
    -fx-background-color: transparent; 
} 

Answer 2

comme solution alternative:

J'ai publié une première version Early Access de Drombler FX, une nouvelle plate-forme Rich Client pour JavaFX basé sur OSGi et Maven.

Il est également livré avec une version initiale d'un Docking Framework, ce qui semble être quelque chose que vous cherchez.

Vous pouvez en savoir plus sur Drombler FX ici: http://puces-blog.blogspot.ch/2012/12/drombler-fx-building-modular-javafx.html