MANUAL DE MANTENIMIENTO - …pegasus.javeriana.edu.co/~CIS1310IS11/manualmantenimientov3.pdf ·...

61
MANUAL DE MANTENIMIENTO CLUBMAT: GESTOR DE CLUBES DE MATEMÁTICAS CONSTRUIDO CON TECNOLOGÍAS JAVA EE 6 Y JAVAFX 2 ANDRÉS EDUARDO SÁNCHEZ MENDIETA PONTIFICIA UNIVERSIDAD JAVERIANA FACULTAD DE INGENIERIA CARRERA DE INGENIERIA DE SISTEMAS BOGOTÁ, D.C. 2013

Transcript of MANUAL DE MANTENIMIENTO - …pegasus.javeriana.edu.co/~CIS1310IS11/manualmantenimientov3.pdf ·...

MANUAL DE MANTENIMIENTO

CLUBMAT: GESTOR DE CLUBES DE MATEMÁTICAS CONSTRUIDO CON

TECNOLOGÍAS JAVA EE 6 Y JAVAFX 2

ANDRÉS EDUARDO SÁNCHEZ MENDIETA

PONTIFICIA UNIVERSIDAD JAVERIANA

FACULTAD DE INGENIERIA

CARRERA DE INGENIERIA DE SISTEMAS

BOGOTÁ, D.C.

2013

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

2

Tabla de contenido

INTRODUCCIÓN ..................................................................................................................... 4

1. TECNOLOGÍAS INVOLUCRADAS ............................................................................. 5

2. INSTALACIÓN DE HERRAMIENTAS ........................................................................ 7

2.1. Instalación de JDK .....................................................................................................7

2.2. Instalación de Netbeans junto a Glassfish ..................................................................7

2.3. Instalación de PostgreSQL .........................................................................................7

2.3.1. Inicio de sesión secundario en Windows 7 ........................................................7

2.3.2. Instalación de PostgreSQL .................................................................................8

2.4. Instalación de JavaFX2 Scene Builder .......................................................................8

2.5. Librería para dialogoS flotantes en JavaFX 2 ............................................................9

3. DESARROLLO BÁSICO DE UNA APLICACIÓN JAVAFX2 ACOPLADO A

COMPONENTES DE JAVA EE 6 .......................................................................................... 10

3.1. Creación de una base de datos en PostgreSQL ........................................................10

3.2. Conexión de Netbeans con PostgreSQL ..................................................................12

3.3. Creación en Netbeans de un proyecto Java EE ........................................................14

3.3.1. Creación del proyecto ......................................................................................14

3.3.2. Generación del descriptor de Persistencia en Netbeans ...................................15

3.3.3. Creando un proyecto Java EE 6 con una entidad y un EJB en Netbeans .........18

3.3.4. exponer el EJB como un Servicio Web SOAP en Netbeans ............................24

3.3.5. Desplegar el proyecto Java EE en Netbeans ....................................................25

3.4. Creación en Netbeans de un proyecto JavaFX 2 que invocará Servicios Web ........28

3.4.1. Creación del proyecto ......................................................................................28

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

3

3.4.2. Generar métodos auxiliares que invocan Un Servicio Web desde el proyecto

JavaFX 2 ........................................................................................................................30

3.4.3. Construir la interfaz gráfica usando JavaFX Scene Builder ............................33

3.4.4. Inyección de elementos gráficos de Javafx Scene Builder e invocación del

Servicio Web como reacción a eventos .........................................................................37

3.4.5. Invocación de la aplicación JavaFX 2 a través del navegador Web ................40

4. PONER EN EJECUCIÓN LA APLICACIÓN WEB CLUBMAT DESDE

NETBEANS ............................................................................................................................. 42

4.1. Creación de base de datos en PostgreSQL ...............................................................42

4.2. Ejecucion de CLUBMAT desde la IDE Netbeans ...................................................44

5. GESTIÓN DE VENTANAS CON JAVAFX 2 ............................................................. 48

6. MANEJO DE DIALOGOS CON JAVAFX 2 ............................................................... 51

7. ESQUEMA DE DESARROLLO DE UN CRUD EN JAVAFX 2 ............................... 53

7.1. Estructura de los proyectos que componen la aplicación web CLUBMAT ............53

7.2. Pasos generales para crear un CRUD en JavaFX 2..................................................57

8. REFERENCIAS Y BIBLIOGRAFÍA ........................................................................... 61

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

4

INTRODUCCIÓN

En el presente manual encontrará como realizar el acoplamiento entre JavaFX 2 y Java EE 6.

También encontrará cómo desarrollar en ese ambiente combinado.

Este manual fue realizado para el sistema operativo Microsoft Windows 7.

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

5

1. TECNOLOGÍAS INVOLUCRADAS

Antes de explicar cómo se realizó el acoplamiento de tecnologías es importante que se tenga

claridad sobre que tecnologías se van a integrar y que herramientas se deben usar.

Java EE 6: es una plataforma de programación que se compone de varios framework,

utilizado para el desarrollo de aplicaciones empresariales distribuidas, empleando el

lenguaje de programación Java.

JavaFX 2: JavaFX 2 [2] es el framework propuesto por Sun Microsystems, hoy Oracle,

para el desarrollo de aplicaciones RIA basadas en el lenguaje de programación Java.

[3]

Las aplicaciones JavaFX 2 tienen una orientación hacia multimedia y pueden ser

ejecutadas en el navegador, sin necesidad de cargar ningún plugin, gracias a que los

navegadores soportan la máquina virtual Java. [3]

JavaFX Scene Builder: herramienta bastante útil para los programadores que

construyen aplicaciones en Java y necesitan crear interfaces gráficas complejas. Esta

utilidad se puede usar para la construcción de la interfaz de una aplicación en forma

