JavaFX - Paneles de diseño (contenedores)

Después de construir todos los nodos necesarios en una escena, generalmente los organizaremos en orden.

Esta disposición de los componentes dentro del contenedor se denomina Disposición del contenedor. También podemos decir que seguimos un diseño, ya que incluye colocar todos los componentes en una posición particular dentro del contenedor.

JavaFX proporciona varios diseños predefinidos, como HBox, VBox, Border Pane, Stack Pane, Text Flow, Anchor Pane, Title Pane, Grid Pane, Flow Paneletc.

Cada uno de los diseños mencionados anteriormente está representado por una clase y todas estas clases pertenecen al paquete javafx.layout. La clase nombradaPane es la clase base de todos los diseños en JavaFX.

Crear un diseño

Para crear un diseño, necesita:

  • Crear nodo.
  • Cree una instancia de la clase respectiva del diseño requerido.
  • Establezca las propiedades del diseño.
  • Agregue todos los nodos creados al diseño.

Creando nodos

En primer lugar, cree los nodos necesarios de la aplicación JavaFX instanciando sus respectivas clases.

Por ejemplo, si desea tener un campo de texto y dos botones, a saber, reproducir y detener en un diseño HBox, tendrá que crear inicialmente esos nodos como se muestra en el siguiente bloque de código:

//Creating a text field 
TextField textField = new TextField();       

//Creating the play button 
Button playButton = new Button("Play");       

//Creating the stop button 
Button stopButton = new Button("stop");

Instanciar la clase respectiva

Después de crear los nodos (y completar todas las operaciones en ellos), cree una instancia de la clase del diseño requerido.

Por ejemplo, si desea crear un diseño de Hbox, debe crear una instancia de esta clase de la siguiente manera.

HBox hbox = new HBox();

Configuración de las propiedades del diseño

Después de crear una instancia de la clase, debe establecer las propiedades del diseño utilizando sus respectivos métodos de establecimiento.

Por ejemplo: si desea establecer un espacio entre los nodos creados en el diseño de HBox, debe establecer un valor en la propiedad denominada espaciado. Esto se puede hacer usando el método settersetSpacing() como se muestra a continuación -

hbox.setSpacing(10);

Agregar el objeto de forma al grupo

Finalmente, debe agregar el objeto de la forma al grupo pasándolo como un parámetro del constructor como se muestra a continuación.

//Creating a Group object  
Group root = new Group(line);

Paneles de diseño

A continuación se muestran los distintos paneles de diseño (clases) proporcionados por JavaFX. Estas clases existen en el paquetejavafx.scene.layout.

S. No Forma y descripción
1 HBox

El diseño de HBox organiza todos los nodos de nuestra aplicación en una sola fila horizontal.

La clase nombrada HBox del paquete javafx.scene.layout representa el diseño del cuadro de texto horizontal.

2 VBox

El diseño de VBox organiza todos los nodos de nuestra aplicación en una sola columna vertical.

La clase nombrada VBox del paquete javafx.scene.layout representa el diseño del cuadro vertical de texto.

3 BorderPane

El diseño del Panel de borde organiza los nodos en nuestra aplicación en las posiciones superior, izquierda, derecha, inferior y central.

La clase nombrada BorderPane del paquete javafx.scene.layout representa el diseño del panel de borde.

4 StackPane

El diseño del panel de pila organiza los nodos de nuestra aplicación encima de otro como en una pila. El nodo agregado primero se coloca en la parte inferior de la pila y el siguiente nodo se coloca encima.

La clase nombrada StackPane del paquete javafx.scene.layout representa el diseño del panel de la pila.

5 TextFlow

El diseño de flujo de texto organiza varios nodos de texto en un solo flujo.

La clase nombrada TextFlow del paquete javafx.scene.layout representa el diseño del flujo de texto.

6 AnchorPane

El diseño del panel de anclaje ancla los nodos en nuestra aplicación a una distancia particular del panel.

La clase nombrada AnchorPane del paquete javafx.scene.layout representa el diseño del Panel de anclaje.

7 TilePane

El diseño del Panel de mosaicos agrega todos los nodos de nuestra aplicación en forma de mosaicos de tamaño uniforme.

La clase nombrada TilePane del paquete javafx.scene.layout representa el diseño de TilePane.

8 GridPane

El diseño del Panel de cuadrícula organiza los nodos en nuestra aplicación como una cuadrícula de filas y columnas. Este diseño es útil al crear formularios con JavaFX.

La clase nombrada GridPane del paquete javafx.scene.layout representa el diseño GridPane.

9 FlowPane

El diseño del panel de flujo envuelve todos los nodos en un flujo. Un panel de flujo horizontal envuelve los elementos del panel en su altura, mientras que un panel de flujo vertical envuelve los elementos en su ancho.

La clase nombrada FlowPane del paquete javafx.scene.layout representa el diseño del Panel de flujo.