JavaFX - Aplicación

En este capítulo, discutiremos la estructura de una aplicación JavaFX en detalle y también aprenderemos a crear una aplicación JavaFX con un ejemplo.

Estructura de la aplicación JavaFX

En general, una aplicación JavaFX tendrá tres componentes principales: Stage, Scene y Nodes como se muestra en el siguiente diagrama.

Etapa

Un escenario (una ventana) contiene todos los objetos de una aplicación JavaFX. Está representado porStage clase del paquete javafx.stage. La etapa principal la crea la propia plataforma. El objeto de escenario creado se pasa como argumento alstart() método del Application clase (explicada en la siguiente sección).

Un escenario tiene dos parámetros que determinan su posición: Width y Height. Se divide en área de contenido y decoraciones (barra de título y bordes).

Hay cinco tipos de etapas disponibles:

  • Decorated
  • Undecorated
  • Transparent
  • Unified
  • Utility

Tienes que llamar al show() método para mostrar el contenido de un escenario.

Escena

Una escena representa el contenido físico de una aplicación JavaFX. Contiene todo el contenido de un escenario gráfico. La claseScene del paquete javafx.scenerepresenta el objeto de la escena. En una instancia, el objeto de escena se agrega a una sola etapa.

Puede crear una escena creando una instancia de la clase de escena. Puedes optar por el tamaño de la escena pasando sus dimensiones (alto y ancho) junto con elroot node a su constructor.

Gráfico de escena y nodos

UN scene graphes una estructura de datos en forma de árbol (jerárquica) que representa el contenido de una escena. En contraste, unnode es un objeto visual / gráfico de un escenario gráfico.

Un nodo puede incluir:

  • Objetos geométricos (gráficos) (2D y 3D) como: círculo, rectángulo, polígono, etc.

  • Controles de la interfaz de usuario como: botón, casilla de verificación, casilla de selección, área de texto, etc.

  • Contenedores (paneles de diseño) como el panel de borde, el panel de cuadrícula, el panel de flujo, etc.

  • Elementos multimedia como objetos de audio, vídeo e imagen.

los Node Clase del paquete javafx.scene representa un nodo en JavaFX, esta clase es la superclase de todos los nodos.

Como se discutió anteriormente, un nodo es de tres tipos:

  • Root Node - El primer gráfico de escena se conoce como nodo raíz.

  • Branch Node/Parent Node- El nodo con nodos secundarios se conoce como nodos de rama / padre. La clase abstracta llamadaParent del paquete javafx.scene es la clase base de todos los nodos principales, y esos nodos principales serán de los siguientes tipos:

    • Group- Un nodo de grupo es un nodo colectivo que contiene una lista de nodos secundarios. Siempre que se procesa el nodo del grupo, todos sus nodos secundarios se procesan en orden. Cualquier transformación, estado de efecto aplicado en el grupo se aplicará a todos los nodos secundarios.

    • Region - Es la clase base de todos los controles de IU basados ​​en el nodo JavaFX, como Chart, Pane y Control.

    • WebView - Este nodo gestiona el motor web y muestra su contenido.

  • Leaf Node- El nodo sin nodos secundarios se conoce como nodo hoja. Por ejemplo, Rectangle, Ellipse, Box, ImageView, MediaView son ejemplos de nodos hoja.

Es obligatorio pasar el nodo raíz al escenario gráfico. Si el grupo se pasa como raíz, todos los nodos se recortarán a la escena y cualquier alteración en el tamaño de la escena no afectará el diseño de la escena.

Crear una aplicación JavaFX

Para crear una aplicación JavaFX, debe crear una instancia de la clase Application e implementar su método abstracto start(). En este método, escribiremos el código para la aplicación JavaFX.

Clase de aplicación

los Application clase del paquete javafx.applicationes el punto de entrada de la aplicación en JavaFX. Para crear una aplicación JavaFX, debe heredar esta clase e implementar su método abstractostart(). En este método, debe escribir el código completo para los gráficos JavaFX

En el main método, debe iniciar la aplicación utilizando el launch()método. Este método llama internamente alstart() método de la clase Application como se muestra en el siguiente programa.

public class JavafxSample extends Application {  
   @Override     
   public void start(Stage primaryStage) throws Exception { 
      /* 
      Code for JavaFX application. 
      (Stage, scene, scene graph) 
      */       
   }         
   public static void main(String args[]){           
      launch(args);      
   } 
}

