文档建议反馈控制台
首页
学习
活动
专区
圈层
工具
MCP广场
文章/答案/技术大牛
发布
社区首页 >问答首页 >ScrollPane中的GridPane

问ScrollPane中的GridPane
EN

Stack Overflow用户
提问于 2017-08-07 17:33:04
回答 1查看 2K关注 0票数 1

我将一个GridPane包装在一个ScrollPane中，以便在网格中添加新行时能够滚动它。

代码语言：javascript
复制
<BorderPane fx:id="SubmitStageBorderPane" 
stylesheets="@../SubmitStageStyles.css" 
xmlns="http://javafx.com/javafx/8.0.112-ea" 
xmlns:fx="http://javafx.com/fxml/1" fx:controller="sample.SubmitStage">
   <center>
  <AnchorPane fx:id="SubmitStageAnchorPane">
     <children>
        <ScrollPane fx:id="GridscPane" hbarPolicy="NEVER" vbarPolicy="ALWAYS">
           <content>
              <GridPane fx:id="submitLayout" maxHeight="1080.0" maxWidth="-Infinity" minHeight="-Infinity" minWidth="-Infinity" prefHeight="500.0" prefWidth="700.0" stylesheets="@../SubmitStageStyles.css">
                <columnConstraints>
                  <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
                    <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
                    <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
                    <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
                    <ColumnConstraints hgrow="SOMETIMES" minWidth="10.0" prefWidth="100.0" />
                </columnConstraints>
                <rowConstraints>
                    <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
                  <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
                              <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
                  <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
                    <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
                    <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
                    <RowConstraints minHeight="10.0" prefHeight="30.0" vgrow="SOMETIMES" />
                </rowConstraints>
                 <children>
                    <TextField fx:id="course1" promptText="Course name" GridPane.rowIndex="1">
                       <opaqueInsets>
                          <Insets />
                       </opaqueInsets>
                       <GridPane.margin>
                          <Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
                       </GridPane.margin>
                    </TextField>
                    <TextField fx:id="course2" promptText="Cource name" GridPane.rowIndex="2">
                       <GridPane.margin>
                          <Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
                       </GridPane.margin>
                    </TextField>
                    <TextField fx:id="course3" promptText="Course name" GridPane.rowIndex="3">
                       <GridPane.margin>
                          <Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
                       </GridPane.margin>
                    </TextField>
                    <TextField fx:id="course4" promptText="Course name" GridPane.rowIndex="4">
                       <GridPane.margin>
                          <Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
                       </GridPane.margin>
                    </TextField>
                    <Label alignment="CENTER_RIGHT" contentDisplay="CENTER" text="Grade:" GridPane.columnIndex="1" GridPane.rowIndex="1">
                       <font>
                          <Font name="Eras Demi ITC" size="21.0" />
                       </font>
                       <GridPane.margin>
                          <Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
                       </GridPane.margin>
                       <padding>
                          <Insets bottom="10.0" left="10.0" right="15.0" top="10.0" />
                       </padding>
                    </Label>
                    <Label alignment="CENTER_RIGHT" contentDisplay="CENTER" text="Grade:" GridPane.columnIndex="1" GridPane.rowIndex="2">
                       <font>
                          <Font name="Eras Demi ITC" size="21.0" />
                       </font>
                       <GridPane.margin>
                          <Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
                       </GridPane.margin>
                       <padding>
                          <Insets bottom="10.0" left="10.0" right="15.0" top="10.0" />
                       </padding>
                    </Label>
                    <Label alignment="CENTER_RIGHT" contentDisplay="CENTER" text="Grade:" GridPane.columnIndex="1" GridPane.rowIndex="3">
                       <padding>
                          <Insets bottom="10.0" left="10.0" right="15.0" top="10.0" />
                       </padding>
                       <GridPane.margin>
                          <Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
                       </GridPane.margin>
                       <font>
                          <Font name="Eras Demi ITC" size="21.0" />
                       </font>
                    </Label>
                    <Label alignment="CENTER_RIGHT" contentDisplay="CENTER" text="Grade:" GridPane.columnIndex="1" GridPane.rowIndex="4">
                       <font>
                          <Font name="Eras Demi ITC" size="21.0" />
                       </font>
                       <GridPane.margin>
                          <Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
                       </GridPane.margin>
                       <padding>
                          <Insets bottom="10.0" left="10.0" right="15.0" top="10.0" />
                       </padding>
                    </Label>
                    <TextField fx:id="grade1" promptText="Enter the grade" GridPane.columnIndex="2" GridPane.rowIndex="1">
                       <GridPane.margin>
                          <Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
                       </GridPane.margin>
                    </TextField>
                    <TextField fx:id="grade2" promptText="Enter the grade" GridPane.columnIndex="2" GridPane.rowIndex="2">
                       <GridPane.margin>
                          <Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
                       </GridPane.margin>
                    </TextField>
                    <TextField fx:id="grade3" promptText="Enter the grade" GridPane.columnIndex="2" GridPane.rowIndex="3">
                       <GridPane.margin>
                          <Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
                       </GridPane.margin>
                    </TextField>
                    <TextField fx:id="grade4" promptText="Enter the grade" GridPane.columnIndex="2" GridPane.rowIndex="4">
                       <GridPane.margin>
                          <Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
                       </GridPane.margin>
                    </TextField>
                    <Label alignment="CENTER_RIGHT" contentDisplay="CENTER" text="Credits:" GridPane.columnIndex="3" GridPane.rowIndex="1">
                       <font>
                          <Font name="Eras Demi ITC" size="21.0" />
                       </font>
                       <GridPane.margin>
                          <Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
                       </GridPane.margin>
                       <padding>
                          <Insets bottom="10.0" left="10.0" right="15.0" top="10.0" />
                       </padding>
                    </Label>
                    <Label alignment="CENTER_RIGHT" contentDisplay="CENTER" text="Credits:" GridPane.columnIndex="3" GridPane.rowIndex="2">
                       <padding>
                          <Insets bottom="10.0" left="10.0" right="15.0" top="10.0" />
                       </padding>
                       <GridPane.margin>
                          <Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
                       </GridPane.margin>
                       <font>
                          <Font name="Eras Demi ITC" size="21.0" />
                       </font>
                    </Label>
                    <Label alignment="CENTER_RIGHT" contentDisplay="CENTER" text="Credits:" GridPane.columnIndex="3" GridPane.rowIndex="3">
                       <font>
                          <Font name="Eras Demi ITC" size="21.0" />
                       </font>
                       <GridPane.margin>
                          <Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
                       </GridPane.margin>
                       <padding>
                          <Insets bottom="10.0" left="10.0" right="15.0" top="10.0" />
                       </padding>
                    </Label>
                    <Label alignment="CENTER_RIGHT" contentDisplay="CENTER" text="Credits:" GridPane.columnIndex="3" GridPane.rowIndex="4">
                       <GridPane.margin>
                          <Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
                       </GridPane.margin>
                       <padding>
                          <Insets bottom="10.0" left="10.0" right="15.0" top="10.0" />
                       </padding>
                       <font>
                          <Font name="Eras Demi ITC" size="21.0" />
                       </font>
                    </Label>
                    <TextField fx:id="credit1" promptText="Course credit" GridPane.columnIndex="4" GridPane.rowIndex="1">
                       <GridPane.margin>
                          <Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
                       </GridPane.margin>
                    </TextField>
                    <TextField fx:id="credit2" promptText="Course credit" GridPane.columnIndex="4" GridPane.rowIndex="2">
                       <GridPane.margin>
                          <Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
                       </GridPane.margin>
                    </TextField>
                    <TextField fx:id="credit3" promptText="Course credit" GridPane.columnIndex="4" GridPane.rowIndex="3">
                       <GridPane.margin>
                          <Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
                       </GridPane.margin>
                    </TextField>
                    <TextField fx:id="credit4" promptText="Course credit" GridPane.columnIndex="4" GridPane.rowIndex="4">
                       <GridPane.margin>
                          <Insets bottom="5.0" left="5.0" right="5.0" top="5.0" />
                       </GridPane.margin>
                    </TextField>
                 </children>
                 <opaqueInsets>
                    <Insets />
                   </opaqueInsets>
                 <padding>
                    <Insets bottom="20.0" left="20.0" right="20.0" top="20.0" />
                 </padding>
              </GridPane>
           </content>
        </ScrollPane>
        <Button fx:id="AddAnotherCourseButton" alignment="BOTTOM_CENTER" mnemonicParsing="false" onAction="#AddAnotherCourseClicked" text="ADD ANOTHER COURSE">
           <font>
              <Font name="Book Antiqua Bold" size="15.0" />
           </font>
        </Button>
     </children>
  </AnchorPane>
