JavaFX：如何将ImageView置于窗格中心

Question

JavaFX：如何在窗格中居中ImageView

您好， 我试图根据当前窗口大小居中并调整ImageView的大小。

如果我将ImageView放入窗格，我无法居中。 如果我把它放入StackPane，那么调整Image的大小并不起作用。

任何想法，我做错了什么？ 谷歌无法帮助我。

使用Pane提取FXML

      <HBox prefHeight="100.0" prefWidth="200.0" VBox.vgrow="ALWAYS">
       <children>
         <Button maxWidth="-Infinity" minWidth="-Infinity" mnemonicParsing="false" prefHeight="2000.0" prefWidth="100.0" text="Button" HBox.hgrow="ALWAYS" />
         <Pane fx:id="paneMainImage" prefHeight="200.0" prefWidth="200.0" HBox.hgrow="ALWAYS">
            <children>
               <ImageView fx:id="imageMainImage" fitHeight="10.0" fitWidth="10.0" pickOnBounds="true" preserveRatio="true" />
            </children>
            <HBox.margin>
               <Insets />
            </HBox.margin>
         </Pane>
         <Button maxWidth="-Infinity" minWidth="-Infinity" mnemonicParsing="false" prefHeight="2000.0" prefWidth="100.0" text="Button" HBox.hgrow="ALWAYS" />
        </children>
      </HBox>

这里是Java代码

public class FXMLDocumentController implements Initializable {

@FXML
Pane paneMainImage;

@FXML
ImageView imageMainImage;

@Override
public void initialize(URL url, ResourceBundle rb) {
    Image i = new Image(getClass().getResource("resources/DSC_0168.JPG").toString());
    paneMainImage.getWidth();
    paneMainImage.getHeight();
    imageMainImage.setImage(i);
    imageMainImage.fitWidthProperty().bind(paneMainImage.widthProperty());
    imageMainImage.fitHeightProperty().bind(paneMainImage.heightProperty());
}
}

documentation

与StackPane类似的代码

 <HBox prefHeight="100.0" prefWidth="200.0" VBox.vgrow="ALWAYS">
     <children>
        <Button maxWidth="-Infinity" minWidth="-Infinity" mnemonicParsing="false" prefHeight="2000.0" prefWidth="100.0" text="Button" HBox.hgrow="ALWAYS" />
        <StackPane fx:id="paneMainImage" prefHeight="150.0" prefWidth="200.0" HBox.hgrow="ALWAYS">
           <children>
              <ImageView fx:id="imageMainImage" fitHeight="10.0" fitWidth="10.0" pickOnBounds="true" preserveRatio="true" />
           </children>
        </StackPane>
        <Button maxWidth="-Infinity" minWidth="-Infinity" mnemonicParsing="false" prefHeight="2000.0" prefWidth="100.0" text="Button" HBox.hgrow="ALWAYS" />
     </children>
  </HBox>

爪哇

public class FXMLDocumentController implements Initializable {

@FXML
StackPane paneMainImage;

@FXML
ImageView imageMainImage;

@Override
public void initialize(URL url, ResourceBundle rb) {
    Image i = new Image(getClass().getResource("resources/DSC_0168.JPG").toString());
    paneMainImage.getWidth();
    paneMainImage.getHeight();
    imageMainImage.setImage(i);
    imageMainImage.fitWidthProperty().bind(paneMainImage.widthProperty());
    imageMainImage.fitHeightProperty().bind(paneMainImage.heightProperty());
}
}

Answer 1

对another post进行了类似的讨论。您是否尝试过使用其中讨论的任何解决方案（按复杂程度排序）？

1. 使用BorderPane作为图像的父级以使其居中使用

2. setX和setY方法显式设置图像的位置