visual, sin necesidad de escribir código.

Glassfish 3: es un servidor de aplicaciones de código abierto compatible con Java EE

6 [1], listo para funcionar en entornos de producción.

GlassFish 3 proporciona una pequeña base con todas las funciones para la

implementación de Java EE 6. [1]

PostgreSQL 9: es un sistema de base de datos relacional basado en POSTGRES. Fue

pionera en muchos conceptos implementados en algunas soluciones comerciales. Por

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

6

su licencia libre, PostgreSQL puede ser utilizado, modificado, y distribuido

gratuitamente para cualquier propósito, sea privado, comercial, o académico. [4]

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

7

2. INSTALACIÓN DE HERRAMIENTAS

Debe instalar las siguientes herramientas para poder realizar el acople entre el framework

JavaFX 2 y la plataforma Java EE 6. Igualmente son necesarias para desarrollar y mantener la

aplicación CLUBMAT: Gestor de clubes de matemáticas.

2.1. INSTALACIÓN DE JDK

Descargue e instale Java SE Development Kit (JDK) en su última versión de la URL:

http://www.oracle.com/technetwork/java/javase/downloads/index.html

La JDK usada al momento de realizar este manual fue la versión 7u25.

Nota: El JDK a partir de la versión 7 incluye las librerías de soporte para JavaFX 2.

2.2. INSTALACIÓN DE NETBEANS JUNTO A GLASSFISH

Descargue e instale la IDE Netbeans con soporte para Java EE y en idioma ingles de la

URL: http://www.netbeans.org/downloads.

Al momento de realizar este manual se usó la versión 7.3.0.

Esta IDE incluye:

Driver actualizado para PostgreSQL 9.

Servidor de aplicaciones Glassfish 3.1.2.

Soporte para trabajar con JavaFX 2.

2.3. INSTALACIÓN DE POSTGRESQL

Debe realizar los siguientes pasos para instalar el motor de la base de datos

PostgreSQL:

2.3.1. INICIO DE SESIÓN SECUNDARIO EN WINDOWS 7

1) Verifique que su sistema operativo tiene activo el servicio “Inicio de sesión

secundario”. Para esto vaya a Inicio >> Panel de control >> Herramientas

administrativas >> Servicios >> Inicio de sesión secundario.

2) En el campo “Tipo de inicio” elija “Automático”. Haga Click en aceptar.

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

8

3) Verifique que el estado de este servicio se encuentre en “Iniciado”. Si no es así,

haga Click derecho sobre “Inicio de sesión secundario” >> Iniciar. El servicio

debe mostrarse de la siguiente manera:

2.3.2. INSTALACIÓN DE POSTGRESQL

1) Ejecute el instalador de PostgreSQL, en el caso de la versión 9.2.4, el archivo es

postgresql-9.2.4-1-windows.exe.

2) En el asistente de instalación de PostgreSQL llega un punto en que le dice: “Por

favor, proporcione una contraseña para el superusuario base de datos

postgres”. Establezca la contraseña: postgres.

3) Seleccione las opciones por defecto para las demás preguntas que le realice el

asistente de instalación.

Al finalizar el asistente le pregunta si desea lanzar “Stack Builder”, diga que no

y haga Click en terminar.

2.4. INSTALACIÓN DE JAVAFX2 SCENE BUILDER

Descargue e instale JavaFX Scene Builder de la URL:

http://www.oracle.com/technetwork/java/javafx/downloads/index.html

Al momento de realizar este manual se usó la versión 1.1.

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

9

2.5. LIBRERÍA PARA DIALOGOS FLOTANTES EN JAVAFX 2

Descargue la librería javafx-dialogs-0.0.3.jar. La puede descargar de la URL:

https://github.com/marcojakob/javafx-ui-sandbox/tree/master/javafx-dialogs/dist

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

10

3. DESARROLLO BÁSICO DE UNA APLICACIÓN JAVAFX2

ACOPLADO A COMPONENTES DE JAVA EE 6

En esta sección se explica paso a paso cómo realizar el acople entre el framework JavaFX 2 y

la plataforma Java EE 6, desarrollando una aplicación sencilla que usa una base de datos

PostgreSQL y el servidor de aplicaciones Glassfish 3.1.2.

Para lograr la integración de tecnologías mencionada realice los siguientes pasos:

3.1. CREACIÓN DE UNA BASE DE DATOS EN POSTGRESQL

1) Ejecute el software pgAdmin III y luego haga doble Click en el servidor. Ingrese la

contraseña que ingreso en el proceso de instalación.

2) Vaya a Bases de datos >> postgres.

En la barra de herramientas haga Click en “Ejecutar consultas SQL arbitrarias.”

3) Copie y pegue el siguiente Script para crear el usuario "clubmat":

CREATE USER clubmat LOGIN

NOSUPERUSER INHERIT CREATEDB NOCREATEROLE

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

11

ENCRYPTED PASSWORD 'clubmat';

Ejecute el Script haciendo Click en “Ejecutar consulta”.

Nota: En el script remplace clubmat por el nombre de usuario que usted desee crear.

4) Para crear la base de datos vaya a “Ejecutar consultas SQL arbitrarias” y copie y pegue

el siguiente script. Con el va crear una base de datos "clubmat" cuyo usuario dueño

será "clubmat":

CREATE DATABASE clubmat

WITH OWNER = clubmat

ENCODING = 'UTF8';

Ejecute el Script haciendo Click en “Ejecutar consulta”.

5) Compruebe que la base de datos que acabo de crear salga listada como existente.

En algunos casos pgAdmin III se demora en listar una base de datos recién creada.

Espere un momento, haga Clickk en “Bases de Datos” y ejecute la opción refrescar

hasta que salga listada la base de datos.

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

12

