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