为什么这个 JavaFX 应用程序看起来与 SceneBuilder 中的不同？答案

【问题标题】：Why does this JavaFX application look way different than when it's in SceneBuilder?为什么这个 JavaFX 应用程序看起来与 SceneBuilder 中的不同？
【发布时间】：2020-04-22 12:00:12
【问题描述】：

我试图在 JavaFX 上制作我的第一个应用程序，但这让我非常沮丧！应用程序的这些元素在 SceneBuilder 中是完美的，但现在它只是错位了！

我认为是因为我在运行应用程序时出现了这个错误：

WARNING: Loading FXML document with JavaFX API of version 11.0.1 by JavaFX runtime of version 8.0.231

我已尝试将 AnchorPane 属性更改为：

<AnchorPane prefHeight="129.0" prefWidth="205.0" xmlns="http://javafx.com/javafx" xmlns:fx="http://javafx.com/fxml"">
   ...
</AnchorPane>

但它只是修复警告而不是错位。

这是我的完整代码：

Main.java

package application;

import javafx.application.Application;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.stage.Stage;
import javafx.scene.Scene;
//import javafx.scene.layout.BorderPane;


public class Main extends Application {
    @Override
    public void start(Stage primaryStage) {
        try {
            //BorderPane root = new BorderPane();
            Parent root = FXMLLoader.load(getClass().getResource("Root.fxml"));
            Scene scene = new Scene(root,400,400);
            scene.getStylesheets().add(getClass().getResource("application.css").toExternalForm());
            primaryStage.setScene(scene);
            primaryStage.show();
        } catch(Exception e) {
            e.printStackTrace();
        }
    }

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

Root.fxml

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.scene.control.Button?>
<?import javafx.scene.control.TextField?>
<?import javafx.scene.layout.AnchorPane?>


<AnchorPane prefHeight="129.0" prefWidth="205.0" xmlns="http://javafx.com/javafx/11.0.1" xmlns:fx="http://javafx.com/fxml/1">
   <children>
      <TextField layoutX="28.0" layoutY="23.0" />
      <Button layoutX="77.0" layoutY="65.0" mnemonicParsing="false" text="Button" />
   </children>
</AnchorPane>

【问题讨论】：

两个原因：（1）您使用的AnchorPane 对窗口大小调整没有响应； (2) 您在代码中设置Scene 的初始大小，而不是让Scene 使用根的首选尺寸。
你将一个 129×205 的 AnchorPane 放在一个 400×400 的场景中。你期待什么结果？
您可以通过不使用这种过时的 Java 版本来避免警告。切换到 Java 11+。当前版本是 13 而不是 8。

标签： java javafx scenebuilder efxclipse

【解决方案1】：

正如@Slaw 提到的AnchorPane 不是响应式布局。您可以考虑使用 VBox 和 CENTER 对齐，因为您有两个垂直定位的节点。

<?xml version="1.0" encoding="UTF-8"?>

<?import javafx.geometry.Pos?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.TextField?>
<?import javafx.scene.layout.VBox?>


<VBox prefHeight="129.0"  alignment="CENTER" prefWidth="205.0" xmlns="http://javafx.com/javafx/11.0.1" xmlns:fx="http://javafx.com/fxml/1">
   <children>
      <TextField fx:id="INPUT_FIELD" />
      <Button fx:id="SUBMIT" mnemonicParsing="false" text="Button" />
   </children>
</VBox>

一般情况下，AnchorPane 可以设置为父布局，可以在上面放置 VBox，并可以在 VBox 上添加控件（Button、TextField 等）。

我认为是因为我在运行应用程序时出现了这个错误：

警告：版本 8.0.231 的 JavaFX 运行时使用版本 11.0.1 的 JavaFX API 加载 FXML 文档

不，这只是一个警告！您可以通过here 找到大量讨论。

【讨论】：