Grid- und Child-Node-Ausrichtung in JavaFX

In JavaFX gibt es eine UI-Komponente namens GridPane. Durch diese UI-Komponente werden alle untergeordneten Knoten in Form eines Rasters aus Spalten und Zeilen angeordnet.

Das erforderliche Paket für diese Komponente ist javafx.scene.layout.

In diesem Artikel gehen wir auf die Ausrichtung ein und erklären ein Beispiel zu diesem Thema zum besseren Verständnis.

Grid- und Child-Node-Ausrichtung in JavaFX

Im folgenden Beispiel haben wir ein Rasterfeld mit einem Etikett erstellt. Der Code für unser Beispiel ist unten angegeben.

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
  }
}

Wir haben oben bereits den Zweck jeder Codezeile kommentiert. Jetzt werden wir die Hauptteile des Themas hier besprechen.

Durch die Zeile gridPane.setVgap(15); gridPane.setHgap(15); haben wir die vertikale und horizontale Lücke für jede Spalte erstellt. Wir haben auch Padding durch die Zeile gridPane.setPadding(new Insets(10, 10, 10, 10)); hinzugefügt.

Der wichtigste Teil ist das separate Ausrichten des Rasterbereichs und der untergeordneten Knoten. Im Code haben wir durch die Zeile gridPane.setAlignment(Pos.CENTER); den Gitterbereich ausgerichtet und durch die Zeile GridPane.setHaignment(lbl, HPos.RIGHT); haben wir die untergeordneten Knoten des ausgerichtet Netz.

In unserem Fall hat nur ein untergeordneter Knoten das Label. Nachdem Sie den obigen Beispielcode kompiliert und in Ihrer Umgebung ausgeführt haben, erhalten Sie die folgende Ausgabe.

Ausgabe:

Verfügbare Hbox-Ausrichtungen

Nachfolgend sind alle verfügbaren Ausrichtungen für die untergeordneten Elemente des Grid-Bereichs aufgeführt. Sie müssen sie innerhalb der Methode setHaignment() setzen.

Das allgemeine Format dieser Methode ist setHaignment( ChildNode, Alignment).

Denken Sie daran, wenn Ihre IDE das automatische Einbinden von Bibliotheken und Paketen nicht unterstützt. Dann müssen Sie diese erforderlichen Bibliotheken und Pakete vor dem Kompilieren möglicherweise manuell einschließen.