JavaFX でのグリッドと子ノードの配置
JavaFX には、GridPane
という名前の UI コンポーネントがあります。この UI コンポーネントを介して、すべての子ノードが列と行のグリッドの形式で配置されます。
このコンポーネントに必要なパッケージは javafx.scene.layout
です。
この記事では、アラインメントについて説明し、理解を深めるためにこのトピックに関する例を説明します。
JavaFX でのグリッドと子ノードの配置
次の例では、ラベル付きのグリッドペインを作成しました。この例のコードを以下に示します。
import javafx.application.Application;
import javafx.geometry.HPos;
import javafx.geometry.Insets;
import javafx.geometry.Pos;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.control.Label;
import javafx.scene.control.TextField;
import javafx.scene.layout.GridPane;
import javafx.scene.text.Text;
import javafx.stage.Stage;
public class FxGrid extends Application {
@Override
public void start(Stage stage) {
Label lbl = new Label("Simple grid example ..."); // Creating a label with text
GridPane gridPane = new GridPane(); // Creating a Grid Pane
gridPane.setPadding(new Insets(10, 10, 10, 10)); // Set the padding of the gridpane
// Set the vertical and horizontal gaps between the columns
gridPane.setVgap(15);
gridPane.setHgap(15);
gridPane.add(lbl, 0, 1); // Adding the label to the grid pane
gridPane.setAlignment(Pos.CENTER); // Align the grid pane
GridPane.setHalignment(lbl, HPos.RIGHT); // Setting the alignment for the child node of grid
// pane
Scene scene = new Scene(gridPane, 300, 300); // Creating a scene with necessary size
stage.setTitle("Grid Alignment Example"); // Setting title to the Application
stage.setScene(scene); // Adding scene to the stage
stage.show(); // Displaying the contents of the stage
}
public static void main(String args[]) {
launch(args); // Launching the application
}
}
コードの各行の目的については、すでに上記でコメントしています。ここで、トピックの主要部分について説明します。
行 gridPane.setVgap(15); gridPane.setHgap(15);
、各列の垂直方向と水平方向のギャップを作成しました。また、gridPane.setPadding(new Insets(10, 10, 10, 10));
の行にパディングを追加しました。
最も重要な部分は、グリッドペインと子ノードを別々に配置することです。コードでは、gridPane.setAlignment(Pos.CENTER);
の行を使用してグリッドペインを整列し、GridPane.setHalignment(lbl, HPos.RIGHT);
の行を使用しての子ノードを整列しました。グリッド。
この場合、子ノードのみがラベルを持っています。上記のサンプルコードをコンパイルしてご使用の環境で実行すると、以下の出力が得られます。
出力:
利用可能な Hbox
アライメント
以下にリストされているのは、グリッドペインの子で使用可能なすべての配置です。それらを setHalignment()
メソッド内に設定する必要があります。
このメソッドの一般的な形式は、setHalignment( ChildNode, Alignment)
です。
配置 | 説明 |
---|---|
HPos.BASELINE_LEFT |
ベースラインを垂直に揃え、左に水平に揃えます |
HPos.BASELINE_CENTER |
ベースラインを垂直に揃え、中央を水平に揃えます |
HPos.BASELINE_RIGHT |
ベースラインを垂直に揃え、右に水平に揃えます |
HPos.BOTTOM_LEFT |
下を垂直に揃え、左を水平に揃えます |
HPos.BOTTOM_CENTER |
下を垂直に揃え、中央を水平に揃えます |
HPos.BOTTOM_RIGHT |
下を垂直に揃え、右を水平に揃えます |
HPos.CENTER_LEFT |
中央を垂直に揃え、左を水平に揃えます |
HPos.CENTER |
中央を垂直に揃え、中央を水平に揃えます |
HPos.CENTER_RIGHT |
中央を垂直に揃え、右に水平に揃えます |
HPos.TOP_LEFT |
上を垂直に揃え、左を水平に揃えます |
HPos.TOP_CENTER |
上を垂直に揃え、中央を水平に揃えます |
HPos.TOP_RIGHT |
上を垂直に揃え、右に水平に揃えます |
IDE がライブラリとパッケージの自動インクルードをサポートしていない場合は覚えておいてください。次に、コンパイルする前に、これらの必要なライブラリとパッケージを手動で含める必要がある場合があります。
Aminul Is an Expert Technical Writer and Full-Stack Developer. He has hands-on working experience on numerous Developer Platforms and SAAS startups. He is highly skilled in numerous Programming languages and Frameworks. He can write professional technical articles like Reviews, Programming, Documentation, SOP, User manual, Whitepaper, etc.
LinkedIn