3.2. CONEXIÓN DE NETBEANS CON POSTGRESQL

1) Abra la IDE Netbeans, diríjase a la pestaña Services >> Databases >> Drivers.

2) La IDE Netbeans en su versión 7 o superior incluye el driver para PostgreSQL.

Compruebe que sale listado.

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

13

3) Ahora cree la conexión que le servirá de referencia para la unidad de persistencia. Haga

Click derecho sobre PostgreSQL y seleccione “Connect Ussing…” y aparecerá una

ventana en la cual tiene que llenar todos los datos requeridos. Debe quedar algo como

lo siguiente:

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

14

En el campo Database coloque el nombre de la base de datos que creó en PostgreSQL.

Luego haga Click en “Test Connection” y si la conexión se realizó exitosamente le

debe salir un aviso diciéndole “Connection Succeeded”. Después haga Click en

“Next”.

4) En el campo “Select schema:” elija “public”. Haga Click en “Finish”.

3.3. CREACIÓN EN NETBEANS DE UN PROYECTO JAVA EE

3.3.1. CREACIÓN DEL PROYECTO

1) Ahora lo que debe hacer es crear un proyecto para la aplicación empresarial Java EE

6. Vaya a “File” >> “New Project…” >> “Java EE” >> “Enterprise Aplication” y

después haga Click en “Next”.

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

15

2) Elija el nombre de proyecto que desee, luego haga Click en el botón “Next”.

Desactive la opción “Create EJB Module”. Luego haga Click en “Finish”. Debe quedar

algo como lo siguiente:

3.3.2. GENERACIÓN DEL DESCRIPTOR DE PERSISTENCIA EN NETBEANS

1) Ahora debe crear una unidad de persistencia. Para esto haga Click derecho sobre el

modulo web de la aplicación y vaya a “New” >> “Other…” >> “Persistence” >>

“Persistence Unit”. Haga Click en “Next”.

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

16

2) Seleccione “Eclipselink” como proveedor de persistencia. Puede dejar el nombre por

defecto para la unidad de persistencia o colocar el que usted deseé.

En el campo “Data Source” seleccione “New Data Source”.

3) En “Database Connection” seleccione la conexión PostgreSQL a la base de datos que

usted creó. En “JNDI Name” coloque el nombre que desee. Haga Click en OK. Después

haga Click en “Finish”, debe quedarle algo como en la siguiente ilustración:

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

17

4) Debe complementar el archivo persistence.xml que fue generado por Netbeans.

Vaya al módulo web de la aplicación >> “Configuration Files” >> “persistence.xml”

Haga Click en “Source”.

5) Después de la línea:

<property name="eclipselink.ddl-generation" value="create-tables"/>

Agregue el siguiente código, editando los datos según el nombre de su base de datos,

usuario y contraseña:

<property name="eclipselink.target-database" value="PostgreSQL"/>

<property name="javax.persistence.jdbc.driver"

value="org.postgresql.Driver"/>

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

18

<property name="javax.persistence.jdbc.url"

value="jdbc:postgresql://localhost:5432/clubmat"/>

<property name="javax.persistence.jdbc.user" value="clubmat"/>

<property name="javax.persistence.jdbc.password" value="clubmat"/>

<property name="eclipselink.logging.level" value="INFO"/>

3.3.3. CREANDO UN PROYECTO JAVA EE 6 CON UNA ENTIDAD Y UN EJB EN

NETBEANS

1) Primero que todo, debemos crear un paquete para colocar nuestra entidad persistente.

Haga Click derecho sobre el modulo web de su proyecto >> “New” >> “Java Package”.

2) En el campo “Package Name” coloque “co.edu.javeriana.clubmat.ejb” y haga Click en

“Finish”.

3) Haga Click derecho sobre el modulo web de su proyecto >> “New” >> “Other…” >>

“Persistence” >> “Entity Class”. Haga Click en Next.

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

19

4) En este ejemplo vamos a crear una entidad “Rol”. En package seleccione

“co.edu.javeriana.clubmat.ejb”. Haga Click en Finish.

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

20

5) La entidad Rol que usted va a crear tendrá dos atributos. Id (Long) y nombrerol

(String).

Haga doble Click sobre Rol.java y reemplace todo el código generado por el siguiente:

package co.edu.javeriana.clubmat.jpa;

import java.io.Serializable;

import javax.persistence.*;

import javax.validation.constraints.Size;

@Entity

@NamedQueries({

@NamedQuery(name = "Rol.existRol", query = "SELECT

COUNT(r.nombrerol) FROM Rol r WHERE r.nombrerol = :nombrerol")})

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

21

public class Rol implements Serializable {

private static final long serialVersionUID = 1L;

@Id

@GeneratedValue(strategy = GenerationType.AUTO)

private Long id;

@Size(min = 3)

@Column(unique = true, nullable = false, length = 40)

private String nombrerol;

public Rol() { }

public Rol( String rol ) {

this.nombrerol = rol;

}

public Long getId() {

return id;

}

public void setId(Long id) {

this.id = id;

}

public String getNombrerol() {

return nombrerol;

}

public void setNombrerol(String nombrerol) {

this.nombrerol = nombrerol;

}

@Override

public String toString() {

return "JPA.Rol[ id=" + id + " nombrerol=" + nombrerol + " ]";

}

}

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

22

6) Para la creación del EJB debe crear un nuevo paquete llamado

“co.edu.javeriana.clubmat.ejb”. Use el método enseñado anteriormente. (Ver sección

3.3.3 Creando un proyecto Java EE 6 con una entidad y un EJB en Netbeans)

7) Haga Clickk derecho sobre el modulo web de su proyecto >> “New” >> “Other…” >>

“Enterprise JavaBeans” >> “Sessions Beans for Entity Classes”. Haga Click en Next.

8) Haga Click en “Add all” y luego en “Next”. En la siguiente ventana en Package