Dentro de start() método, para crear una aplicación JavaFX típica, debe seguir los pasos que se indican a continuación:

  • Prepare un escenario gráfico con los nodos requeridos.

  • Prepare una escena con las dimensiones requeridas y agregue el gráfico de escena (nodo raíz del gráfico de escena).

  • Prepare un escenario y agregue la escena al escenario y muestre el contenido del escenario.

Preparación del gráfico de escena

Según su aplicación, debe preparar un gráfico de escena con los nodos necesarios. Dado que el nodo raíz es el primer nodo, debe crear un nodo raíz. Como nodo raíz, puede elegir entreGroup, Region or WebView.

Group - Un nodo de grupo está representado por la clase denominada Group que pertenece al paquete javafx.scene, puede crear un nodo de grupo creando una instancia de esta clase como se muestra a continuación.

Group root = new Group();

los getChildren() método del Group la clase te da un objeto de la ObservableListclase que contiene los nodos. Podemos recuperar este objeto y agregarle nodos como se muestra a continuación.

//Retrieving the observable list object 
ObservableList list = root.getChildren(); 
       
//Setting the text object as a node  
list.add(NodeObject);

También podemos agregar objetos Node al grupo, simplemente pasándolos al Group class y a su constructor en el momento de la instanciación, como se muestra a continuación.

Group root = new Group(NodeObject);

Region - Es la clase base de todos los controles de interfaz de usuario basados ​​en el nodo JavaFX, como -

  • Chart - Esta clase es la clase base de todos los gráficos y pertenece al paquete javafx.scene.chart.

    Esta clase tiene dos subclases, que son: PieChart y XYChart. Estos dos a su vez tienen subclases comoAreaChart, BarChart, BubbleChart, etc., que se utilizan para dibujar diferentes tipos de gráficos de plano XY en JavaFX.

    Puede utilizar estas clases para incrustar gráficos en su aplicación.

  • Pane - Un panel es la clase base de todos los paneles de diseño, como AnchorPane, BorderPane, DialogPane, etc. Esta clase pertenece a un paquete que se llama como - javafx.scene.layout.

    Puede utilizar estas clases para insertar diseños predefinidos en su aplicación.

  • Control - Es la clase base de los controles de la interfaz de usuario, como Accordion, ButtonBar, ChoiceBox, ComboBoxBase, HTMLEditor, etc. This class belongs to the package javafx.scene.control.

    Puede utilizar estas clases para insertar varios elementos de la interfaz de usuario en su aplicación.

En un grupo, puede crear una instancia de cualquiera de las clases mencionadas anteriormente y usarlas como nodos raíz, como se muestra en el siguiente programa.

//Creating a Stack Pane 
StackPane pane = new StackPane();       
       
//Adding text area to the pane  
ObservableList list = pane.getChildren(); 
list.add(NodeObject);

WebView - Este nodo gestiona el motor web y muestra su contenido.

A continuación se muestra un diagrama que representa la jerarquía de clases de nodos de JavaFX.

Preparando la escena

Una escena JavaFX está representada por el Scene clase del paquete javafx.scene. Puede crear una escena instanciando esta clase como se muestra en el siguiente bloque cod.

Al crear una instancia, es obligatorio pasar el objeto raíz al constructor de la clase de escena.

Scene scene = new Scene(root);

También puede pasar dos parámetros de tipo doble que representan la altura y el ancho de la escena como se muestra a continuación.

Scene scene = new Scene(root, 600, 300);

Preparando el escenario

Este es el contenedor de cualquier aplicación JavaFX y proporciona una ventana para la aplicación. Está representado por elStage clase del paquete javafx.stage. Un objeto de esta clase se pasa como parámetro delstart() método del Application clase.

Con este objeto, puede realizar varias operaciones en el escenario. Principalmente, puede realizar lo siguiente:

  • Establece el título del escenario usando el método setTitle().

  • Adjunte el objeto de la escena al escenario usando el setScene() método.

  • Visualice el contenido de la escena usando el show() método como se muestra a continuación.

//Setting the title to Stage. 
primaryStage.setTitle("Sample application"); 
       
//Setting the scene to Stage 
primaryStage.setScene(scene); 
       
//Displaying the stage 
primaryStage.show();

Ciclo de vida de la aplicación JavaFX

La clase de aplicación JavaFX tiene tres métodos de ciclo de vida, que son:

  • start() - El método de punto de entrada donde se escribirá el código de gráficos JavaFX.

  • stop() - Un método vacío que se puede anular, aquí puede escribir la lógica para detener la aplicación.

  • init() - Un método vacío que se puede anular, pero no se puede crear escenario o escena en este método.

