Question

我有一个包含3行的列。每行包括一个图像。此列是GridPane的子项。正如您在以下FXML中看到的那样：

<GridPane GridPane.columnIndex="1">
    <columnConstraints>
      <ColumnConstraints hgrow="SOMETIMES" maxWidth="7.0" minWidth="0.0" prefWidth="0.0" />
      <ColumnConstraints hgrow="SOMETIMES" maxWidth="30.0" minWidth="10.0" prefWidth="30.0" />
    </columnConstraints>
    <rowConstraints>
      <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
      <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
      <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
    </rowConstraints>
    <children>
       <ImageView fitHeight="31.0" fitWidth="29.0" onMousePressed="#addNewUser" pickOnBounds="true" preserveRatio="true" GridPane.columnIndex="1" GridPane.rowIndex="0">
            <image>
              <Image url="@/views/add.png" />
            </image>
      </ImageView>
      <ImageView fitHeight="31.0" fitWidth="29.0" onMousePressed="#removeUser" pickOnBounds="true" preserveRatio="true" GridPane.columnIndex="1" GridPane.rowIndex="1">
            <image>
              <Image url="@/views/remove.png" />
            </image>
      </ImageView>
      <ImageView fitHeight="31.0" fitWidth="29.0" onMousePressed="#editUser" pickOnBounds="true" preserveRatio="true" GridPane.columnIndex="1" GridPane.rowIndex="2">
            <image>
              <Image url="@/views/edit.png" />
            </image>
      </ImageView>
   </children>
</GridPane>

根据我的理解GridPane具有固定大小，并且不会根据父级的大小进行相应更改。（如果我错了，请随意纠正我）。因此，我需要用AnchorPane包装它们，这可以调整大小。所以我添加了它，我得到了以下内容：

        <children>
            <AnchorPane prefHeight="1000.0" prefWidth="900.0" style="-fx-background-color:red" >
                <GridPane GridPane.columnIndex="1">
                    <columnConstraints>
                        <ColumnConstraints hgrow="SOMETIMES" maxWidth="7.0" minWidth="0.0" prefWidth="0.0" />
                        <ColumnConstraints hgrow="SOMETIMES" maxWidth="30.0" minWidth="10.0" prefWidth="30.0" />
                    </columnConstraints>
                    <rowConstraints>
                        <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
                        <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
                        <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
                    </rowConstraints>
                    <children>
                        <ImageView fitHeight="31.0" fitWidth="29.0" onMousePressed="#addNewUser" pickOnBounds="true" preserveRatio="true" GridPane.columnIndex="1" GridPane.rowIndex="0">
                            <image>
                                <Image url="@/views/add.png" />
                            </image>
                        </ImageView>
                        <ImageView fitHeight="31.0" fitWidth="29.0" onMousePressed="#removeUser" pickOnBounds="true" preserveRatio="true" GridPane.columnIndex="1" GridPane.rowIndex="1">
                            <image>
                                <Image url="@/views/remove.png" />
                            </image>
                        </ImageView>
                        <ImageView fitHeight="31.0" fitWidth="29.0" onMousePressed="#editUser" pickOnBounds="true" preserveRatio="true" GridPane.columnIndex="1" GridPane.rowIndex="2">
                            <image>
                                <Image url="@/views/edit.png" />
                            </image>
                        </ImageView>
                    </children>
                </GridPane>
            </AnchorPane>
        </children>
    </GridPane>
</children>

现在的结果是，所有这三个人都相互依存，根本没有任何调整大小的迹象。为了调试我已经将AnchorPane的背景设置为红色，并且它显示高度和它的宽度是应该的，但仍然所有这些图像都相互粘连。知道我该如何解决这个问题？

Answer 1

您的data.groupby(by=['class_energy'])['sum_time'].sum()占据了所有可用的位置，但其子女却没有。这是默认行为，您可以通过将所有锚点显式设置为零来更改它。

AnchorPane

同样，如果您不希望桌子垂直拉伸，则只能设置左右锚点。

<GridPane GridPane.columnIndex="1"
          AnchorPane.topAnchor="0" AnchorPane.rightAnchor="0"
          AnchorPane.bottomAnchor="0" AnchorPane.leftAnchor="0">

使AnchorPane基于其父级可调整大小

1 个答案: