如何在 4 列空间中设置 TextField JavaFx

Question

我想用JavaFx 制作一个计算器。我正在使用 GridPane 来设置计算器按钮和文本字段的位置。我的问题是：如何在 4 列空间中设置 TextField？

在以下示例中：

  TextField userTextField = new TextField();
    grid.add(userTextField, 0, 0,3,3);

网格中的坐标 0,0,3,3 是什么意思？它代表什么？ 任何帮助表示赞赏，非常感谢。

在下面的 javafx 程序中，我只想设置我的计算器示例的 TextField 和按钮：

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.geometry.Insets;
import javafx.geometry.Pos;
import javafx.scene.control.Button;
import javafx.scene.control.TextField;
import javafx.scene.layout.GridPane;
import javafx.stage.Stage;

    public class calculadora_css extends Application{

     @Override
        public void start(Stage primaryStage) {
               primaryStage.setTitle("JavaFX Welcome");
               GridPane grid = new GridPane();
               grid.setAlignment(Pos.TOP_CENTER);
               grid.setHgap(20);
               grid.setVgap(20);
               grid.setPadding(new Insets(10, 10, 10, 10));

               TextField userTextField = new TextField();

               grid.add(userTextField, 0, 0,3,1);

               Button btn1 = new Button("7");
               grid.add(btn1, 0,1);
               Button btn2 = new Button("8");
               grid.add(btn2, 1,1);
               Button btn3 = new Button("9");
               grid.add(btn3, 2,1);
               Button btn3_3 = new Button("+");
               grid.add(btn3_3, 3,1);
                Button btn4 = new Button("4");
               grid.add(btn4, 0,2);
               Button btn5 = new Button("5");
               grid.add(btn5, 1,2);
               Button btn6 = new Button("6");
               grid.add(btn6, 2,2);
               Button btn6_6 = new Button("*");
               grid.add(btn6_6, 3,2);
                Button btn7 = new Button("1");
               grid.add(btn7, 0,3);
               Button btn8 = new Button("2");
               grid.add(btn8, 1,3);
               Button btn9 = new Button("3");
               grid.add(btn9, 2,3);
                Button btn9_9 = new Button("-");
               grid.add(btn9_9, 3,3);
                Button btn10 = new Button("0");
               grid.add(btn10, 0,4);
               Button btn11 = new Button(".");
               grid.add(btn11, 1,4);
               Button btn12 = new Button("=");
               grid.add(btn12, 2,4);
               Button btn12_12 = new Button("/");
               grid.add(btn12_12, 3,4);

            Scene scene = new Scene(grid, 300, 275);
            primaryStage.setScene(scene);

            scene.getStylesheets().add
           (calculadora_css.class.getResource("calculadora_css.css").toExternalForm());
            primaryStage.setResizable(false);
            primaryStage.show();

    }

     public static void main(String[] args) {
            launch(args);
        }

    }

我想设置TextField下面的按钮，但是在最终编译的程序中+，*，-，/按钮被推到了右边，我试着按照上面的评论来排列按钮，非常感谢，任何帮助表示赞赏

Answer 1

你发现的除了columnIndex和rowIndex之外的额外参数分别是columnspan和rowspan。

ColumnSpan 允许您将多个列用于已作为子项添加到 GridPane 的控件。同样，RowSpan 允许您使用多行。

您可以使用setColumnSpan(Node child,Integer value) 设置列跨度，也可以使用add(Node child, int columnIndex, int rowIndex, int colspan, int rowspan) 在添加子项时定义列跨度。

所以，来回答你的问题，

grid.add(userTextField, 0, 0,3,3);

代表将userTextField控件添加到：

• gridPane 的columnIndex 0
• gridPane 的rowIndex 0
• colSpan 3 使用从列索引 0 开始的 3 列
• rowSpan 3 使用从行索引 0 开始的 3 行