Además de estos, proporciona un método estático llamado launch() para iniciar la aplicación JavaFX.

Desde el launch()El método es estático, debe llamarlo desde un contexto estático (principal generalmente). Siempre que se inicie una aplicación JavaFX, se llevarán a cabo las siguientes acciones (en el mismo orden).

  • Se crea una instancia de la clase de aplicación.

  • Init() se llama al método.

  • los start() se llama al método.

  • El lanzador espera a que finalice la aplicación y llama al stop() método.

Finalización de la aplicación JavaFX

Cuando se cierra la última ventana de la aplicación, la aplicación JavaFX finaliza implícitamente. Puede desactivar este comportamiento pasando el valor booleano "False" al método estático. setImplicitExit() (debe llamarse desde un contexto estático).

Puede terminar una aplicación JavaFX explícitamente utilizando los métodos Platform.exit() o System.exit(En t).

Ejemplo 1: creación de una ventana vacía

Esta sección le enseña cómo crear una aplicación de muestra JavaFX que muestra una ventana vacía. Los siguientes son los pasos:

Paso 1: crear una clase

Cree una clase Java y herede la Application clase del paquete javafx.application e implementar el método start () de esta clase de la siguiente manera.

public class JavafxSample extends Application {  
   @Override     
   public void start(Stage primaryStage) throws Exception {      
   }    
}

Paso 2: crear un objeto de grupo

En el start() El método crea un objeto de grupo al instanciar la clase llamada Grupo, que pertenece al paquete javafx.scene, como sigue.

Group root = new Group();

Paso 3: crear un objeto de escena

Cree una escena creando una instancia de la clase llamada Scene que pertenece al paquete javafx.scene. A esta clase, pase el objeto Grupo(root), creado en el paso anterior.

Además del objeto raíz, también puede pasar dos parámetros dobles que representan la altura y el ancho de la pantalla junto con el objeto de la clase Group de la siguiente manera.

Scene scene = new Scene(root,600, 300);

Paso 4: Establecer el título del escenario

Puede establecer el título del escenario utilizando el setTitle() método del Stageclase. losprimaryStage es un objeto Stage que se pasa al método de inicio de la clase de escena, como parámetro.

Utilizando el primaryStage objeto, establezca el título de la escena como Sample Application Como se muestra abajo.

primaryStage.setTitle("Sample Application");

Paso 5: agregar escena al escenario

Puede agregar un objeto de escena al escenario usando el método setScene() de la clase nombrada Stage. Agregue el objeto Scene preparado en los pasos anteriores utilizando este método como se muestra a continuación.

primaryStage.setScene(scene);

Paso 6: Visualización del contenido del escenario

Muestre el contenido de la escena usando el método llamado show() del Stage clase de la siguiente manera.

primaryStage.show();

Paso 7: lanzamiento de la aplicación

Inicie la aplicación JavaFX llamando al método estático launch() del Application class del método principal de la siguiente manera.

public static void main(String args[]){   
   launch(args);      
}

Ejemplo

El siguiente programa genera una ventana JavaFX vacía. Guarde este código en un archivo con el nombreJavafxSample.java

import javafx.application.Application; 
import javafx.scene.Group; 
import javafx.scene.Scene; 
import javafx.scene.paint.Color; 
import javafx.stage.Stage;  

public class JavafxSample extends Application { 
   @Override     
   public void start(Stage primaryStage) throws Exception {            
      //creating a Group object 
      Group group = new Group(); 
       
      //Creating a Scene by passing the group object, height and width   
      Scene scene = new Scene(group ,600, 300); 
      
      //setting color to the scene 
      scene.setFill(Color.BROWN);  
      
      //Setting the title to Stage. 
      primaryStage.setTitle("Sample Application"); 
   
      //Adding the scene to Stage 
      primaryStage.setScene(scene); 
       
      //Displaying the contents of the stage 
      primaryStage.show(); 
   }    
   public static void main(String args[]){          
      launch(args);     
   }         
}

Compile y ejecute el archivo java guardado desde el símbolo del sistema utilizando los siguientes comandos.

javac JavafxSample.java 
java JavafxSample

Al ejecutarse, el programa anterior genera una ventana JavaFX como se muestra a continuación.

Ejemplo 2: dibujar una línea recta

En el ejemplo anterior, hemos visto cómo crear un escenario vacío, ahora en este ejemplo intentemos dibujar una línea recta usando la biblioteca JavaFX.

Los siguientes son los pasos:

Paso 1: crear una clase

Cree una clase Java y herede la Application clase del paquete javafx.application e implementar el start() método de esta clase de la siguiente manera.

