Question

我想创建一个左侧菜单和右侧视图的应用程序。我有不同的fxml文件。 1个主要视图和多个视图。

现在我加载了不同的视图，但右边的视图不是他的父视图。

主视图

    <GridPane
        xmlns="http://javafx.com/javafx/8.0.112"
        xmlns:fx="http://javafx.com/fxml/1"
        fx:controller="controller.Controller">
  <columnConstraints>
    <ColumnConstraints percentWidth="30.0" />
    <ColumnConstraints percentWidth="70.0" />
  </columnConstraints>
  <rowConstraints>
    <RowConstraints />
  </rowConstraints>
   <children>
      <GridPane maxWidth="Infinity" GridPane.columnIndex="0" GridPane.rowIndex="0">
          <columnConstraints>
              <ColumnConstraints percentWidth="100.0" />
          </columnConstraints>
          <rowConstraints>
              <RowConstraints />
              <RowConstraints />
              <RowConstraints />
              <RowConstraints />
              <RowConstraints />
          </rowConstraints>
          <children>
              <Button fx:id="devices" maxWidth="Infinity" mnemonicParsing="false" text="Devices" GridPane.columnIndex="0" GridPane.rowIndex="0" />
              <Button fx:id="inventory" maxWidth="Infinity" mnemonicParsing="false" text="Inventory" GridPane.columnIndex="0" GridPane.rowIndex="1" />
          </children>
      </GridPane>
      <Pane
              fx:id="container"
              minWidth="Infinity"
              maxWidth="Infinity"
              GridPane.hgrow="ALWAYS"
              GridPane.vgrow="ALWAYS"
              GridPane.columnIndex="1"
              GridPane.columnSpan="1"
              GridPane.rowIndex="0">
      </Pane>
   </children>
</GridPane>

容器中的自定义视图加载

<GridPane
        xmlns="http://javafx.com/javafx/8.0.112"
        xmlns:fx="http://javafx.com/fxml/1"
        fx:controller="controller.DevicesController"
        GridPane.hgrow="ALWAYS"
        GridPane.vgrow="ALWAYS">

    <children>
        <TableView
                GridPane.columnIndex="0"
                GridPane.columnSpan="1"
                GridPane.hgrow="ALWAYS"
                GridPane.vgrow="ALWAYS"
                GridPane.rowIndex="0">
            <columns>
                <TableColumn text="Devices" />
                <TableColumn text="C2" />
            </columns>
        </TableView>
    </children>
</GridPane>

当前表单

控制器

public class Controller implements Initializable {
    @FXML private Pane container;
    @FXML private Button devices;
    @FXML private Button inventory;

    private HashMap<Views, Node> views;

    private enum Views {
        DEVICES,
        INVENTORY
    }

    @Override
    public void initialize(URL location, ResourceBundle resources) {
        try {
            views = new HashMap<>();

            views.put(Views.DEVICES, FXMLLoader.load(getClass().getResource("../view/" + "view-devices.fxml")));
            views.put(Views.INVENTORY, FXMLLoader.load(getClass().getResource("../view/" + "view-inventory.fxml")));

            devices.setOnMouseClicked(v -> load(Views.DEVICES));
            inventory.setOnMouseClicked(v -> load(Views.INVENTORY));
        } catch (IOException e) {
            e.printStackTrace();
        }
    }

    public void load(Views view){
        if (views.containsKey(view)) {
            Node newView = views.get(view);

            if (!container.getChildren().contains(newView)) {
                container.getChildren().add(newView);
            } else {
                newView.resize(container.getMaxWidth(), container.getMaxHeight());
                newView.toFront();
            }
        } else {
            System.out.println("Error: key not found in map");
        }
    }
}

我希望右视图适合容器。

Answer 1

您用于显示器右侧容器的Pane不执行任何布局，因此无法使内容填充可用空间（无论您使用何种设置）。

使用BorderPane代替容器：

  <BorderPane 
          fx:id="container"
          GridPane.hgrow="ALWAYS"
          GridPane.vgrow="ALWAYS"
          GridPane.columnIndex="1"
          GridPane.columnSpan="1"
          GridPane.rowIndex="0">
  </BorderPane>

然后在控制器中，您可以简单地将新内容设置为每次中心：

public class Controller implements Initializable {
    @FXML private BorderPane container;

    // ...

    public void load(Views view){
        if (views.containsKey(view)) {
            Node newView = views.get(view);
            container.setCenter(newView);

        } else {
            System.out.println("Error: key not found in map");
        }
    }

}

动态添加的视图不适合Pane

1 个答案: