JavaFX - создание нескольких панелей в сцене

Question

Итак, я должен сделать Зодиак c Знак GUI, и нам поручают иметь следующее:

• a Метка в верхнем левом углу, и a TextField в правом верхнем углу (оба с заполнением)
• выход Кнопка в центре GUI, а также очистить и найти мой знак с обеих сторон
• и, наконец, Этикетка в центре внизу, подсказывающая знак

Я совершенно не понимаю, как это сделать, так как я новичок в JavaFX. Я считаю, что мне понадобится узел ветки вместе с узлом root, чтобы получить такой макет. Мне не нужна помощь в создании экземпляра кнопки, меток и т. Д. c., В основном меня смущает то, как этот макет вообще может работать. Код, который у меня сейчас есть, следующий:

public class ZodiacGUI extends Application {

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

    @Override
    public void start(Stage primaryStage) throws Exception {
        BorderPane mainPane = new BorderPane();
        mainPane.setStyle("-fx-background-color: PINK");
        setupControls(mainPane);
        Scene scene = new Scene(mainPane);
        setStage(primaryStage, scene);

    }

    public void setStage(Stage primaryStage, Scene scene) {
        primaryStage.setWidth(500);
        primaryStage.setHeight(200);
        primaryStage.setTitle("What is my Zodiac Sign?");
        primaryStage.setScene(scene);
        primaryStage.show();
    }

    public void setupControls(BorderPane mainPane) {
        Label label = new Label("Enter you birthday formatted as -> mm/dd");
        Button exitButton = new Button();
        Button findSign = new Button();
        Button clear = new Button();
        TextField userInput = new TextField();

        userInput.setPromptText("Enter birthday");
        exitButton.setText("Exit.");
        findSign.setText("Find my sign.");
        clear.setText("Clear.");

        exitButton.setOnAction(e -> System.exit(0));

        mainPane.setLeft(label);
        mainPane.setRight(userInput);
        mainPane.setCenter(exitButton);
        mainPane.setCenter(findSign);
        mainPane.setCenter(clear);
        BorderPane.setAlignment(label, Pos.TOP_LEFT);
        BorderPane.setAlignment(userInput, Pos.TOP_RIGHT);
        BorderPane.setAlignment(exitButton, Pos.CENTER);
        BorderPane.setAlignment(findSign, Pos.CENTER_LEFT);
        BorderPane.setAlignment(clear, Pos.CENTER_RIGHT);
    }
}

Это выводит только одну из кнопок из трех, как я предполагаю, потому что необходимо добавить еще одну BorderPane? Вот нарисованное изображение того, что я хотел бы предложить:

Просто чтобы уточнить, мне не нужна помощь с обработкой найти знак зодиака c, эт c. В основном нужна помощь с макетом, так как он несколько дней ставил меня в тупик. Заранее благодарим вас за помощь новичку в JavaFX :).

Answer 1

У вас есть три ряда с разным количеством детей. Вы можете использовать HBox, если строка имеет более одного дочернего элемента.

BorderPane mainPane = new BorderPane();
mainPane.setTop(new HBox(topLabel, topField));
mainPane.setCenter(new HBox(centerLabel, centerField, centerButtom));
mainPane.setBottom(bottomCenterButton);

Если вам нужно более 3 строк (верхняя, центральная, нижняя часть BorderPane), вы можете использовать VBox, где каждый дочерний элемент является строкой, например:

HBox row1 new HBox(child1, child2)
HBox row2 new HBox(child1, child2, child3)
HBox row3 new HBox(child1)
HBox row4 new HBox(child1, child2)
VBox pane = new VBox(row1, row2, row3, row4);

Answer 2

Возможно, вы захотите использовать GridPane

GridPane grid = new GridPane();
grid.add(label,0,0);
grid.add(userInput,2,0);
grid.add(findSign,0,1);
grid.add(exitButton,1,1);
grid.add(clear,2,1);

или использовать VBox с BorderPane, чтобы помочь с макетом / выравниванием

BorderPane mainPane, centerPane;

mainPane.setLeft(label);
mainPane.setRight(userInput);

centerPane.setLeft(findSign);
centerPane.setRight(clear);
centerPane.setCenter(exitButton);

BorderPane.setAlignment(label, Pos.LEFT);
BorderPane.setAlignment(userInput, Pos.RIGHT);
BorderPane.setAlignment(exitButton, Pos.CENTER);
BorderPane.setAlignment(findSign, Pos.LEFT);
BorderPane.setAlignment(clear, Pos.RIGHT);

VBox items = new VBox();
items.getChildren().addAll(mainPane, centerPane);