JavaFX";“无止境”;窗玻璃

JavaFX";“无止境”;窗玻璃,java,canvas,javafx,fxml,Java,Canvas,Javafx,Fxml,因此,我尝试在JavaFX中使用画布和工具栏创建一种类似于paint/photoshop的应用程序。如果可能的话,我想要的是画布相当大,甚至是无穷无尽。我希望用户能够在画布上进行平移、放大和缩小等操作。我的解决方案是将工具栏放在BorderPane中,画布是常规窗格(因此不是JavaFX画布),然后将BorderPane堆叠在StackPane中的窗格顶部。出现的问题是,当我想使窗格真正变大时,这会将BorderPane的内容推离屏幕,因为它们都在同一个StackPane中 下面是StackPa

因此,我尝试在JavaFX中使用画布和工具栏创建一种类似于paint/photoshop的应用程序。如果可能的话,我想要的是画布相当大,甚至是无穷无尽。我希望用户能够在画布上进行平移、放大和缩小等操作。我的解决方案是将工具栏放在BorderPane中,画布是常规窗格(因此不是JavaFX画布),然后将BorderPane堆叠在StackPane中的窗格顶部。出现的问题是,当我想使窗格真正变大时,这会将BorderPane的内容推离屏幕,因为它们都在同一个StackPane中

下面是StackPane fxml:

<StackPane fx:controller="controller.MainController" xmlns:fx="http://javafx.com/fxml">

  <Pane fx:id="aDrawPane">

  </Pane>
  <BorderPane fx:id="aBorderPane">
      <top>
          <VBox>
              <ToolBar fx:id="aToolBar" orientation="HORIZONTAL">
                  <HBox fx:id="umlBox">
                      <Button text="Create" fx:id="createBtn"/>
                      <Button text="Package" fx:id="packageBtn"/>
                      <Button text="Edge" fx:id="edgeBtn"/>
                      <Button text="Draw" fx:id="drawBtn"/>
                  </HBox>
                  <HBox fx:id="utilBox">
                      <Button text="Select" fx:id="selectBtn"/>
                      <Button text="Move" fx:id="moveBtn"/>
                  </HBox>
                  <HBox fx:id="undoBox">
                      <Button text="Delete" fx:id="deleteBtn"/>
                      <Button text="Undo" fx:id="undoBtn"/>
                      <Button text="Redo" fx:id="redoBtn"/>
                  </HBox>
                  <HBox fx:id="recognizeBox">
                      <Button text="Recognize" fx:id="recognizeBtn"/>
                  </HBox>
              </ToolBar>
          </VBox>
      </top>
      <bottom>
          <ToolBar>
              <Pane HBox.hgrow="ALWAYS" />
              <VBox alignment="CENTER">
                  <Slider fx:id="zoomSlider" min="10"  max="200" value="100"/>
                  <Label text="Zoom"/>
              </VBox>
              <Pane HBox.hgrow="ALWAYS" />
          </ToolBar>
      </bottom>
  </BorderPane>
</StackPane>

该fxml实际上也放在该fxml内的选项卡中:

<VBox fx:controller="controller.TabController" xmlns:fx="http://javafx.com/fxml">
<MenuBar fx:id="menuBar">
    <menus>
        <Menu text="File">
            <items>
                <MenuItem text="New" onAction="#handleMenuActionNew"/>
                <MenuItem text="Open" onAction="#handleMenuActionLoad"/>
                <MenuItem text="Save" onAction="#handleMenuActionSave"/>
                <SeparatorMenuItem/>
                <CheckMenuItem fx:id="mouseMenuItem" text="Activate Mouse" onAction="#handleMenuActionMouse" selected="false"/>
                <SeparatorMenuItem/>
                <MenuItem text="Exit" onAction="#handleMenuActionExit"/>
            </items>
        </Menu>
        <Menu text="Edit">
            <items>
                <MenuItem text="Copy"/>
                <MenuItem text="Cut"/>
                <MenuItem text="Paste"/>
            </items>
        </Menu>
        <Menu text="View">
            <items>
                <CheckMenuItem fx:id="umlMenuItem" text="UML" onAction="#handleMenuActionUML" selected="true"/>
                <CheckMenuItem fx:id="sketchesMenuItem" text="Sketches" onAction="#handleMenuActionSketches" selected="true"/>
                <CheckMenuItem fx:id="gridMenuItem" text="Grid" onAction="#handleMenuActionGrid" selected="true"/>
            </items>
        </Menu>
    </menus>