seleccione “co.edu.javeriana.clubmat.ejb” y haga Click en Finish.

9) Se generan dos archivos, un AbstractFacade.java y un RolFacade.java.

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

23

En RolFacade es donde usted implementará los métodos de negocio para la entidad

Rol. AbstractFacade es una clase abstracta que tiene métodos genéricos para soportar

operaciones CRUD (crear, eliminar, buscar, etc.) para todas las entidades.

10) Agregue estos dos métodos:

existeRol: Método al cual se le envía el nombre de un rol y dice si este existe

en el sistema por medio de un booleano.

crearRol: Método al cual se le envía el nombre de un rol, lo crea y confirma

que la operación fue exitosa. Si el rol ya existe en el sistema, retorna una

cadena advirtiendo que ya existe.

11) Edite RolFacade.java y copie y pegue los siguientes dos métodos:

public Boolean existeRol( String rol )

{

Query q = em.createNamedQuery( "Rol.existRol" );

q.setParameter( "nombrerol", rol );

Long exist = ( Long ) q.getSingleResult( );

if( exist > 0 )

return true;

return false;

}

public String crearRol( String rol )

{

if( existeRol( rol ) )

return "El rol ya existe en el sistema, elija otro";

Rol r = new Rol( rol );

em.persist( r );

return "exitoso";

}

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

24

3.3.4. EXPONER EL EJB COMO UN SERVICIO WEB SOAP EN NETBEANS

1) Ahora debe exponer el EJB creado como un Servicio Web SOAP. Para ellos haga Click

derecho sobre el modulo web de la aplicación >> “New” >> “Web Service”.

2) En “Web Service Name” coloque RolWS. En paquete coloque

“co.edu.javeriana.clubmat.ws”.

Seleccione “Create Web Service from Existing Session Bean” y luego haga Click en

Browse.

3) Seleccione el EJB al que desea generarle un Servicio Web. En este caso RolFacade.

Haga Click en OK.

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

25

4) Haga Click en Finish. En el paquete WS de su proyecto debe aparecer una clase

RolWS.java la cual implementa el Servicio Web.

3.3.5. DESPLEGAR EL PROYECTO JAVA EE EN NETBEANS

1) Click derecho sobre su proyecto empresarial Java EE >> “Clean and Build”

Click derecho sobre su proyecto empresarial Java EE >> “Deploy”

Luego de estas dos acciones, se debe generar automáticamente la tabla en la base de

datos PostgreSQL.

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

26

Verifique esto con pgAdmin III.

2) Ahora debe verificar que su servicio web realmente funciona, para ello abra el modulo

web de su proyecto >> “Web Services” >> Click derecho a “RolWS” >> “Test Web

Service”

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

27

3) Se abre el navegador web con una página web llamada “RolWS Web Service Tester”.

Allí podrá usar los dos métodos que implementados: existeRol y crearRol.

Escriba “Lider” para probar el método “existeRol”.

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

28

4) Debe obtener una página web donde dice que es falso que exista el rol “Lider.

5) Ahora cree el rol “Lider” usando el método crearRol, luego verifique que existe dicho

rol con el método existeRol y obtendrá true.

La tabla “rol” de su base de datos tendrá un nuevo registro, con un id y un rol llamado

“Lider”.

3.4. CREACIÓN EN NETBEANS DE UN PROYECTO JAVAFX 2 QUE

INVOCARÁ SERVICIOS WEB

3.4.1. CREACIÓN DEL PROYECTO

1) Ahora debe crear un proyecto JavaFX 2 para que consuma el Servicio Web que

construyo. Para ello vaya a: File >> New >> JavaFX >> JavaFX FXML Application

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

29

2) Elija el nombre de proyecto que deseé.

En el campo “FXML Name” coloque el nombre que quiere colocarle a la pantalla

principal de su aplicación JavaFX2. Haga Click en Finish.

3) Netbeans genera tres archivos en su proyecto.

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

30

JavaFXApplication9.java (varía según el nombre que le haya dado al

proyecto): Esta clase es la encargada de ejecutar la aplicación. Carga el archivo

“PantallaInicial.fxml”.

PantallaInicial.fxml: Archivo en lenguaje XML que contiene la descripción

de todo diseño gráfico de la pantalla inicial.

PantallaInicialController.java: Clase que controla los elementos gráficos

descritos en el archivo “PantallaInicial.fxml”. Acá también se implementan los

métodos de negocio necesarios para la pantalla inicial.

Como puede observar se usa el Modelo Vista Controlador (MVC) para separar la

interfaz gráfica de la lógica.

3.4.2. GENERAR MÉTODOS AUXILIARES QUE INVOCAN UN SERVICIO WEB DESDE

EL PROYECTO JAVAFX 2

1) Haga Click derecho sobre su proyecto JavaFX 2 >> New >> Web Service Client

2) Seleccione “WSDL URL:” y coloque la URL del WSDL del servicio web que desea

consumir, en este caso RolWS. Haga Click en Finish.

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

31

Para obtener la URL del WSDL fácilmente, vaya al testing de RolWS y haga Click en

“WSDL File”.

3) Usted usará remotamente los métodos existeRol y crearRol que ofrece el Servicio Web.

Para ello abra “PantallaInicialController.java” y haga Click derecho en el editor >>

Insert code >> Call Web Service Operation…

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

32

4) En la ventana de Servicios Web disponibles, seleccione su proyecto JavaFX >>

RolWS >> RolWSPort >> existeRol >> OK

Realice el mismo proceso con crearRol.

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

33

Esto generará dos métodos que podrán invocar a existeRol y createRol de forma

remota.

