domingo, 11 de noviembre de 2012

Introducción a JavaFX 2

JavaFX es una plataforma de desarrollo de RIAs(Rich Internet Applications, Aplicaciones Enriquecidas para Internet), pero también sirve para desarrollar aplicaciones de escritorio y para dispositivos móviles. En este tutorial daré a conocer el desarrollo de aplicaciones de escritorio con JavaFX, como también de CSS(Cascading Style Sheets), JavaFX usa hojas de estilo en cascada para dar una mejor apariencia a las aplicaciones a desarrollar.
Para empezar, primeramente necesitamos descargar el JDK 7 u9 de Java, en ese JDK ya viene incluido JavaFX, y como IDE de programación usaremos NetBeans 7.2, pero también podemos usar Eclipse Juno(previa instalación del plugin para JavaFX).

Ahora empecemos con un ejemplo, con el clásico hola mundo, pensaba omitir esto, pero veo que es necesario, ya que en el siguiente tutorial haré uso de este; ya instalado el JDK de Java y del IDE NetBeans procedemos a crear un nuevo proyecto en NetBeans, File->New Project->JavaFX->JavaFX Application



Como se puede ver en la Fig. 01, primeramente le damos un nombre al proyecto, luego la localización donde se guardara nuestro proyecto, seguidamente la carpeta que contendrá nuestro proyecto, seleccionamos la plataforma en que desarrollaremos nuestro proyecto, en este caso sera Default JavaFX Platforms, ya en la parte final Create Application Class damos el nombre de nuestro paquete que contendra nuestras clases, seguidamente un punto (.) , luego de este punto damos el nombre de nuestra clase  principal, bueno en este caso, yo asigne el nombre de paquete al nombre de mi paquete y Principal al nombre de mi clase principal, luego finalizamos. A continuación nuestro proyecto quedaría así:

package paquete;

import javafx.application.Application;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.scene.Scene;
import javafx.scene.control.Button;
import javafx.scene.layout.StackPane;
import javafx.stage.Stage;

public class Principal extends Application {
    
    public void start(Stage primaryStage) {
        Button btn = new Button();
        btn.setText("Say 'Hello World'");
        btn.setOnAction(new EventHandler<ActionEvent>() {
            public void handle(ActionEvent event) {
                System.out.println("Hello World!");
            }
        });        
        StackPane root = new StackPane();
        root.getChildren().add(btn);        
        Scene scene = new Scene(root, 300, 250);        
        primaryStage.setTitle("Hello World!");
        primaryStage.setScene(scene);
        primaryStage.show();
    }
    public static void main(String[] args) {
        launch(args);
    }
}

Ahora explicare el código, en la parte superior podemos observar el nombre del paquete que creamos anteriormente, seguidamente se importa las librerías necesarias para el funcionamiento de este pequeño programa, luego se crea la clase pública Principal que esta a  la vez hereda de la clase Application, luego agregamos el método public void start(Stage primaryStage), ya que sino lo hacemos, nos marcaría un error, luego creamos e instanciamos un botón llamado btn, le damos un nombre con el método setText(), a continuación asignamos un evento al botón, que cuando se haga clic en el botón nos muestre por consola un mensaje, en este caso "Hello World". Luego creamos un objeto StackPane que tiene por nombre root este es un tipo de panel especial, que cuando agregamos los controles o componentes(Button, Label, TextField, etc), los agrega uno encima de otro en el orden que agregamos los controles o componentes a nuestro panel root, luego agregamos el botón al panel root, luego creamos un objeto del tipo Scene llamado scene, este es un escenario al cual agregamos nuestro panel root, y le asignamos un tamaño de 300x250 al momento de instanciarlo, seguidamente hacemos uso del objeto primaryStage del tipo Stage, asignando un nombre a nuestra ventana con el método setTitle(), luego asignamos el objeto scene a nuestro primaryStage con el método setScene(), luego mostramos nuestra venta ventana con el método show(), así se vera nuestro primer programa:



Bueno eso seria todo por este primer tutorial, si tienen alguna pregunta pueden hacerla, y para el próximo tutorial haremos una ventana de dialogo modal tipo JOptionPane de Java, ya que JavaFX no cuenta con una ventana de dialogo. aqui tienen una imagen, espero que sea de su agrado


Nos vemos en el próximo tutorial...

5 comentarios:

  1. Hola Luis,

    la verdad soy totalmente nuevo en JavaFx, y desarrollo en otros lenguajes, quisiera si no es mucho pedirte, si puedes hacer un video o un manual de como se hace completamente un CRUD con javaFX, con base de datos Mysql, la verdad es que me he cansado de buscar videos y manuales pero no los encuentro muy explicativos, veo que lo fuerte de javafx es muy grafico, pero me gustaria incursionar por completo pero trabajando BD directamente y despues si incursionar mas en sus bondades graficas. antemano muchs gracias

    ResponderEliminar
  2. Mi correo es yesidcallegonzalez@gmail.com, o si tienes un manual que me ayude muy facil comprender hacer un CRUD con bases de datos con Javafx

    ResponderEliminar
  3. disculpa que aparece es el correo de mi hijo,pero estaba abierto en ese momento. gracias

    ResponderEliminar
  4. Ya estoy preparando un tutorial con acceso a BD, solo tienes que esperar... lo publicare en este mismo blog.

    ResponderEliminar
  5. y cuando terminas de hacer el video tutorial?

    ResponderEliminar