</center>
<top>
  <MenuBar fx:id="SubmitStageMenuBar" BorderPane.alignment="CENTER">
    <menus>
        <Menu mnemonicParsing="false" text="File">
          <items>
            <MenuItem mnemonicParsing="false" text="Save" />
              <MenuItem mnemonicParsing="false" text="Load" />
              <SeparatorMenuItem mnemonicParsing="false" />
              <MenuItem mnemonicParsing="false" text="Exit" />
          </items>
        </Menu>
        <Menu mnemonicParsing="false" text="About">
          <items>
            <MenuItem mnemonicParsing="false" text="Action 1" />
          </items>
        </Menu>
    </menus>
  </MenuBar>
</top>
</BorderPane>

我有一个按钮，只要单击它，就会在GridPane中添加一个包含元素的行。

代码语言：javascript
复制
public void AddAnotherCourseClicked(){

    int rowCount = returnMaxRow();

    TextField courseName = new TextField();
    courseName.setPromptText("Course name");
    submitLayout.setMargin(courseName, new Insets(5, 5, 5, 5));

    Label gradeLabel = new Label("Grade:");
    gradeLabel.setFont(Font.font("Eras Demi ITC", 21));
    submitLayout.setMargin(gradeLabel, new Insets(5, 5, 5, 5));
    gradeLabel.setPadding(new Insets(10, 10, 15, 10));

    TextField gradeReceived = new TextField();
    gradeReceived.setPromptText("Enter the grade");
    submitLayout.setMargin(gradeReceived, new Insets(5, 5, 5, 5));

    Label creditsLabel = new Label("Credits:");
    creditsLabel.setFont(Font.font("Eras Demi ITC", 21));
    submitLayout.setMargin(gradeLabel, new Insets(5, 5, 5, 5));
    creditsLabel.setPadding(new Insets(10, 10, 15, 10));

    TextField courseCredit = new TextField();
    courseCredit.setPromptText("Course credit");
    submitLayout.setMargin(courseCredit, new Insets(5, 5, 5, 5));

    submitLayout.addRow(rowCount+1, courseName, gradeLabel, gradeReceived, creditsLabel, courseCredit);
}