3.4.3. CONSTRUIR LA INTERFAZ GRÁFICA USANDO JAVAFX SCENE BUILDER

1) Haga doble Click sobre el archivo “PantallaInicial.fxml”. Se abrirá JavaFX Scene

Builder así como lo muestra la siguiente ilustración:

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

34

2) Elimine el botón y el “Label” existente seleccionándolos y presionando la tecla “Supr”.

3) Amplíe el tamaño de la ventana situándose en una de las esquinas del rectángulo y

moviendo el mouse.

4) Para invocar el Servicio Web y mostrar los resultados debe agregar los siguientes

elementos gráficos:

Un “Label” con el texto “Nombre del rol:”

Un “Textfield” en donde se ingresara el nombre del rol

Un “Button” con el texto “Crear rol”

Un “Button” con el texto “Existe rol”

Un “Label” con el texto “Resultado:”

Un “Textfield” en donde se colocara el resultado obtenido luego de invocar a

los métodos.

5) Use la opción “Search” del JavaFX Scene Builder para buscar los elementos gráficos

listados en el paso anterior y arrástrelos en la ventana.

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

35

6) Luego de arrastrar y soltar debe obtener una interfaz gráfica así:

Nota: puede pre-visualizar la interfaz gráfica que está diseñando en Preview >> Show

Preview in Window.

7) A los elementos gráficos que desee manipular dinamicamente desde el controlador

debe darles un Id con nombre claro.

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

36

En este caso solo vale la pena realizar esa manipulación en los dos “Textfield”. Allí es

donde usted va a hacer una lectura y escritura de información.

Para esto, debe hacer Click sobre cada “Textfield” y usar la herramienta “Inspector”

para buscar la propiedad “id”.

En la propiedad “fx:id” coloque el nombre que deseé para cada elemento. El

“Textfield” donde se ingresa el nombre del rol llámelo “textfieldNombrerol” y el

“Textfield” donde muestra el resultado llámelo “textfieldResultado”.

8) Los dos botones disparan eventos. Para especificar la reacción a eventos debe hacer

Click en cada botón y buscar “action” usando la herramienta Inspector.

En la propiedad “On Action”, nombre “crearRol” al evento de hacer Click en el botón

“Crear Rol”. El evento del otro botón identifíquelo como “existeRol”.

Vaya a File >> Save.

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

37

3.4.4. INYECCIÓN DE ELEMENTOS GRÁFICOS DE JAVAFX SCENE BUILDER E

INVOCACIÓN DEL SERVICIO WEB COMO REACCIÓN A EVENTOS

1) Ahora necesita inyectar los elementos gráficos que desea manipular en la clase

controladora. Esto se hace con la anotación @FXML.

Abra “PantallaInicialController.java” y remplacé:

@FXML

private Label label;

Por:

@FXML

private TextField textfieldNombrerol;

@FXML

private TextField textfieldResultado;

2) También necesita inyectar los eventos que nombro en JavaFX Scene Builder, indicando

la invocación del Servicio Web como reacción a cada evento:

Reemplace:

@FXML

private void handleButtonAction(ActionEvent event) {

System.out.println("You Clickked me!");

label.setText("Hello World!");

}

Por:

@FXML

private void crearRol(ActionEvent event) {

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

38

String resultado = crearRol( this.textfieldNombrerol.getText(

) );

this.textfieldResultado.setText( resultado );

}

@FXML

private void existeRol(ActionEvent event) {

Boolean resultado = existeRol( this.textfieldNombrerol.getText(

) );

if( resultado )

this.textfieldResultado.setText( "El rol existe en el

sistema" );

else this.textfieldResultado.setText( "El rol no existe en el

sistema" );

}

3) Haga Click derecho sobre su proyecto JavaFX >> Clean and Build.

Haga Click derecho sobre su proyecto JavaFX >> Run

Pruebe la aplicación con diversos datos:

.

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

39

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

40

3.4.5. INVOCACIÓN DE LA APLICACIÓN JAVAFX 2 A TRAVÉS DEL NAVEGADOR

WEB

Para que la aplicación JavaFX 2 construida pueda ser ejecutada en el navegador web debe

realizar los siguientes pasos:

1) Vaya a la carpeta de su proyecto JavaFX 2, dentro de ella hay una carpeta llamada

“dist”. Cópiela.

2) Vaya a la carpeta de su proyecto empresarial Java EE y luego a la carpeta del módulo

web de su proyecto. Dentro de esta última hay una carpeta llamada “web”. Ábrala.

3) Pegue la carpeta “dist” en la carpeta “web”.

4) Abra la carpeta “dist” que acabo de copiar en la carpeta “web”. Allí encontrará un único

archivo html. A ese archivo debe cambiarle el nombre a index.

5) Click derecho sobre su proyecto empresarial Java EE >> “Clean and Build”

Click derecho sobre su proyecto empresarial Java EE >> “Deploy”

Click derecho sobre su proyecto empresarial Java EE >> “Run”

6) Se le abre el navegador web con una página que dice “Hello World!” Esa página web

corresponde al index.jsp que se encuentra en la carpeta “web” del módulo web de su

proyecto.

7) En la barra de direcciones, conserve la dirección que se encuentra y añádale la palabra

dist. Se le debe abrir una página web en donde sale cargándose una aplicación javaFX.

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

41

8) Diga que acepta los riesgos y que desea ejecutar la aplicación.

Pruebe la aplicación con diversos datos.

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

42

4. PONER EN EJECUCIÓN LA APLICACIÓN WEB

CLUBMAT DESDE NETBEANS

Para ejecutar la aplicación web CLUBMAT desde la IDE Netbeans 7.3 realice los siguientes

pasos:

4.1. CREACIÓN DE BASE DE DATOS EN POSTGRESQL

