【JavaFX】左から右にコントロールを配置する方法（FlowPane）| kitanote

JavaFXで左から右にコントロールを配置する方法について記載します。

1. 左から右にコントロールを配置する方法

FlowPaneを使用すると左から右にコントロールを配置することができます。

実行例

import javafx.application.Application;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.FlowPane;
import javafx.stage.Stage;

public class SampleFlowPane extends Application {

    @Override
    public void start(Stage pStage) throws Exception {

        /**
         * ボタンの定義
         */
        Button btn1 = new Button("1");
        btn1.setPrefWidth(70);
        btn1.setPrefHeight(50);

        Button btn2 = new Button("2");
        btn2.setPrefWidth(70);
        btn2.setPrefHeight(50);

        Button btn3 = new Button("3");
        btn3.setPrefWidth(70);
        btn3.setPrefHeight(50);

        Button btn4 = new Button("4");
        btn4.setPrefWidth(70);
        btn4.setPrefHeight(50);

        Button btn5 = new Button("5");
        btn5.setPrefWidth(70);
        btn5.setPrefHeight(50);

        /**
         * FlowPaneにボタンを追加
         */
        FlowPane flowPane = new FlowPane();
        flowPane.getChildren().addAll( btn1, btn2 ,btn3, btn4, btn5 );

        pStage.setTitle("Sample Flow");
        pStage.setScene( new Scene( flowPane ) );
        pStage.show();
    }

    public static void main(String[] args){

        Application.launch(args);

    }
}

import javafx.application.Application;

import javafx.scene.Scene;

import javafx.scene.control.Button;

import javafx.scene.layout.FlowPane;

import javafx.stage.Stage;

public class SampleFlowPane extends Application {

@Override

public void start(Stage pStage) throws Exception {

/**

* ボタンの定義

Button btn1 = new Button("1");

btn1.setPrefWidth(70);

btn1.setPrefHeight(50);

Button btn2 = new Button("2");

btn2.setPrefWidth(70);

btn2.setPrefHeight(50);

Button btn3 = new Button("3");

btn3.setPrefWidth(70);

btn3.setPrefHeight(50);

Button btn4 = new Button("4");

btn4.setPrefWidth(70);

btn4.setPrefHeight(50);

Button btn5 = new Button("5");

btn5.setPrefWidth(70);

btn5.setPrefHeight(50);

/**

* FlowPaneにボタンを追加

FlowPane flowPane = new FlowPane();

flowPane.getChildren().addAll( btn1, btn2 ,btn3, btn4, btn5 );

pStage.setTitle("Sample Flow");

pStage.setScene( new Scene( flowPane ) );

pStage.show();

}

public static void main(String[] args){

Application.launch(args);

}

FlowPaneにコントロールを追加

FlowPaneにコントロールを追加した順番で左から右に配置されます。

FlowPane flowPane = new FlowPane();
flowPane.getChildren().addAll( btn1, btn2 ,btn3, btn4, btn5 );

1 2	FlowPane flowPane = new FlowPane(); flowPane.getChildren().addAll( btn1, btn2 ,btn3, btn4, btn5 );

2. レイアウト一覧

1. 垂直方向にコントロールを配置する方法（VBox）

2. 水平方向にコントロールを配置する方法（HBox）

3. 左から右にコントロールを配置する方法（FlowPane）

4. 格子状にコントロールを配置する方法（GridPane）

5. 上下左右中央にコントロールを配置する方法（BorderPane）

6. 上下左右からの位置を指定してコントロールを配置する方法（AnchorPane）

7. コントロール幅を指定する setPrefWidth、setMaxWidth、setMinWidth の違い