public class DrawingLine extends Application {
   @Override     
   public void start(Stage primaryStage) throws Exception {     
   }    
}

Paso 2: crear una línea

Puede crear una línea en JavaFX creando una instancia de la clase llamada Line que pertenece a un paquete javafx.scene.shape, instancia esta clase de la siguiente manera.

//Creating a line object         
Line line = new Line();

Paso 3: Establecer propiedades en la línea

Especifique las coordenadas para dibujar la línea en un plano XY estableciendo las propiedades startX, startY, endX y endY, utilizando sus respectivos métodos de establecimiento como se muestra en el siguiente bloque de código.

line.setStartX(100.0); 
line.setStartY(150.0); 
line.setEndX(500.0); 
line.setEndY(150.0);

Paso 4: crear un objeto de grupo

En el método start (), cree un objeto de grupo creando una instancia de la clase llamada Grupo, que pertenece al paquete javafx.scene.

Pase el objeto Line (nodo), creado en el paso anterior, como parámetro al constructor de la clase Group, para agregarlo al grupo de la siguiente manera:

Group root = new Group(line);

Paso 5: creación de un objeto de escena

Cree una escena creando una instancia de la clase llamada Scene que pertenece al paquete javafx.scene. A esta clase, pase el objeto Grupo(root) que se creó en el paso anterior.

Además del objeto raíz, también puede pasar dos parámetros dobles que representan la altura y el ancho de la pantalla junto con el objeto de la clase Group de la siguiente manera.

Scene scene = new Scene(group ,600, 300);

Paso 6: Establecer el título del escenario

Puede establecer el título del escenario utilizando el setTitle() método del Stageclase. losprimaryStage es un objeto Stage que se pasa al método de inicio de la clase de escena, como parámetro.

Utilizando el primaryStage objeto, establezca el título de la escena como Sample Application como sigue.

primaryStage.setTitle("Sample Application");

Paso 7: agregar escena al escenario

Puede agregar un objeto de escena al escenario usando el método setScene() de la clase nombrada Stage. Agregue el objeto Scene preparado en los pasos anteriores utilizando este método de la siguiente manera.

primaryStage.setScene(scene);

Paso 8: Visualización del contenido del escenario

Muestre el contenido de la escena usando el método llamado show() del Stage clase de la siguiente manera.

primaryStage.show();

Paso 9: lanzamiento de la aplicación

Inicie la aplicación JavaFX llamando al método estático launch() del Application class del método principal de la siguiente manera.

public static void main(String args[]){   
   launch(args);      
}

Ejemplo

El siguiente programa muestra cómo generar una línea recta usando JavaFX. Guarde este código en un archivo con el nombreJavafxSample.java.

import javafx.application.Application; 
import javafx.scene.Group; 
import javafx.scene.Scene; 
import javafx.scene.shape.Line; 
import javafx.stage.Stage;  

public class DrawingLine extends Application{ 
   @Override 
   public void start(Stage stage) { 
      //Creating a line object 
      Line line = new Line(); 
         
      //Setting the properties to a line 
      line.setStartX(100.0); 
      line.setStartY(150.0); 
      line.setEndX(500.0); 
      line.setEndY(150.0); 
         
      //Creating a Group 
      Group root = new Group(line); 
         
      //Creating a Scene 
      Scene scene = new Scene(root, 600, 300); 
         
      //Setting title to the scene 
      stage.setTitle("Sample application"); 
         
      //Adding the scene to the stage 
      stage.setScene(scene); 
         
      //Displaying the contents of a scene 
      stage.show(); 
   }      
   public static void main(String args[]){ 
      launch(args); 
   } 
}

Compile y ejecute el archivo java guardado desde el símbolo del sistema utilizando los siguientes comandos.

javac DrawingLine.java 
java DrawingLine

Al ejecutarse, el programa anterior genera una ventana JavaFX que muestra una línea recta como se muestra a continuación.

Ejemplo 3: visualización de texto

También podemos incrustar texto en la escena JavaFX. Este ejemplo muestra cómo incrustar texto en JavaFX.

Los siguientes son los pasos:

Paso 1: crear una clase

Cree una clase Java y herede la Application clase del paquete javafx.application e implementar el start() método de esta clase de la siguiente manera.

public class DrawingLine extends Application {  
   @Override     
   public void start(Stage primaryStage) throws Exception {     
   } 
}

Paso 2: incrustación de texto

Puede incrustar texto en una escena JavaFX creando una instancia de la clase llamada Text que pertenece a un paquete javafx.scene.shape, instancia esta clase.