1) Abra el cliente de PostgreSQL ejecutando la aplicación pgAdmin III que se encuentra

en el directorio donde se instaló el motor de base de datos.

2) Haga doble Click sobre el servidor “PostgreSQL 9.2”, allí la aplicación le pedirá una

contraseña, ingrese la contraseña que estableció en el proceso de instalación de

PostgreSQL.

3) Vaya a “Bases de Datos” >> “postgres”

En la barra de herramientas haga Click en “Ejecutar consultas SQL arbitrarias.”

4) En el editor copie y pegue el siguiente Script:

CREATE USER clubmat LOGIN

NOSUPERUSER INHERIT CREATEDB NOCREATEROLE

ENCRYPTED PASSWORD 'clubmat';

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

43

Ejecute el Script haciendo Click en “Ejecutar consulta”.

5) Para crear la base de datos vaya a “Ejecutar consultas SQL arbitrarias” y copie y pegue

el siguiente script:

CREATE DATABASE gestorclubesm

WITH OWNER = clubmat

ENCODING = 'UTF8';

Ejecute el Script haciendo Click en “Ejecutar consulta”.

6) Compruebe que la base de datos que acabo de crear salga listada como existente.

En algunos casos pgAdmin III se demora en listar una base de datos recién creada.

Espere un momento, haga Clickk en “Bases de Datos” y ejecute la opción refrescar

hasta que salga listada la base de datos.

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

44

4.2. EJECUCION DE CLUBMAT DESDE LA IDE NETBEANS

1) Abra la IDE Netbeans 7.3 y vaya a: File >> Open Project… Seleccione el proyecto

empresarial CLUBMAT >> Click en Open Project.

Nota: el proyecto empresarial CLUBMAT se encuentra en el archivo

[CLUBMAT]ICodigo.zip disponible en la página web del presente proyecto. Debe

descomprimirlo en su disco duro y obtendrá una carpeta “CLUBMAT”. Esa carpeta es

un proyecto que puede abrir con la IDE Netbeans.

2) Es posible que cuando abra el módulo web del proyecto empresarial CLUBMAT tenga

errores de advertencia acerca del “Data Source”.

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

45

Soluciónelo haciendo Clickk derecho sobre “CLUBMAT-war” >> “Resolver Data

Source Problem…”. Seleccione “clubmatpool” y luego haga Clickk en “Add

Connection…”.

Realice el “Test Conecction” con los datos por defecto. Netbeans debe indicarle que la

conexión fue exitosa con el aviso “Connection Succeeded”. Después haga Clickk en

Next y seleccione el esquema “public”. Haga Clickk en Finish.

3) Click derecho sobre el módulo web CLUBMAT-war >> “Clean and Build”

Click derecho sobre el módulo web CLUBMAT-war >> “Deploy”

4) Click derecho sobre el proyecto empresarial CLUBMAT >> “Clean and Build”

Click derecho sobre el proyecto empresarial CLUBMAT >> “Deploy”

Luego de estas dos acciones, se deben generar las tablas en la base de datos

gestorclubesm de PostgreSQL.

Verifique esto con pgAdmin III.

1) En pgAdmin III elija la base de datos “gestorclubesm” y ejecute el script que está en

el archivo Inserts_datosminimos.sql (carpeta [CLUBMAT]Instalación) usando la

opción "consultas SQL arbitrarias":

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

46

Nota: Si desea que la aplicación web CLUBMAT inicie con más datos, pero todos ellos

ficticios, no ejecute el anterior script. Vaya a la carpeta [CLUBMAT]Instalación, abra

el archivo Inserts_datosficticios.sql y ejecute todo el script en “consultas SQL

arbitrarias”.

Esto le ayudará a observar mejor la funcionalidad de la aplicación web cuando la

ejecute.

5) Click derecho sobre el proyecto empresarial CLUBMAT >> “Run”.

Se le debe abrir el navegador web desplegándole la aplicación web: CLUBMAT.

6) Al ser la interfaz gráfica de la aplicación web construida con la tecnología JavaFX 2,

debe aceptar los riesgos para ejecutar la aplicación y hacer Click en ejecutar.

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

47

7) Ingrese como nombre de usuario: “admin” y contraseña: “admin”. El sistema le dirá

que realizó login correctamente y que tiene rol de Lider.

Ya puede empezar a usar todas las acciones implementadas en CLUBMAT.

Nota: Vea el manual de usuario para conocer las opciones ofrecidas por el sistema.

8) Si desea editar la capa de presentación de la aplicación web CLUBMAT debe abrir el

proyecto CLUBMATClient. Cuando lo abra importe la librería javafx-dialogs-0.0.3.jar

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

48

5. GESTIÓN DE VENTANAS CON JAVAFX 2

La gestión de ventanas en JavaFX 2 consiste en tener una estrategia fácil y clara que permita

navegar de una pantalla a otra, usando el modelo vista controlador generado por la herramienta

JavaFX Scene Builder. El ir de una pantalla a otra, devolverse, actualizarla o mantenerla

desactualizada se convierte en un problema complejo en el framework JavaFX 2.

Para ello fue necesario usar un framework gratuito escrito por la Ingeniera Angela Caicedo,

buscando simplificar este problema. [5]

Angela Caicedo es una “Java Evangelist” de Oracle, especialista en sistemas Java

empresariales. Tiene amplia experiencia en: Java ME, Java SE, Java EE y JavaFX. Participo

en varias conferencias de JavaOne.

COMO SE USÓ EL FRAMEWORK DE PANTALLAS EN LA APLICACIÓN

WEB CLUBMAT

Para utilizar el framework de pantallas en la aplicación web CLUBMAT, fue necesario seguir

paso a paso el manual del mismo, publicado en el blog de la ingeniera Ángela Caicedo en:

