FXML ScrollPane在其整个窗口上未显示子级

时间:2019-04-13 14:14:23

标签: java javafx fxml

我是第一次使用JavaFX FXML。我正在尝试在GUI窗口中实现ScrollPane视图。假设我要显示书籍清单。因此,GUI必须是可滚动的。但是我的ScrollPane视图仅在完整GUI的一角而不是整个主体中显示其子项。

以下是我的FXML代码:

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

<?import java.lang.*?>
<?import java.net.*?>
<?import java.util.*?>
<?import javafx.scene.*?>
<?import javafx.scene.control.*?>
<?import javafx.scene.layout.*?>

<ScrollPane fx:id="scrollPane"  xmlns:fx="http://javafx.com/fxml/1" id="AnchorPane" 
        prefHeight="400.0" prefWidth="1000.0" pannable="true"
        fx:controller="bookinventory.BooksAllController"
                fitToHeight="true" fitToWidth="true">
    <content>
        <VBox fx:id="allbookbox" VBox.vgrow="ALWAYS" > 
          <children>  

        <Label fx:id="nameLbl"
           layoutX="100.0" layoutY="50.0" style="-fx-font-size:15px; -fx-underline: true; -fx-border-width: 0 0 5 0;"
           prefHeight="20.0" prefWidth="100.0" text="Book Name" textAlignment="LEFT" />

        <Label fx:id="writerNameLbl"
               layoutX="300.0" layoutY="50.0" style="-fx-font-size:15px; -fx-underline: true; -fx-border-width: 0 0 1 0;"
               prefHeight="20.0" prefWidth="100.0" text="Writer Name" textAlignment="LEFT" />

        <Label fx:id="genreLbl" style="-fx-font-size:15px; -fx-underline: true; -fx-border-width: 0 0 1 0;"
               layoutX="500.0" layoutY="50.0"
               prefHeight="20.0" prefWidth="100.0" text="Genre" textAlignment="LEFT" />

        <Label fx:id="priceLbl" style="-fx-font-size:15px; -fx-underline: true; -fx-border-width: 0 0 1 0;"
               layoutX="700.0" layoutY="50.0"
               prefHeight="20.0" prefWidth="100.0" text="Price" textAlignment="LEFT" />

        <Label fx:id="actionLbl" style="-fx-font-size:15px; -fx-underline: true; -fx-border-width: 0 0 1 0;"
               layoutX="900.0" layoutY="50.0"
               prefHeight="20.0" prefWidth="100.0" text="Action" textAlignment="LEFT" />

       </children>
    </VBox> 
    </content>

</ScrollPane>

以下是此代码的当前视图:

Present Outcome of the code

我想要带有垂直滚动条的以下视图:

Desired Outcome

有帮助吗?

0 个答案:

没有答案
相关问题