Ajustement du contenu dans FlowPane

Question

J'ai un flowpane au centre et j'ai appliqué un effet de curseur qui est invoqué sur un clic de bouton sur la droite (donc le curseur se déplace de droite à gauche quand il est déplié). J'ai suivi tutoriel curseur JewelSea mentionné ici Slider

Maintenant, j'ai deux flowpanes différents dans deux nœuds différents. Le flowpane contient un tableau d'étiquettes, mais la seule différence est: Un flowpane contient scrollbar et est contenu dans TitlePane tandis que l'autre est sans scrollbar et sans titlepane. Donc maintenant, si je clique sur le curseur, le contenu dans le flowpane (sans la barre de défilement & titlepane) est automatiquement ajusté mais ce n'est pas le cas avec la barre de défilement contenant le flowpane.

Voici le code correspondant pour flowpane avec scrollbar-

public void loadCase() { 
    ScrollPane s = null; 
    if (!homeController.mainTabPane.getTabs().contains(testTab)) { 
     int app = 0; 
     if (appareaList.size() > 0) { 
      FlowPane fpTestmoduleContainer = new FlowPane(); 
      FlowPane example = new FlowPane(); 
      for (ApplicationAreas appttribute : appareaList) { 
       appTestTitledPane[app] = new TitledPane(); 
       appTestTitledPane[app].setText(appttribute.getApplication_name()); 
       appTestTitledPane[app].setPrefSize(Control.USE_COMPUTED_SIZE, Control.USE_COMPUTED_SIZE); 

       /*Module loop start*/ 
       fpTestmoduleContainer.setHgap(10); 
       fpTestmoduleContainer.setVgap(10); 
       // fpTestmoduleContainer.setPrefSize(Control.USE_COMPUTED_SIZE, Control.USE_COMPUTED_SIZE); 

       List<TestModuleAttribute> testmoduleList = WSData.getTestingModuleList(appttribute.getApplication_id()); 
       ArrayList<Label> listTestlbs = new ArrayList<Label>(testmoduleList.size()); 
       System.out.println("testmoduleList.size()" + testmoduleList.size()); 
       int i = 0; 
       for (TestModuleAttribute testmattribute : testmoduleList) { 
        listTestlbs.add(new Label()); 
        listTestlbs.get(i).setText(testmattribute.getModule_name()); 

        listTestlbs.get(i).setAlignment(Pos.CENTER); 
        listTestlbs.get(i).setTextAlignment(TextAlignment.CENTER); 
        listTestlbs.get(i).setWrapText(true); 
        listTestlbs.get(i).setPrefSize(Control.USE_COMPUTED_SIZE, Control.USE_COMPUTED_SIZE); 
        listTestlbs.get(i).setId(testmattribute.getFxnode_css()); 
        Image imgInstalled = new Image(getClass().getResourceAsStream("/upgradeworkbench/View/Icons/ok.png")); 
        listTestlbs.get(i).setGraphic(new ImageView(imgInstalled)); 
        listTestlbs.get(i).setContentDisplay(ContentDisplay.BOTTOM); 
        Tooltip testtp = new Tooltip(); 
        testtp.setText("Total No. Of test Cases :" + testmattribute.getTest_case()); 
        testtp.setWrapText(true); 

        listTestlbs.get(i).setTooltip(testtp); 
        addModuleMouseClickListener(listTestlbs.get(i), testmattribute.getModule_name(), testmattribute.getFxnode_css(), testmattribute.getTest_case()); 
        i = i + 1; 
       } 
       s = new ScrollPane(); 
       s.setContent(fpTestmoduleContainer); 
       fpTestmoduleContainer.setPrefWidth(1500); 
       fpTestmoduleContainer.getChildren().addAll(listTestlbs); 
       //appTestTitledPane[app].setContent(fpTestmoduleContainer[app]); 
       listTestlbs.clear(); 
       app = app + 1; 
      } 
      appareaTestmoduleContainer.getPanes().addAll(appTestTitledPane); 
      appareaTestmoduleContainer.setExpandedPane(appTestTitledPane[0]); 
      testTab.setText("Test Cases Wizard"); 
      testTab.setText("Testing Application Foot Print"); 
     //mainTab.setClosable(true); 

      // testTab.getContent().setVisible(true); 
      HBox hb = new HBox(); 

      testTab.setContent(s); 

      } 
    } 
} 

image du curseur de travail comme prévu - avant de glisser

Après glissement (sans scrollbar) les 4 modules accéder à la rangée suivante lorsque l'espace est occupé par le curseur

Après l'ajout d'un panneau de défilement et d'un flowpane d'incorporation à l'intérieur de celui-ci,

Curseur chevauche le contenu de flowpane comme indiqué

Je veux savoir pourquoi la barre de défilement provoquant problème dans le réglage automatique du contenu à l'intérieur du flowpane et comment puis-je résoudre ce problème?

Answer 1

Ici, la largeur de votre scrollpane est fixe. Et puis il en est de même de la largeur du volet de flux. Vous devez modifier la taille de votre panneau de défilement pour que son contenu soit réinitialisé. Utilisez le code suivant.

scroll[app].setFitToHeight(true); 
scroll[app].setFitToWidth(true); 

Ce code définit la taille du panneau de défilement en fonction de la vue. Le flowpane sera également ajuster en conséquence alors.