调整FlowPane中的内容

Question

我在中心有一个flowpane，我应用了一个滑块效果，可以在右侧点击按钮时调用（因此滑块在展开时从右向左移动）。我按照这里提到的JewelSea滑块教程Slider

进行了操作

现在我在两个不同的节点中有两个不同的流程窗口。 flowpane都包含标签数组，但唯一的区别是，One flowpane包含滚动条并包含在TitlePane中，而另一个没有滚动条而没有titlepane。

所以现在，如果我点击滑块，流程窗格中的内容（没有滚动条和标题窗格）会自动调整，但与包含滚动条的flowpane的情况不同。

以下是带滚动条的流程图的相关代码 -

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);

            }
    }
}

滑块的图像按预期工作 - 滑动前

滑动（没有滚动条）后，当滑块占用空间时，4个模块到达下一行

添加滚动窗格并在其中嵌入flowpane后。滑块与流动窗格内容重叠，如图所示

我想知道为什么滚动条会导致自动调整flowpane内容的问题以及如何修复它？

Answer 1

此处滚动窗格的宽度是固定的。然后流窗格的宽度也是如此。您需要更改滚动窗格的大小，以便重置其内容。 使用以下代码。

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

此代码将根据视图设置scrollpane的大小。流程窗口也将相应调整。