如何为窗格设置不同的位置？

Question

好的，我有这段代码(可以执行)，但是所有东西都在左上角。

我如何改变它，使圆圈在中间，4个按钮在底部的中心？

import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.HBox;
import javafx.scene.layout.Pane;
import javafx.scene.layout.StackPane;
import javafx.scene.layout.VBox;
import javafx.scene.paint.Color;
import javafx.scene.shape.Circle;
import javafx.stage.Stage;
import static javax.swing.Spring.height;
import static javax.swing.Spring.width;


public class MoveTheBall extends Application {

@Override
public void start(Stage primaryStage) throws Exception {
    //Parent root = FXMLLoader.load(getClass().getResource("FXMLDocument.fxml"));




    Button btn1 = new Button();
    btn1.setText("Left");
    btn1.setOnAction((ActionEvent event) -> {
        System.out.println("Hello World!");
    });

     Button btn2 = new Button();
    btn2.setText("Right");
    btn2.setOnAction((ActionEvent event) -> {
        System.out.println("Hello World!");
    });

     Button btn3 = new Button();
    btn3.setText("Up");
    btn3.setOnAction((ActionEvent event) -> {
        System.out.println("Hello World!");
    });

     Button btn4 = new Button();
    btn4.setText("Down");
    btn4.setOnAction((ActionEvent event) -> {
        System.out.println("Hello World!");
    });



    StackPane rootPane = new StackPane();



    HBox pane = new HBox();
    VBox pane2 = new VBox();


    Circle circle = new Circle();
    circle.centerXProperty().bind(pane.widthProperty().divide(2));
    circle.centerYProperty().bind(pane.heightProperty().divide(2));
    circle.setRadius(50);
    circle.setStroke(Color.BLACK);
    circle.setFill(Color.WHITE);

    pane2.getChildren().add(circle);
    pane.getChildren().addAll(btn1, btn2, btn3, btn4);

    Scene scene = new Scene(rootPane, 400, 400);
    rootPane.getChildren().addAll(pane,pane2);
    BorderPane borderPane = new BorderPane();
    borderPane.setPrefSize(400, 400);

    pane.setLayoutY(300);
    pane2.setLayoutX(150);
    primaryStage.setTitle("Move the circle!");
    primaryStage.setScene(scene);
    primaryStage.show();
}

Here is a picture with the results and with black what I would like to make.

注意:有些导入是不需要的，但这是我必须包含的内容。谢谢!

Answer 1

那么，对于您的预期输出，您使用了太多的布局。尝尝这个

import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.fxml.FXMLLoader;
import javafx.scene.Parent;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.BorderPane;
import javafx.scene.layout.HBox;
import javafx.scene.layout.Pane;
import javafx.scene.layout.StackPane;
import javafx.scene.layout.VBox;
import javafx.scene.paint.Color;
import javafx.scene.shape.Circle;
import javafx.stage.Stage;
import static javax.swing.Spring.height;
import static javax.swing.Spring.width;
import javafx.geometry.Pos;


public class Main extends Application {

@Override
public void start(Stage primaryStage) throws Exception {
//Parent root = FXMLLoader.load(getClass().getResource("FXMLDocument.fxml"));
    Button btn1 = new Button();
    btn1.setText("Left");
    btn1.setOnAction((ActionEvent event) -> {
        System.out.println("Hello World!");
    });

    Button btn2 = new Button();
    btn2.setText("Right");
    btn2.setOnAction((ActionEvent event) -> {
       System.out.println("Hello World!");
    });

    Button btn3 = new Button();
    btn3.setText("Up");
    btn3.setOnAction((ActionEvent event) -> {
       System.out.println("Hello World!");
    });

    Button btn4 = new Button();
    btn4.setText("Down");
    btn4.setOnAction((ActionEvent event) -> {
       System.out.println("Hello World!");
    });
    Circle circle = new Circle();

    circle.setRadius(50);
    circle.setStroke(Color.BLACK);
    circle.setFill(Color.WHITE);

   BorderPane rootPane  = new BorderPane();
   rootPane.setCenter(circle);
   HBox hb = new HBox(btn1, btn2, btn3, btn4);
   hb.setAlignment(Pos.CENTER);
   rootPane.setBottom(hb);

   Scene scene = new Scene(rootPane, 400, 400);
   primaryStage.setTitle("Move the circle!");
   primaryStage.setScene(scene);
   primaryStage.show();
  }
}