Puede crear una instancia de esta clase pasando el texto que se incrustará, en formato de cadena, o puede crear un objeto de texto utilizando el constructor predeterminado como se muestra a continuación.

//Creating a Text object 
Text text = new Text();

Paso 3: Configurar la fuente

Puede establecer la fuente del texto utilizando el setFont() método del Textclase. Este método acepta un objeto de fuente como parámetros. Establezca la fuente del texto dado en 45 como se muestra a continuación.

//Setting font to the text 
text.setFont(new Font(45));

Paso 4: Establecer la posición del texto

Puede establecer la posición del texto en el plano XY estableciendo las coordenadas X, Y utilizando los respectivos métodos de establecimiento setX() y setY() como sigue.

//setting the position of the text 
text.setX(50); 
text.setY(150);

Paso 5: Configurar el texto que se agregará

Puede configurar el texto que se agregará utilizando el método setText () de la clase Text. Este método acepta un parámetro de cadena que representa el texto que se agregará.

text.setText("Welcome to Tutorialspoint");

Paso 6: creación de un objeto de grupo

En el start() método, cree un objeto de grupo creando una instancia de la clase llamada Grupo, que pertenece al paquete javafx.scene.

Pase el objeto Text (nodo), creado en el paso anterior, como parámetro al constructor de la clase Group, para agregarlo al grupo de la siguiente manera:

Group root = new Group(text)

Paso 7: creación de un objeto de escena

Cree una escena creando una instancia de la clase llamada Scene que pertenece al paquete javafx.scene. A esta clase, pase el objeto Grupo(root), creado en el paso anterior.

Además del objeto raíz, también puede pasar dos parámetros dobles que representan la altura y el ancho de la pantalla junto con el objeto de la clase Group de la siguiente manera.

Scene scene = new Scene(group ,600, 300);

Paso 8: Establecer el título del escenario

Puede establecer el título del escenario utilizando el setTitle() método del Stageclase. losprimaryStage es un objeto Stage que se pasa al método de inicio de la clase de escena, como parámetro.

Utilizando el primaryStage objeto, establezca el título de la escena como Sample Application Como se muestra abajo.

primaryStage.setTitle("Sample Application");

Paso 9: Agregar escena al escenario

Puede agregar un objeto de escena al escenario usando el método setScene() de la clase nombrada Stage. Agregue el objeto Scene preparado en los pasos anteriores utilizando este método de la siguiente manera.

primaryStage.setScene(scene);

Paso 10: Visualización del contenido del escenario

Muestre el contenido de la escena usando el método llamado show() del Stage clase de la siguiente manera.

primaryStage.show();

Paso 11: Lanzamiento de la aplicación

Inicie la aplicación JavaFX llamando al método estático launch() del Application class del método principal de la siguiente manera.

public static void main(String args[]){ 
   launch(args);      
}

Ejemplo

A continuación se muestra el programa para mostrar texto usando JavaFX. Guarde este código en un archivo con nombreDisplayingText.java.

import javafx.application.Application; 
import javafx.collections.ObservableList; 
import javafx.scene.Group; 
import javafx.scene.Scene; 
import javafx.stage.Stage; 
import javafx.scene.text.Font; 
import javafx.scene.text.Text; 
         
public class DisplayingText extends Application { 
   @Override 
   public void start(Stage stage) {       
      //Creating a Text object 
      Text text = new Text(); 
       
      //Setting font to the text 
      text.setFont(new Font(45)); 
       
      //setting the position of the text 
      text.setX(50); 
      text.setY(150);          
      
      //Setting the text to be added. 
      text.setText("Welcome to Tutorialspoint"); 
         
      //Creating a Group object  
      Group root = new Group(); 
       
      //Retrieving the observable list object 
      ObservableList list = root.getChildren(); 
       
      //Setting the text object as a node to the group object 
      list.add(text);       
               
      //Creating a scene object 
      Scene scene = new Scene(root, 600, 300); 
       
      //Setting title to the Stage 
      stage.setTitle("Sample Application"); 
         
      //Adding scene to the stage 
      stage.setScene(scene); 
         
      //Displaying the contents of the stage 
      stage.show(); 
   }   
   public static void main(String args[]){ 
      launch(args); 
   } 
}

Compile y ejecute el archivo java guardado desde el símbolo del sistema utilizando los siguientes comandos.

javac DisplayingText.java 
java DisplayingText

Al ejecutarse, el programa anterior genera una ventana JavaFX que muestra texto como se muestra a continuación.