java - 在 JavaFX-2 中居中一个不可调整大小的 Pane

Question

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

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

Adobe Photoshop 布局 是我尝试创建的一个很好的例子:http://imgur.com/iLS0lum .

这是我当前的布局:http://imgur.com/R7PJRVk .该图像由黑色堆栈 Pane 表示。滚动条目前正在工作，但我就是找不到将堆栈 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>

结果: