如何使用 GridPane 和 HBox 使我的 javafx 表单中的所有字段都可点击？

问题描述

我想制作一个包含三个部分的表单，两个包含字段，一个包含按钮。

pd.crosstab(df["col_1"],df["col_2"])

格式和一些文本可能会关闭，但这是我的通用解决方案。我制作了一个根堆栈窗格来保存表单的所有部分。然后，我制作了两个网格窗格来放置文本字段，并制作了一个 public class Form extends Application{ public static void main(String[] args) { launch(args); } @Override public void start(Stage stage) throws Exception { StackPane root = new StackPane(); GridPane fp = new GridPane(); fp.setAlignment(Pos.TOP_CENTER); fp.setHgap(6); fp.setVgap(6); fp.add(new Label("Name: "),0); TextField name = new TextField(); name.setPrefWidth(450); fp.add(name,1,0); GridPane sp = new GridPane(); sp.setAlignment(Pos.CENTER); sp.setHgap(6); sp.setVgap(6); sp.add(new Label("Another Name: "),0); TextField anothername = new TextField(); anothername.setPrefWidth(120); sp.add(anothername,2,0); HBox hbox = new HBox(); hbox.setAlignment(Pos.BOTTOM_CENTER); Button btn1 = new Button("Button 1"); hbox.getChildren().add(btn1); Scene scene = new Scene(root,500,500); root.getChildren().addAll(fp,sp,hbox); stage.setScene(scene); stage.show(); } } 来放置底部的按钮。

example of how it looks

我的问题是只能单击名称字段。如果我尝试单击另一个名称字段，它将不起作用。我可以按 Tab 键来循环浏览字段和按钮，但我希​​望能够单独单击每个字段。有没有更好的方法来创建具有多个窗格或 hbox 的场景？我也对只有一个网格窗格持开放态度，但我认为有两个会更容易格式化，因为我想分隔不同的字段。谢谢！

解决方法

您面临的问题是由于您使用 StackPane 作为场景的根元素造成的。

A StackPane，顾名思义，将其子项堆叠在一起。任何位于顶部的子项都将接收事件（例如点击 anothername 字段）。

您已添加 3 个节点作为 StackPane 的子节点：

1. GridPane #1 fp
2. GridPane #2 sp
3. HBox hbox

由于 HBox 是最后添加的，因此它是唯一可以接收点击事件的节点。

以您的示例为例，我已为上述 3 项中的每一项都添加了边框，以说明 JavaFX 如何对其进行布局：

如您所见，StackPane 的每个子项都被调整大小以填充整个区域（我为边框使用了不同的宽度，以便您可以看到它们）。

您可以在展示舞台之前通过添加以下代码来自己尝试：

fp.setStyle("-fx-border-color: green; -fx-border-width: 15px");
sp.setStyle("-fx-border-color: blue; -fx-border-width: 10px");
hbox.setStyle("-fx-border-color: red; -fx-border-width: 5px");

要解决这个问题，您需要完全重新考虑您的布局； StackPane 肯定不是在您的情况下使用的正确布局窗格。

我强烈建议您阅读 Oracle Working With Layouts in JavaFX 教程中的示例，以更好地掌握如何以最佳方式布局您的场景。