</MenuBar>
<TabPane fx:id="tabPane">

</TabPane>
<stylesheets>
    <URL value="@main.css" />
</stylesheets>
</VBox>

因此,StackPane被放在TabPane内的选项卡中。 因此,我想要的是“aDrawPane”非常大(甚至有无限的感觉),而用户只关注其中的一小部分,但能够围绕它进行平移和缩放。我希望它位于工具栏的“下方”


我希望我已经解释清楚了。我正在寻找关于如何使用JavaFX库构建这样一个应用程序的指导,而不是如何实现绘图/缩放/平移功能。

我认为您将问题复杂化了很多。首先,窗格的顺序不正确。边框窗格现在位于窗格的“上方”

BorderPane已经有一个用于您的案例的“中心”。包装你的窗格是一个滚动窗格,并把它放在那里

以下是一个例子:

该组将自动调整大小以包含其所有子级。它需要是“非托管”的,这样它的父对象(主播)就不会自行调整大小,这样您就可以将其放入GUI的其余部分,而无需将其推来推去,从而有效地将视口创建到画布中。
通过这种布局,组成为无限的虚拟画布,绘图窗格成为某种逻辑边界(纸张、文档大小、打印大小…。

感谢您的回答,并为我提供了解决方案的另一种视角!我一定会试试看。如果您能解释它的具体用途,我将不胜感激:maxHeight=“1.7976931348623157E308”maxWidth=“1.7976931348623157E308”minHeight=“-Infinity”minWidth=“-Infinity”这些尺寸不是必需的。SceneBuilder在选择“最大值”时设置它们。我在玩你的FXML时留下的片段。
<?import javafx.geometry.Insets?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.Label?>
<?import javafx.scene.control.ScrollPane?>
<?import javafx.scene.control.Slider?>
<?import javafx.scene.control.ToolBar?>
<?import javafx.scene.layout.BorderPane?>
<?import javafx.scene.layout.HBox?>
<?import javafx.scene.layout.Pane?>
<?import javafx.scene.layout.VBox?>

<BorderPane fx:id="aBorderPane" xmlns="http://javafx.com/javafx/8.0.60" xmlns:fx="http://javafx.com/fxml/1">
    <top>
        <VBox>
            <ToolBar fx:id="aToolBar" orientation="HORIZONTAL">
                <HBox fx:id="umlBox">
                    <Button fx:id="createBtn" text="Create" />
                    <Button fx:id="packageBtn" text="Package" />
                    <Button fx:id="edgeBtn" text="Edge" />
                    <Button fx:id="drawBtn" text="Draw" />
                </HBox>
                <HBox fx:id="utilBox">
                    <Button fx:id="selectBtn" text="Select" />
                    <Button fx:id="moveBtn" text="Move" />
                </HBox>
                <HBox fx:id="undoBox">
                    <Button fx:id="deleteBtn" text="Delete" />
                    <Button fx:id="undoBtn" text="Undo" />
                    <Button fx:id="redoBtn" text="Redo" />
                </HBox>
                <HBox fx:id="recognizeBox">
                    <Button fx:id="recognizeBtn" text="Recognize" />
                </HBox>
            </ToolBar>
        </VBox>
    </top>
    <bottom>
         <VBox alignment="CENTER" fillWidth="false">
             <Slider fx:id="zoomSlider" max="200" min="10" value="100" />
             <Label text="Zoom" />
         <padding>
            <Insets top="8.0" />
         </padding>
         </VBox>
    </bottom>
    <center>
        <ScrollPane pannable="true" prefViewportHeight="400.0" prefViewportWidth="400.0" BorderPane.alignment="CENTER">
            <content>
                <Pane fx:id="aDrawPane" maxHeight="1.7976931348623157E308" maxWidth="1.7976931348623157E308" minHeight="-Infinity" minWidth="-Infinity" prefHeight="8000.0" prefWidth="8000.0">
                </Pane>
            </content>
        </ScrollPane>
    </center>
   <padding>
      <Insets bottom="8.0" left="8.0" right="8.0" top="8.0" />
   </padding>
</BorderPane>
AnchorPane
   -> Group (setManaged(false))
      '-> drawPane
   -> vertical ScrollBar
   -> horizontal ScrollBar