private int returnMaxRow(){
    int rowNum, lastRow = 0;
    for(Node element : submitLayout.getChildren()){
        rowNum = submitLayout.getRowIndex(element);
        lastRow = (rowNum > lastRow ? rowNum : lastRow);
    }
    return lastRow;
}

到目前为止，添加了ScrollBar，但是，当我按下按钮时，行只是聚集在一起，并且ScrollBar没有扩展，它的高度保持不变。

java
javafx
EN

回答 1

Stack Overflow用户

发布于 2018-06-27 22:24:36

我也遇到了同样的问题..到处都找过了。最后有一条路可以绕过去..

不要使用场景构建器...just添加格网窗格，使用场景构建器创建滚动窗格，然后使用代码动态添加格网窗格，如下所示

代码语言：javascript
复制
// create new constraints for columns and set their percentage
ColumnConstraints columnConstraints = new ColumnConstraints();
columnConstraints.setHgrow(Priority.NEVER);
columnConstraints.setPercentWidth(100.00);

// create new constraints for row and set their percentage
RowConstraints rowConstraints = new RowConstraints();
rowConstraints.setVgrow(Priority.NEVER);

columnConstraints.setPercentWidth(100.0);

// don't set preferred size or anything on gridpane
GridPane gridPane = new GridPane();  
gridPane.getRowConstraints().add(rowConstraints);
gridPane.getColumnConstraints().add(columnConstraints);

// suppose your scroll pane id is scrollPane
scrollPane.setContent(gridPane);

最后，在场景构建器中，记得为滚动窗格勾选FitHeight和FitWidth，这样网格窗格就会在添加网格时拉伸到适合滚动窗格的大小

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：

https://stackoverflow.com/questions/45543669

复制
相关文章

相似问题

领券

腾讯云开发者

扫码关注腾讯云开发者

扫码关注腾讯云开发者

领取腾讯云代金券

热门产品

热门推荐

更多推荐

Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有 

深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 粤公网安备44030502008569号

腾讯云计算（北京）有限责任公司 京ICP证150476号 |  京ICP备11018762号

问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档