https://blogs.oracle.com/acaicedo/entry/manejando_multiples_pantallas_en_javafx.

También fue necesario ayudarse con un video tutorial sobre este framework, también realizado

por la ingeniera Ángela Caicedo en la URL:

http://www.youtube.com/watch?v=5GsdaZWDcdY.

En la clase Club_MatematicasClient.java, la cual ejecuta la aplicación web CLUBMAT, fue

necesario usar cadenas constantes estáticas. De esta manera las constantes pudieron ser

accedidas por cualquier otra clase del proyecto JavaFX 2: CLUBMATClient.

Por cada pantalla de la aplicación web CLUBMAT se declararon dos cadenas constantes, una

con el nombre de la pantalla y otra con el nombre de la vista FXML de esa pantalla.

En el siguiente código Java de la clase Club_MatematicasClient.java, puede observar cómo,

por cada pantalla, fue necesario declarar dos cadenas constantes:

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

49

En cada clase controladora de una pantalla se realizó una implementación de una interface

llamada ControlledScreen. ControlledScreen es una interface que hace parte del framework de

pantallas.

De igual forma, por cada clase controladora fue necesario declarar un atributo myController de

tipo ScreensController. ScreensController es una clase que hace parte del framework de

pantallas.

Como en cada clase controladora se implementó la interfaz ControlledScreen, fue necesario

implementar el método setScreenParent en cada una de ellas, de la siguiente manera:

El atributo myController es el que ayuda a realizar la navegación entre todas las pantallas,

haciendo uso de las constantes declaradas en la clase Club_MatematicasClient.java y de ciertos

métodos.

Por ejemplo, para ir desde la pantalla de listar roles hacia la pantalla de editar roles es necesario

el siguiente código:

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

50

Como puede observar se hace siempre uso del atributo myController. Con el puede usar los

métodos:

unloadScreen: destruye la pantalla que se le pase por parámetro.

loadScreen: carga una pantalla. Se le debe enviar el nombre de la pantalla y el archivo

FXML de la pantalla, por medio de las constantes.

setScreen: hace visible una pantalla. Se le debe enviar el nombre de la pantalla por

medio de la constante indicada.

Es importante decir que al usar loadScreen se refresca o se construye una pantalla, llamando al

método Initialize de la misma. El método Initialize se encuentra en cada clase controladora.

Si no se destruye una pantalla, esta continua activa en segundo plano, con el mismo estado que

tenía ante de ir a otra pantalla.

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

51

6. MANEJO DE DIALOGOS CON JAVAFX 2

En algunas aplicaciones se necesitan ventanas flotantes (popups) con los cuales se pueda

interactuar con el usuario de una manera sencilla, informándole de algo o para recoger datos

sin necesidad de usar una nueva pantalla.

En Java usando el framework Swing existía la clase JOptionPane, la cual permitía usar diálogos

flotantes. Una clase similar no existe en el framework JavaFX 2.

Para solucionar este problema se usó la librería javafx-dialogs-0.0.3.jar, descargable desde la

URL: https://github.com/marcojakob/javafx-ui-sandbox/tree/master/javafx-dialogs/dist

Esta librería permite usar diálogos flotantes por medio de la clase Dialogs, la cual contiene

métodos estáticos que se pueden acceder desde cualquier otra clase.

En la aplicación web CLUBMAT, los diálogos flotantes se usaron para informar errores o para

confirmar operaciones como la acción eliminar de un CRUD.

Por ejemplo, para iniciar sesión en la aplicación web se debe ingresar un nombre de usuario y

contraseña válidos. El siguiente código de la clase InicioController.java le informa al usuario

que no ingreso el usuario.

Para poder usar la clase Dialogs es necesario hacer un import en la clase controladora como el

siguiente:

import javafx.scene.control.Dialogs;

El resultado gráfico es el siguiente:

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

52

Si desea leer más sobre esta librería y sus distintas funcionalidades vaya a la URL:

http://edu.makery.ch/blog/2012/10/30/javafx-2-dialogs/

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

53

7. ESQUEMA DE DESARROLLO DE UN CRUD EN JAVAFX

2

A continuación se explicara cual fue la organización y el esquema seguido para crear un CRUD

para la aplicación CLUBMAT: Gestión de clubes de matemáticas.

Para facilitar ese objetivo, por favor siga los siguientes pasos:

7.1. ESTRUCTURA DE LOS PROYECTOS QUE COMPONEN LA APLICACIÓN

WEB CLUBMAT

1) Abra la IDE Netbeans 7.3 y vaya a: File >> Open Project… Seleccione el proyecto

empresarial CLUBMAT >> Click en Open Project.

Nota: el proyecto empresarial CLUBMAT se encuentra publicado en la página web del

presente proyecto. Debe descomprimirlo en su disco duro y obtendrá una carpeta

“CLUBMAT”. Esa carpeta es un proyecto que puede abrir con la IDE Netbeans.

2) Para que pueda observar la implementación del módulo web vaya a: CLUBMAT >>

Java EE Modules >> Doble Click en “CLUBMAT-war.war”.

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

54

3) Netbeans le mostrara el modulo web de la aplicación web CLUBMAT.

Vaya a CLUBMAT-war >> Source packages. Despliegue cada uno de los paquetes.

Paquete co.edu.javeriana.clubmat.ejb: Aquí se encuentran todos los EJBs

generados a partir de las entidades JPA.

Paquete co.edu.javeriana.clubmat.jpa: Aquí se encuentran todas las Entidades de

persistencia implementadas. Escritas manualmente.

co.edu.javeriana.clubmat.tipo: Aquí se encuentran las enumeraciones usada en este

proyecto.

Paquete co.edu.javeriana.clubmat.ws: Aquí se encuentran las clases que

implementan los Servicios Web SOAP. Son generadas a partir de los EJB.

