JavaFX可调整大小的布局(场景构建器)

时间:2018-04-12 15:32:03

标签: javafx layout fxml scenebuilder

我有一个包含一些元素的AnchorPane,你可以看到: Layout

Sample.fxml

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

<?import javafx.scene.Group?>
<?import javafx.scene.chart.LineChart?>
<?import javafx.scene.chart.NumberAxis?>
<?import javafx.scene.control.Button?>
<?import javafx.scene.control.Menu?>
<?import javafx.scene.control.MenuBar?>
<?import javafx.scene.control.MenuItem?>
<?import javafx.scene.control.TableColumn?>
<?import javafx.scene.control.TableView?>
<?import javafx.scene.control.TextField?>
<?import javafx.scene.layout.AnchorPane?>

<AnchorPane maxHeight="-Infinity" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="500.0" prefWidth="800.0" style="-fx-background-color: #fff;" xmlns="http://javafx.com/javafx/9.0.1" xmlns:fx="http://javafx.com/fxml/1" fx:controller="sample.Controller">
   <AnchorPane prefHeight="500.0" prefWidth="800.0" AnchorPane.bottomAnchor="0.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
      <children>
          <MenuBar prefHeight="30.0" prefWidth="800.0" AnchorPane.leftAnchor="0.0" AnchorPane.rightAnchor="0.0" AnchorPane.topAnchor="0.0">
              <Menu mnemonicParsing="false" text="File">
                  <MenuItem mnemonicParsing="false" text="Close" />
              </Menu>
              <Menu mnemonicParsing="false" text="Edit">
                  <MenuItem mnemonicParsing="false" text="Delete" />
              </Menu>
              <Menu mnemonicParsing="false" text="Help">
                  <MenuItem mnemonicParsing="false" text="About" />
              </Menu>
          </MenuBar>
          <Group />
           <TableView id="tableDisplay" fx:id="tableDisplay" editable="true" layoutX="14.0" layoutY="50.0" prefHeight="200.0" prefWidth="771.0" AnchorPane.bottomAnchor="250.0" AnchorPane.leftAnchor="14.0" AnchorPane.rightAnchor="14.799999999999955" AnchorPane.topAnchor="50.0">
               <columns>
                   <TableColumn id="tableWellN" fx:id="tableWellN" prefWidth="75.20001220703125" text="Колодязь №" />
                   <TableColumn id="tableWellD" fx:id="tableWellD" editable="false" prefWidth="66.39996337890625" text="D колодязя" />
                   <TableColumn id="tableMarkB" fx:id="tableMarkB" minWidth="9.5999755859375" prefWidth="79.199951171875" text="Відмітка низу труби" />
                   <TableColumn id="tableMarkP" fx:id="tableMarkP" minWidth="0.800048828125" prefWidth="114.4000244140625" text="Проектна  відмітка землі" />
                   <TableColumn id="tableMarkN" fx:id="tableMarkN" minWidth="0.0" prefWidth="139.99993896484375" text="Натуральна відмітка землі" />
                   <TableColumn id="tableDiameter" fx:id="tableDiameter" prefWidth="64.800048828125" text="Діаметер" />
                   <TableColumn id="tableLength" fx:id="tableLength" prefWidth="75.0" text="Довжина" />
                   <TableColumn id="tableSlope" fx:id="tableSlope" prefWidth="68.00006103515625" text="Похил" />
                   <TableColumn id="tablePipeB" fx:id="tablePipeB" prefWidth="46.4000244140625" text="Низ труби">
                       <columns>
                           <TableColumn id="tablePipeS" fx:id="tablePipeS" prefWidth="75.0" text="Початок" />
                           <TableColumn id="tablePipeE" fx:id="tablePipeE" prefWidth="75.0" text="Кінець" />
                       </columns>
                   </TableColumn>
                   <TableColumn id="tablePipeT" fx:id="tablePipeT" prefWidth="61.5999755859375" text="Верх труби">
                  <columns>
                     <TableColumn fx:id="tablePipeTS" prefWidth="75.0" text="Початок" />
                     <TableColumn fx:id="tablePipeTE" prefWidth="75.0" text="Кінець" />
                  </columns>
               </TableColumn>
               </columns>
               <columnResizePolicy>
                   <TableView fx:constant="CONSTRAINED_RESIZE_POLICY" />
               </columnResizePolicy>
           </TableView>
          <TextField id="inputWellN" fx:id="inputWellN" layoutX="14.0" layoutY="278.0" promptText="Колодязь №" AnchorPane.bottomAnchor="196.4" AnchorPane.leftAnchor="14.0" />
          <TextField id="inputWellD" fx:id="inputWellD" layoutX="14.0" layoutY="319.0" promptText="Діаметер колодязя" AnchorPane.bottomAnchor="155.39999999999998" AnchorPane.leftAnchor="14.0" />
          <TextField id="inputMarkB" fx:id="inputMarkB" layoutX="14.0" layoutY="357.0" promptText="Відмітка низу" AnchorPane.bottomAnchor="117.39999999999998" AnchorPane.leftAnchor="14.0" />
          <TextField id="inputMarkP" fx:id="inputMarkP" layoutX="14.0" layoutY="395.0" promptText="Проектна відмітка" AnchorPane.bottomAnchor="79.39999999999998" AnchorPane.leftAnchor="14.0" />
          <TextField id="inputMarkN" fx:id="inputMarkN" layoutX="14.0" layoutY="438.0" promptText="Натуральна відмітка" AnchorPane.bottomAnchor="36.39999999999998" AnchorPane.leftAnchor="14.0" />
          <TextField id="inputDiameter" fx:id="inputDiameter" layoutX="171.0" layoutY="278.0" promptText="Діаметер" AnchorPane.bottomAnchor="196.4" AnchorPane.leftAnchor="171.0" />
          <TextField id="inputLength" fx:id="inputLength" layoutX="170.0" layoutY="319.0" promptText="Довжина" AnchorPane.bottomAnchor="155.39999999999998" AnchorPane.leftAnchor="170.0" />
          <TextField id="inputSlope" fx:id="inputSlope" layoutX="170.0" layoutY="357.0" promptText="Похил" AnchorPane.bottomAnchor="117.4" AnchorPane.leftAnchor="170.0" />
          <Button fx:id="buttonAdd" layoutX="170.0" layoutY="395.0" mnemonicParsing="false" prefHeight="26.0" prefWidth="149.0" text="Добавити" AnchorPane.bottomAnchor="78.6" AnchorPane.leftAnchor="170.0" />
          <Button fx:id="buttonBuild" layoutX="169.0" layoutY="438.0" mnemonicParsing="false" prefHeight="26.0" prefWidth="150.0" text="Побудувати" AnchorPane.bottomAnchor="35.60000000000002" AnchorPane.leftAnchor="169.0" />
         <LineChart fx:id="chartArea" layoutX="376.0" layoutY="300.0" prefHeight="178.0" prefWidth="402.0" AnchorPane.bottomAnchor="21.599999999999994" AnchorPane.leftAnchor="376.0" AnchorPane.rightAnchor="21.600000000000023" AnchorPane.topAnchor="300.0">
           <xAxis>
             <NumberAxis fx:id="lineChartX" side="BOTTOM" />
           </xAxis>
           <yAxis>
             <NumberAxis fx:id="lineChartY" autoRanging="false" side="LEFT" tickUnit="0.1" />
           </yAxis>
         </LineChart>
      </children>
   </AnchorPane>
</AnchorPane>

我需要的是,当我全屏显示时,按钮和文本字段保持不变,其余部分变大。我尝试设置锚点,它几乎就像我想要的那样,但是当我调整窗口大小时,表格和折线图重叠: Overlap

我该如何解决这个问题?

1 个答案:

答案 0 :(得分:0)

我不会像你那样做出来。在JavaFX中定位需要一些掌握。你读过/明白了吗?

https://docs.oracle.com/javase/8/javafx/layout-tutorial/index.html

使用Screenbuilder开始,然后在IDE中自定义它。 Screenbuilder使用绝对定位。您可能需要使用HBox,VBox,TilePane等转换/包装某些部分以获得所需的布局。可能需要几次尝试。祝你好运!