如何在 VBox JavaFX 中调整子 AnchorPanes 的大小

Question

这是我的主UIMain UI

我在 AnchorPane 中有一个 VBox (Fxid:datePane)。 Vbox 是蓝色的。

单击带有标签 "Add" 的按钮时，"second.fxml" 文件将加载到 VBox (Fxid:datePane) 中。

加载的fxml文件采用Vbox的高度和宽度。

second.fxml 有一个红色的 VBox。

但是，如果我调整屏幕大小，加载的文件不会相应地更改其高度和宽度。 After resizing the screen

如何确保加载的 fxml 文件采用其父 VBox (Fxid:datePane) 的宽度和高度？？？

这是我的 FxmlController.java 文件

@FXML
 private Button btnAdd;

 @FXML
 private VBox datePane;

 @FXML
   private VBox vbxsecond;

 @FXML
 private VBox vbxThird;

 @FXML
 private AnchorPane apLoader;

 VBox v;

@Override
public void initialize(URL arg0, ResourceBundle arg1) {
    // TODO Auto-generated method stub
    double w = apLoader.getWidth();
     double h = apLoader.getHeight();
    System.out.println(h);
}

public void setDataPane(Node node) {
    // update VBox with new form(FXML) depends on which button is clicked
    datePane.getChildren().setAll(node);

}

public VBox fadeAnimate(String url) throws IOException {
     v = (VBox) FXMLLoader.load(getClass().getResource(url));
    FadeTransition ft = new FadeTransition(Duration.millis(1500));
    ft.setNode(v);
    ft.setFromValue(0.1);
    ft.setToValue(1);
    ft.setCycleCount(1);
    ft.setAutoReverse(false);
    double w = datePane.getWidth();
     double h = datePane.getHeight();
     v.setPrefHeight(h);
     v.setPrefWidth(w);

    ft.play();
    return v;


}

public void loadPane() throws IOException {

    try{

        setDataPane(fadeAnimate("/resources/second.fxml"));


   }catch(IOException e)
   {
       e.printStackTrace();
   }

}

public void loadPane2 () throws IOException {

    try{

        setDataPane(fadeAnimate("/resources/third.fxml"));


   }catch(IOException e)
   {
       e.printStackTrace();
   }

}

这是我的 Main.java 文件

@FXML
private VBox vbxsecond;

 @FXML
    private VBox datePane;

@Override
public void start(Stage primaryStage) {
    try {
        //BorderPane root = new BorderPane();
        Parent root = FXMLLoader.load(getClass().getResource("/resources/dashboard.fxml"));
        Scene scene = new Scene(root);
        scene.getStylesheets().add(getClass().getResource("application.css").toExternalForm());
        primaryStage.setScene(scene);
        //primaryStage.setMaximized(true);
        primaryStage.show();            
    } catch(Exception e) {
        e.printStackTrace();
    }
}

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

这是我的 dashboard.fxml 文件

AnchorPane minHeight="800.0" prefHeight="800.0" prefWidth="800.0" xmlns="http://javafx.com/javafx/8.0.111" xmlns:fx="http://javafx.com/fxml/1" fx:controller="application.FxmlController">
   <children>
      <SplitPane dividerPositions="0.29797979797979796" layoutX="14.0" layoutY="14.0" prefHeight="800.0" prefWidth="800.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
        <items>
          <AnchorPane minHeight="0.0" minWidth="0.0" prefHeight="798.0" prefWidth="192.0">
               <children>
                  <Button fx:id="btnAdd" layoutX="22.0" layoutY="122.0" mnemonicParsing="false" onAction="#loadPane" prefHeight="25.0" prefWidth="51.0" text="Add" AnchorPane.leftAnchor="22.0" AnchorPane.topAnchor="122.0" />
                  <Button fx:id="btnadd2" layoutX="57.0" layoutY="281.0" mnemonicParsing="false" onAction="#loadPane2" text="ADD second" />
               </children>
            </AnchorPane>
          <AnchorPane fx:id="apLoader" minHeight="0.0" minWidth="0.0" prefHeight="158.0" prefWidth="814.0">
               <children>
                  <VBox fx:id="datePane" layoutX="10.0" layoutY="23.0" prefHeight="798.0" prefWidth="628.0" style="-fx-background-color: Blue;" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0" />
               </children>
            </AnchorPane>
        </items>
      </SplitPane>
   </children>
</AnchorPane>

这是我的 second.fxml 文件

<VBox fx:id="vbxsecond" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="800.0" prefWidth="814.0" style="-fx-background-color: Red;" xmlns="http://javafx.com/javafx/8.0.111" xmlns:fx="http://javafx.com/fxml/1">
   <children>
      <Label fx:id="vbxSecond" text="HELLOOO" VBox.vgrow="ALWAYS">
         <font>
            <Font size="96.0" />
         </font>
      </Label>
   </children>
</VBox>

这是我的 third.fxml 文件

<VBox fx:id="vbxThird" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="800.0" prefWidth="814.0" style="-fx-background-color: Pink;" xmlns="http://javafx.com/javafx/8.0.111" xmlns:fx="http://javafx.com/fxml/1">
   <children>
      <Label text="Third HELOO" VBox.vgrow="ALWAYS">
         <font>
            <Font size="85.0" />
         </font>
      </Label>
   </children>
</VBox>

Answer 1

我解决了这个问题。我只需要将 second.fxml 中的 VBox 和 main.fxml 中的 VBox (Fxid:datePane) 的值设置为

AnchorPane.topAnchor="0.0"
AnchorPane.bottomAnchor="0.0" 
AnchorPane.leftAnchor="0.0" 
AnchorPane.rightAnchor="0.0"

成功了。

如何在 VBox JavaFX 中调整子 AnchorPanes 的大小

How to resize child AnchorPanes within a VBox JavaFX

javafx

scenebuilder