Binding JavaFX中的动态/即时调整大小

如何创建（即时）动态调整大小的JavaFX应用程序？现在，我已经编写了一个简单的应用程序，它可以动态调整大小，但布局更改直到鼠标拖动按钮释放后才会显示。我希望在释放此按钮之前立即看到结果/布局更改

我假设这是通过使用反向绑定正确的值/控件来完成的。。。任何帮助都会很好！

---

编辑：

以下是我如何让事情运转起来的（多亏了普拉斯）。正如他所说，我必须将顶层容器/布局的宽度和高度绑定到scene.width和scene.height--

var场景：场景

舞台{
标题：“应用程序标题”
场景：场景=场景{
内容：[
XMigLayout{
宽度：绑定场景。宽度；
高度：绑定场景。高度；

---

…}]}

是的，我认为你的思路是对的——显然，绑定是你想要做的事情的一种方式。你也可以看看触发器

如果您还没有阅读，请阅读本手册作为起点

布局容器自动管理其内容节点的动态布局行为。然而，通常还需要使用JavaFX脚本的绑定机制来建立布局的某些动态方面。例如，可以将HBox容器的宽度和高度绑定到场景的高度和宽度，以便在场景调整大小时，HBox容器也会调整大小

---

可能还值得阅读JavaFX布局大师的文章和博客文章。事实上，如果您已经将所有内容组织到布局中，那么您可以将顶层布局容器的宽度和高度绑定到scene.width和scene.height。我不认为顶级布局控件由任何东西管理，所以直接设置布局控件的宽度和高度可能是安全的。如果这不起作用，那么您可能成功地将layoutinfowidth和height绑定到layoutInfo

---

理想情况下，您希望在使用绑定之前使用布局管理。过度绑定可能会导致性能问题，并且在调整大小时会导致重绘速度缓慢。在这种情况下，您可能只需要对顶级容器使用绑定，然后顶级容器的所有子容器都应该相应地调整大小。至少我认为这应该行得通

Bind与JavaFX的2.0版本不同。演示如何很好地绑定属性。必须将变量设置为ObservalEnumberValue，并使用其get和set方法。安装完成后，您可以将其绑定到组件的属性

DoubleProperty x = new SimpleDoubleProperty(0);
x.set(1);
x.getValue();
imageView.xProperty().bind(x);
anchorPane.heightProperty().add(x);

post是另一种方式

scene.widthProperty().addListener( 
    new ChangeListener() {
        public void changed(ObservableValue observable, 
                            Object oldValue, Object newValue) {
            Double width = (Double)newValue;
            tbl.setPrefWidth(width);
        }
    });

scene.heightProperty().addListener(
    new ChangeListener() {
        public void changed(ObservableValue observable, 
                            Object oldValue, Object newValue) {
            Double height = (Double)newValue;
            tbl.setPrefHeight(height);
        }
    });

---

编辑：添加了另一个更合适的答案，以及我在哪里找到的答案。

以下是我最后做的事情，以获得我喜欢的大小调整。一定有更简单的方法，但我肯定不知道

我的main方法加载我的控制器和场景，然后调用我的控制器init（）方法

我正在使用一个gridpane，当用户调整整个阶段的大小时，它会动态调整大小，以便始终适合。这是因为它的大小百分比。这是通过fxml方式完成的，比使用绑定IMO更容易

<GridPane fx:id="gridPane" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="500.0" prefWidth="700.0" xmlns="http://javafx.com/javafx/8.0.121" xmlns:fx="http://javafx.com/fxml/1" fx:controller="sample.Controller">

  <columnConstraints>
    <ColumnConstraints percentWidth="50" />
    <ColumnConstraints percentWidth="50" />
  </columnConstraints>
  <rowConstraints>
    <RowConstraints percentHeight="35" />
    <RowConstraints percentHeight="35" />
    <RowConstraints percentHeight="35" />
  </rowConstraints>
   <children>

      <TextArea fx:id="textArea_Console" prefHeight="200.0" prefWidth="200.0" promptText="console/reponse" GridPane.columnIndex="1" GridPane.rowIndex="2" />

      <!-- <MediaView fx:id="mediaView_Images" fitHeight="225.0" fitWidth="225.0" GridPane.halignment="LEFT" GridPane.valignment="BOTTOM" /> -->


      <TextArea fx:id="textArea_RoboAvail" maxHeight="-Infinity" maxWidth="-Infinity" prefHeight="121.0" prefWidth="123.0" promptText="robots available" GridPane.columnIndex="1" GridPane.halignment="RIGHT" GridPane.valignment="TOP" />

      <TextArea fx:id="textArea_SensorData" maxHeight="-Infinity" maxWidth="-Infinity" prefHeight="249.0" prefWidth="106.0" promptText="sensor data" GridPane.halignment="RIGHT" GridPane.valignment="TOP" />

      <TextArea fx:id="textArea_Scripting" prefHeight="200.0" prefWidth="200.0" promptText="Scripting" GridPane.columnIndex="1" GridPane.rowIndex="1" />

      <Label text="Currently Viewing" GridPane.halignment="LEFT" GridPane.valignment="TOP" />

      <TextArea maxHeight="-Infinity" maxWidth="-Infinity" prefHeight="250.0" prefWidth="100.0" promptText="to do list" GridPane.columnIndex="1" GridPane.halignment="LEFT" GridPane.valignment="TOP" />

      <ImageView fx:id="imageView_Images"  fitHeight="233.0" fitWidth="225.0" pickOnBounds="true" preserveRatio="true" GridPane.halignment="LEFT" GridPane.valignment="TOP" />

      <Label fx:id="label_CheatSheet" text="Label" GridPane.halignment="LEFT" GridPane.rowIndex="2" GridPane.valignment="BOTTOM" />




   </children>

---

这就成功了。谢谢正如您所说，我必须将顶层容器（布局）绑定到场景宽度和高度。只需要创建一个变量来提供引用scene.width和scene.height的方法。我编辑了我的原始帖子来展示这个解决方案。谢谢你的回复！是的，我已经用布局容器构建了我的界面。我将查看您列出的一些资源。。。虽然Amy Fowler的博客因“社交媒体”在我的工作场所被屏蔽。很糟糕。我已经修复了链接，但请注意，我的答案是指不再受支持的原始JavaFX脚本。尝试此操作时，我遇到一个错误，我的类“无法覆盖JavaFX.scene.Node中的get$scene（）；覆盖方法是静态的”将变量名更改为“scene1”会使错误消失。仅当我在内容字段中使用的类与我的run函数在同一个文件中定义时，才应用此选项。

<GridPane fx:id="gridPane" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="500.0" prefWidth="700.0" xmlns="http://javafx.com/javafx/8.0.121" xmlns:fx="http://javafx.com/fxml/1" fx:controller="sample.Controller">

  <columnConstraints>
    <ColumnConstraints percentWidth="50" />
    <ColumnConstraints percentWidth="50" />
  </columnConstraints>
  <rowConstraints>
    <RowConstraints percentHeight="35" />
    <RowConstraints percentHeight="35" />
    <RowConstraints percentHeight="35" />
  </rowConstraints>
   <children>

      <TextArea fx:id="textArea_Console" prefHeight="200.0" prefWidth="200.0" promptText="console/reponse" GridPane.columnIndex="1" GridPane.rowIndex="2" />

      <!-- <MediaView fx:id="mediaView_Images" fitHeight="225.0" fitWidth="225.0" GridPane.halignment="LEFT" GridPane.valignment="BOTTOM" /> -->


      <TextArea fx:id="textArea_RoboAvail" maxHeight="-Infinity" maxWidth="-Infinity" prefHeight="121.0" prefWidth="123.0" promptText="robots available" GridPane.columnIndex="1" GridPane.halignment="RIGHT" GridPane.valignment="TOP" />

      <TextArea fx:id="textArea_SensorData" maxHeight="-Infinity" maxWidth="-Infinity" prefHeight="249.0" prefWidth="106.0" promptText="sensor data" GridPane.halignment="RIGHT" GridPane.valignment="TOP" />

      <TextArea fx:id="textArea_Scripting" prefHeight="200.0" prefWidth="200.0" promptText="Scripting" GridPane.columnIndex="1" GridPane.rowIndex="1" />

      <Label text="Currently Viewing" GridPane.halignment="LEFT" GridPane.valignment="TOP" />

      <TextArea maxHeight="-Infinity" maxWidth="-Infinity" prefHeight="250.0" prefWidth="100.0" promptText="to do list" GridPane.columnIndex="1" GridPane.halignment="LEFT" GridPane.valignment="TOP" />

      <ImageView fx:id="imageView_Images"  fitHeight="233.0" fitWidth="225.0" pickOnBounds="true" preserveRatio="true" GridPane.halignment="LEFT" GridPane.valignment="TOP" />

      <Label fx:id="label_CheatSheet" text="Label" GridPane.halignment="LEFT" GridPane.rowIndex="2" GridPane.valignment="BOTTOM" />




   </children>

  private void setupUI()
{
    imageView_Images.setImage( new Image("file:///C:\\Users\\administration\\IdeaProjects\\Robot User Interface\\Media\\filler.jpeg"));



   mHeight = gridPane.getHeight();
   mWidth = gridPane.getWidth();

   //for initial startup sizing
    dynamicRsize();


    //callbacks to detect changes for sizing
    gridPane.widthProperty().addListener(new ChangeListener<Number>() {
        @Override
        public void changed(ObservableValue<? extends Number> observable, Number oldValue, Number newValue) {
            mWidth = newValue.doubleValue();
            dynamicRsize();
        }
    });

    gridPane.heightProperty().addListener(new ChangeListener<Number>() {
        @Override
        public void changed(ObservableValue<? extends Number> observable, Number oldValue, Number newValue) {
            mHeight = newValue.doubleValue();
            dynamicRsize();
        }
    });


    setup_TextArea_Scriptng();
    setup_Label_CheatSheet();

}

  private void dynamicRsize()
{
    //two columns 50/50
    //three rows 35/35/30

    double columnType1 = mWidth/2;
    double rowType1 = mHeight * .35;
    double rowType2 = mHeight * .3;

    //node 1
    imageView_Images.setFitWidth(columnType1 * .75);
    textArea_SensorData.setPrefWidth(columnType1 * .25);

   //node 2

    //node 3

    //node 4

    //node 5

    //node 6







}