4) Ahora debe abrir el proyecto JavaFX 2 construido para CLUBMAT.

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

55

Vaya a File >> Open Project… >> CLUBMATClient >> Click en Open Project.

Nota: El proyecto CLUBMATClient se encuentra en el archivo

[CLUBMAT]ICodigo.zip disponible en la página web del presente proyecto.

5) Importe la librería javafx-dialogs-0.0.3.jar al proyecto CLUBMATClient

6) Vaya a CLUBMATClient >> Source Packages

Como puede observar por cada CRUD se creó un paquete.

7) Despliegue el paquete “co.edu.javeriana.clubmat.ScreensManager”:

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

56

Como puede observar el paquete “co.edu.javeriana.clubmat.ScreensManager”

contiene todos los archivos .fxml que componen la vista de las pantallas de la

aplicación web CLUBMAT.

Los archivos .fxml que inician con el verbo “Crear” corresponden al diseño de pantallas

de la acción crear de algún CRUD.

En algunos CRUD se usó una misma pantalla para las acciones: ver y editar, las dos a

la vez. Un ejemplo de este caso es “VerEditarInstitucion.fxml”

8) Despliegue los paquetes CRUDClub y CRUDInstituion:

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

57

Para crear un CRUD en JavaFX 2 es necesario crear mínimo tres clases controladores,

cada una de ellas controla una vista .fxml, ubicada en el paquete ScreensManager.

Esto quiere decir que por cada CRUD se deben diseñar mínimo tres vistas. Por ejemplo,

en el caso del CRUD de clubes se diseñaron tres vistas, las cuales fueron las siguientes:

CrearClub.fxml: Vista para la acción de crear un nuevo club.

ListarClub.fxml: Vista para la acción de ver todos los clubes por medio de una

tabla.

VerEditarClub.fxml: Vista para las acciones de ver y editar un club.

Como puede observar por cada vista siempre hay una clase controladora, la relación es

uno a uno en todos los casos.

7.2. PASOS GENERALES PARA CREAR UN CRUD EN JAVAFX 2

9) Cree una vista FXML vacía para la acción de Listar (Click derecho sobre

CLUBMATClient >> New >> Empty FXML…)

10) Siempre debe usar una clase controladora por cada FXML que cree.

11) La clase controladora para la acción “Listar” de un CRUD es la más compleja, pues

requiere usar múltiples atributos gráficos para manejar la tabla.

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

58

Como puede observar por cada atributo de una entidad se debe usar un “TableColumn”.

Igualmente, por cada CRUD siempre existirán cuatro botones. Con ellos el usuario

podrá realizar las operaciones: ver, editar, eliminar o registrar.

ObservableList es una estructura grafica que ayuda a manejar todas las entidades

desplegadas en una tabla.

Finalmente, es necesario crear un POJO por cada CRUD, es decir una clase que mapea

uno a uno los atributos de una entidad y los relaciona con cada una de las columnas de

la tabla.

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

59

Por ejemplo, el POJO para la entidad Rol tiene el siguiente aspecto:

Nota: para dominar la interfaz gráfica de la acción listar de un CRUD y su respectiva

clase controladora, es recomendable que examine detenidamente el código del presente

proyecto, realizando pruebas hasta que logre entender como es su funcionamiento.

12) Después de terminar la acción “Listar” de un CRUD, realice las acciones “Ver” y

“Editar”, las cuales son dos operaciones diseñadas en una sola pantalla. Es decir, se usa

un solo .fxml y una sola clase controladora en estos casos.

Para entender cómo realizar las acciones “Ver” y “Editar” examine a profundidad los

archivos: VerEditarClub.fxml y VerEditarClubController.java.

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

60

13) Realice la acción “Crear” de su CRUD. Examine los archivos: CrearClub.fxml y

CrearClubController.java a profundidad para entender cómo construir esta acción.

Después de terminar la operación “Crear” habrá terminado satisfactoriamente la

construcción de su CRUD.

14) Para que un CRUD diseñado en el framework JavaFX 2 logre conectarse con

componentes de la plataforma Java EE 6, deben usarse Servicios Web SOAP.

En cada clase controladora de un CRUD debe llamar remotamente los métodos de

negocio implementados en un EJB que necesite.

Por ejemplo en la clase controladora para la pantalla de editar un Rol, solo debe llamar

una operación de Servicio Web: editRol. Esto se realiza por medio de la herramienta

“Call Web Service Operation” de Netbeans. Vea la sección 3.4.2 Generar métodos

auxiliares que invocan Un Servicio Web desde el proyecto JavaFX 2

Pontificia Universidad Javeriana Manual de mantenimiento –CLUBMAT

61

8. REFERENCIAS Y BIBLIOGRAFÍA

[1] Oracle Corporation, “The Java EE 6 Tutorial”, 2013. [En línea]. Available:

http://docs.oracle.com/javaee/6/tutorial/doc/javaeetutorial6.pdf

[2] Weaver, Weiqi Gao, Stephen Chin, “Pro JavaFX 2: A Definitive Guide to Rich

Clients with Java Technology”.2012.

[3] J.M. Calvo, "Web 2.0: ¿algún avance tecnológico o sólo Web Social?" [En línea].

Available: http://www.acis.org.co/fileadmin/Revista_116/Cinco.pdf

[4] The PostgreSQL Global Development Group, "PostgreSQL 9.2.4

Documentation", 2013. [En línea]. Available:

http://www.postgresql.org/files/documentation/pdf/9.2/postgresql-9.2-US.pdf

[5] A. Caidedo, “Manejando Multiples Pantallas en JavaFX (Parte I)”, 2013. [En

línea]. Available:

https://blogs.oracle.com/acaicedo/entry/manejando_multiples_pantallas_en_javafx