在JavaFX-2中居中一个不可调整的窗格

Question

我正在尝试在JavaFX-2，FXML和Scene Builder中创建简单图像查看应用程序。这是我的第一个JavaFX应用程序，我在使用窗格和布局时遇到了问题。

基本上，我希望它在我的应用程序的绝对中心中以原始大小显示图像（无法缩放/调整大小）。此外，窗口应该可以调整大小，所以如果图像大于窗口的大小，我希望滚动条看起来能够看到整个图像。

我正在尝试创建的一个很好的例子是 Adob​​e Photoshop布局：http://imgur.com/iLS0lum。

这是我目前的布局：http://imgur.com/R7PJRVk。图像由黑色堆栈窗格表示。滚动条目前正在工作，但我找不到将Stack Pane放在中心的方法。

我觉得我错过了一些重要的事情，请你指点我正确的方向？

谢谢！

编辑：这是我的fxml代码：pastebin.com/CnxYEKF1

Answer 1

您使用AnchorPane作为ScrollPane的容器。如果您使用StackPane，则会使内容中心处于默认状态。但是，StackPane与任何其他Pane一样，使用尽可能多的空间，因此它总是占用所有空间，因此根本不会居中。要解决此问题，请将ScrollPane放入Group中。一个组总是和它的子一样大，你可以通过设置Scrollpane的prefHeight和prefWidth来控制它的宽度和高度。继承你的FXML（为了简化我的例子，我删除了onClick监听器上的按钮）：

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

<?import java.lang.*?>
<?import java.util.*?>
<?import javafx.geometry.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.image.*?>
<?import javafx.scene.layout.*?>
<?import javafx.scene.paint.*?>

<?import javafx.scene.Group?>
<AnchorPane id="AnchorPane" maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="700.0" prefWidth="700.0" xmlns:fx="http://javafx.com/fxml" fx:controller="test.StackOverflowController">
  <children>
    <VBox prefHeight="687.0" prefWidth="710.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
      <children>
        <ToolBar prefWidth="600.0" style="-fx-base: firebrick">
          <items>
            <Button fx:id="btn_ImgFromFile" mnemonicParsing="false" style="-fx-base: firebrick" text="Load Image From File" />
            <Button fx:id="btn_ImgFromWindow" mnemonicParsing="false" style="-fx-base: firebrick" text="Load Image From Window" />
            <Separator orientation="VERTICAL" prefHeight="21.0" />
            <Button fx:id="btn_LoadInfo" mnemonicParsing="false" style="-fx-base: firebrick" text="Load Window Info" />
            <Button fx:id="btn_SaveInfo" mnemonicParsing="false" style="-fx-base: firebrick" text="Save Window Info" />
          </items>
        </ToolBar>
        <StackPane fx:id="pane_main" prefHeight="200.0" prefWidth="200.0" VBox.vgrow="ALWAYS">
          <children>
            <Group>
            <ScrollPane fx:id="scroll_pane" prefHeight="200.0" prefWidth="200.0" AnchorPane.bottomAnchor="-1.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="1.0">
              <content>
                <StackPane fx:id="stack_pane" prefHeight="230.0" prefWidth="333.0" style="-fx-background-color: #000000;" />
              </content>
            </ScrollPane>
            </Group>
          </children>
        </StackPane>
      </children>
    </VBox>
  </children>
</AnchorPane>

结果：