Está en la página 1de 175

UNIVERSIDAD PRIVADA TELESUP

1
UNIVERSIDAD PRIVADA TELESUP
Prefacio:
La asignatura es de carácter teórico-práctico. Tiene como fin desarrollar en el
estudiante habilidades para el análisis y la aplicación de diferentes herramientas y
lenguajes en tecnologías multimedia y realidad virtual.
Realidad virtual es una ciencia basada en el empleo de ordenadores y otros
dispositivos, cuyo fin es producir una apariencia de realidad que permita al usuario
tener la sensación de estar presente en ella.
Tecnología multimedia y realidad virtual es un término
que se aplica a cualquier objeto que usa
simultáneamente diferentes formas de contenido
informativo como texto, sonido, imágenes, animación y
video para informar o entretener al usuario.

Puede dividirse en dos categorías principales: multimedia lineal: Ej. una película de
cine. Multimedia no lineal. Ej. videojuegos o en el e-learning. Las presentaciones
multimedia pueden verse en un escenario, proyectarse, transmitirse, o reproducirse
localmente en un dispositivo por medio de un reproductor multimedia. Los juegos y
simulaciones multimedia pueden usarse en ambientes físicos con efectos especiales,
con varios usuarios conectados en red, o localmente con un computador sin acceso
a una red.

Comprende Cuatro Unidades de Aprendizaje:

Unidad I: Sistemas Multimedia y Realidad Virtual.


Unidad II: Java 2D Y Java 3D.
Unidad III: VRML.
Unidad IV: VRML (Continuación)

2
UNIVERSIDAD PRIVADA TELESUP

Estructura de los Contenidos

Sistemas Multimedia Java 2D y VRML


VRML
Y Realidad Virtual Java 3D (Continuación)

Conceptos básicos. Introducción a Introducción a El color de los


java 2D VRML. objetos.

Canvas y graphics.
Video y sonido Construcción de Utilización de
con java. formas de texto. rejillas de
elevación.
Creación de juegos
en MIDP. Java 3D. Nodos de 2
agrupación.
Utilización de
niebla.
Graficos vectoriales Clases y
con JME. Aplicaciones Más nodos.
en Java 3D.
Mundos
Virtuales en 3D.

La competencia que el estudiante debe lograr al final de la asignatura es:

“Desarrollar, fortalecer y perfeccionar sus habilidades en las diferentes


metodologías usadas en el análisis de sistemas con tecnología multimedia y
realidad virtual en tiempo real, a través de actividades donde aplique diversas
técnicas y estrategias que le permitan resolver problemas en el campo
laboral”.

3
UNIVERSIDAD PRIVADA TELESUP
Índice del Contenido
I. PREFACIO 02
II. DESARROLLO DE LOS CONTENIDOS 03 - 174
UNIDAD DE APRENDIZAJE 1: SISTEMAS MULTIMEDIA Y REALIDAD VIRTUAL 05-54
1. Introducción 06
a. Presentación y contextualización 06
b. Competencia 06
c. Capacidades 06
d. Actitudes 06
e. Ideas básicas y contenido 06
2. Desarrollo de los temas 07-50
a. Tema 01: Conceptos Básicos. 07
b. Tema 02: Canvas y Graphics. 22
c. Tema 03: Creación de Juegos en MIDP. 28
d. Tema 04: Gráficos Vectoriales con JME. 42
3. Lecturas recomendadas 51
4. Actividades 51
5. Autoevaluación 52
6. Resumen 54
UNIDAD DE APRENDIZAJE 2: JAVA 2D Y JAVA 3D 55-93
1. Introducción 56
a. Presentación y contextualización 56
b. Competencia 56
c. Capacidades 56
d. Actitudes 56
e. Ideas básicas y contenido 56
2. Desarrollo de los temas 57-89
a. Tema 01: Introducción a Java 2D. 57
b. Tema 02: Video y Sonido con Java. 65
c. Tema 03: Java 3D. 72
d. Tema 04: Clases y Aplicaciones en Java 3D. 81
3. Lecturas recomendadas 90
4. Actividades 90
5. Autoevaluación 91
6. Resumen 93
UNIDAD DE APRENDIZAJE 3: VRML 94-123
1. Introducción 95
a. Presentación y contextualización 95
b. Competencia 95
c. Capacidades 95
d. Actitudes 95
e. Ideas básicas y contenido 95
2. Desarrollo de los temas 96-119
a. Tema 01: Introducción a VRML. 96
b. Tema 02: Construcción de Formas de Texto. 103
c. Tema 03: Nodos de Agrupación. 108
d. Tema 04: Más Nodos. 116
3. Lecturas recomendadas 120
4. Actividades 120
5. Autoevaluación 121
6. Resumen 123
UNIDAD DE APRENDIZAJE 4: VRML (CONTINUACIÓN) 124-171
1. Introducción 125
a. Presentación y contextualización 125
b. Competencia 125
c. Capacidades 125
d. Actitudes 125
e. Ideas básicas y contenido 125
2. Desarrollo de los temas 126-167
a. Tema 01: El Color de los Objetos. 126
b. Tema 02: Utilización de Rejillas de Elevación. 137
c. Tema 03: Utilización de Niebla. 148
d. Tema 04: Mundos Virtuales en 3D. 157
3. Lecturas recomendadas 168
4. Actividades 168
5. Autoevaluación 169
6. Resumen 171
III. GLOSARIO 172
IV. FUENTES DE INFORMACIÓN 173
V. SOLUCIONARIO 174

4
UNIVERSIDAD PRIVADA TELESUP

5
UNIVERSIDAD PRIVADA TELESUP
Introducción
a) Presentación y contextualización:
Multimedia es la combinación o utilización de dos o más medios de forma
concurrente. El término multimedia está relacionado gráficos interactivos,
imágenes en movimiento, secuencias de audio y vídeo, las imágenes en tres
dimensiones, la composición de documentos digitales y la realidad virtual. En
principio, la cualidad multimedia no está restringida a la informática: un libro
acompañado de un DVD o CD ROM de audio es una obra multimedia, sin
embargo, poco a poco, el término multimedia se ha ido generalizando para
referirse a la informática y al mundo digital.

b) Competencia:
Reconoce las características de un entorno multimedia y de realidad virtual.

c) Capacidades:

1. Conoce los principales elementos y los sistemas multimedia de realidad virtual.


2. Identifica las distintas herramientas para realizar trabajos con canvas y
graphics.
3. Describe el proceso de elaboración de los juegos educativos usando MIDP
4. Emplea adecuadamente los gráficos vectoriales con JVM en diferentes
aplicaciones pertinentes

d) Actitudes:

✓ Muestra interés por los diversos diseños multimedia.


✓ Posee habilidad creativa para la creación de diversos juegos en MIDP.

e) Presentación de ideas básicas y contenidos esenciales de la unidad:

La Unidad de Aprendizaje 01: Sistemas Multimedia y Realidad Virtual,


comprende el desarrollo de los siguientes temas:

TEMA 01: Conceptos Básicos.


TEMA 02: Canvas y Graphics.
TEMA 03: Creación de Juegos en MIDP.
TEMA 04: Gráficos Vectoriales con JME.

6
UNIVERSIDAD PRIVADA TELESUP

TEMA 1
Conceptos
Básicos

Competencia:
Conocer los principales elementos y los
sistemas multimedia de realidad virtual.

7
UNIVERSIDAD PRIVADA TELESUP
Desarrollo de los Temas

Tema 01: Conceptos Básicos

Conceptos Multimedia:
Es todo aquello que utiliza conjunta y simultáneamente
diversos medios de comunicación en la presentación de la
información, como imágenes, animación, vídeos, sonido y
texto. Básicamente, multimedia es la cualidad de un
sistema o documento que utiliza más de un
medio de comunicación al mismo tiempo.

Concepto Realidad Virtual:


Serie de tecnologías que pretenden reproducir la realidad mediante la utilización de
computadoras. Por lo general un computador genera una imagen falsa que el usuario
contempla a través de un casco equipado con un visor especial, teniendo así la
impresión de estar presente en la escena reproducida por el computador. Actualmente
en una etapa más sofisticada los equipos de realidad virtual se completan con guantes
y trajes equipados con sensores, que permiten «percibir» los «estímulos» y
«sensaciones» generados por el computador. En
definitiva, el usuario percibe como real algo que no lo es.

Historia de la multimedia
En el año 1984, se produce el lanzamiento del primer
computador con amplias capacidades de reproducción de sonidos tales como el de un
radio AM y se desarrollaron programas que se conocen como ambiente WINDOWS,
este primer gran paso para la Multimedia fue la Apple Computer de Macintosh. El
ambiente interactivo inició su desarrollo con las nuevas tecnologías de la
comunicación y la información, muy concretamente, en el ámbito de los juegos de
video. A partir de 1987 se comenzó con juegos de video operados por monedas y
software de computadoras de entretenimiento.

8
UNIVERSIDAD PRIVADA TELESUP

En Noviembre de 1988 la Philips hace una propuesta a través del CD-I Green Book,
para desarrollar una serie de publicaciones sobre productos y diseños interactivos en
torno al CD-I con aplicaciones en museos, la industria química y farmacéutica, la
universidad o la calle. La tecnología de multimedia toma auge en los video-juegos, a
partir de 1992, cuando se integran: audio (música, sonido estéreo y voz), video,
gráficas, animación y texto al mismo tiempo.

La principal idea multimedia desarrollada en los videos


juegos es: que se pueda navegar y buscar la información
que se desea sobre un tema, sin tener que recorrer todo el
programa, que se pueda interactuar con la computadora y
que la información no sea lineal sino asociativa. En enero de
1992, durante la feria CES (Consumer Electronics Show) de Las Vegas, se anunció el
CD multiusos. Un multiplayer interactivo capaz de reproducir sonido, animación,
fotografía y video, por medio de la computadora o por vía óptica, en la pantalla de
televisión.

HISTORIA DE LA REALIDAD VIRTUAL


La realidad virtual comenzó a finales de los 70’s como
material para una clase de aviación en el departamento
de defensa de los Estados Unidos. En 1982 Scott Fisher
considerado uno de los “Padres Fundadores”; de la realidad
virtual y en 1985 él creo el VISIOCASO más avanzado en la Nasa Ames Center, Por
todas partes empiezan a surgir equipos de desarrollo trabajando en lo que era la
tecnología de la realidad virtual, y se empiezan a ver los primeros resultados
comerciales. 1982: Thomas Zimmerman patenta un Electroguante que invento
mientras investigaba sobre cómo controlar con la mano un instrumento musical virtual.
1987: La compañía Inglesa Dimensión Internacional desarrolla un Software de
construcción de mundos tridimensionales sobre P.C. 1988: Scott Foster inventa un
dispositivo para la generación de sonido tridimensional.

9
UNIVERSIDAD PRIVADA TELESUP

1989: ATARI saca al mercado la primera máquina de galería de vídeo juegos con
tecnología 3D. En ese mismo año Autodesk presenta su primer sistema de realidad
virtual para P.C. A partir de aquí entramos de lleno a la carrera comercial los sistemas
de realidad virtual comienzan a popularizarse y muchos productos empiezan a invadir
el mercado, en forma paralela se crea un cierto movimiento cultural conocido como el
Cyberpunk. La estética y la temática del cyberpunk han llegado en los últimos años a
la televisión y al cine, quizás los mejores ejemplos son “El hombre del jardín”; y ”Blade
Runer“.

Aplicaciones de la realidad virtual


El objetivo de la Realidad Virtual es crear
una experiencia que haga sentir al usuario
que se encuentra inmerso en un mundo
virtual, aparentemente real; para ello, se
sirve de gráficos 3D así como del sonido
que envuelve las escenas mostradas. La
RV es una tecnología que puede ser aplicada en cualquier campo, como la educación,
medicina, entretenimiento, turismo, construcción, mercadeo, etc. Telerobótica: consiste
en el manejo de robots a distancia, pero con la salvedad de que el operador ve lo que
el robot está viendo e incluso tiene el tacto de la máquina. La Realidad Virtual también
se utiliza para tratar sistemas que no pueden ser manejados en el mundo real. Por
ejemplo, simulaciones de enfrentamientos bélicos, o simuladores de vuelo.

• La construcción de edificios. La realidad virtual permite el diseño del interior y


exterior de una vivienda antes de construirla, de forma que el cliente pueda
participar en el mismo realizando una visita virtual de la vivienda que se va a
construir. En la medicina, además de facilitar la manipulación de órganos internos
del cuerpo en intervenciones quirúrgicas, la RV permite, la creación, para los
estudiantes de medicina, de pacientes virtuales que adolecen de diversas
enfermedades y presentan los síntomas característicos para poner en práctica las
habilidades terapéuticas del futuro médico. En el tratamiento de fobias también se
ha comprobado la utilidad de los sistemas de realidad virtual, donde el paciente

10
UNIVERSIDAD PRIVADA TELESUP

tiene el control de la “realidad”; y puede ir manejando su experiencia dentro de la


misma.
• Dentro de lo más actual en RV Tenemos este juego SIMS = SIMS 3. Por otro lado
tenemos ejemplos como Second Life Second Life, Es un mundo virtual lanzado en
el año 2003, desarrollado por Linden Research. y que ha tenido una creciente
aceptación desde el año 2006 Los residentes interactúan a través de los avatars,
que son personajes en 3D completamente configurables, lo que le da a los
usuarios, la capacidad de convertirse en otra persona y gozar de una segunda
vida. Esto permite que los residentes de SL puedan explorar el mundo, conocer a
otras personas, socializarse, participar en actividades grupales de acuerdo a sus
gustos, entre otras cosas.

Aplicaciones de multimedia:
Multimedia estimula los ojos, oídos, yemas de los dedos y, lo más importante, la
cabeza. Se compone, como ya se describió, de combinaciones entrelazadas de
elementos de texto, arte gráfico, sonido, animación y vídeo.

✓ En las empresas: multimedia incluye presentaciones, capacitaciones,


mercadotecnia, publicidad, demostración de productos, bases de datos,
catálogos, comunicaciones en red, correo de voz y vídeo conferencia. Permite
agregar por ejemplo clips de audio y vídeo a las presentaciones de
“diapositivas”; pantalla por pantalla (slide shows ) de gráficas y textos.

✓ Multimedia en la Educación: la Multimedia es interactiva y nos trae la libertad


de explotar lo desconocido con conexiones rápidas entre tópicos relacionados.
Es esta interactividad, que junto con elementos dinámicos como video y
música, hace que Multimedia sea una herramienta ejemplar de enseñanza
especialmente para niños, como Multimedia es similar a TV y a los juegos de
video que se han enraizado en la cultura juvenil. Por estos motivos
entrenamiento y enseñanza son citados como ideales para aplicaciones de
Multimedia.

11
UNIVERSIDAD PRIVADA TELESUP

✓ Multimedia en Lugares Públicos: En hoteles, estaciones de trenes, centros


comerciales, museos y tiendas multimedia estará disponible en terminales
independientes o quioscos para proporcionar información y ayuda. Estas
instalaciones reducen la demanda tradicional de personal y puestos de
información, agregan valor y pueden trabajar las 24 horas, aun a medianoche,
cuando la ayuda humana está fuera de servicio.
✓ Equipos de Multimedia: monitores, scanner, programas como photoshops,
CD-ROM, DVD, Aceleradores, discos, memorias, pizarras digitales, etc.

Ventajas de la realidad Virtual:


Arquitectura. Medicina. La virtualidad agiliza los procesos. Entrenamiento pilotos
(NASA) Aprender a manipular objetos Beneficios para personas con ciertas
minusvalías. Visualización en 360º. Fortalece el proceso de enseñanza – aprendizaje.
Se incrementa la tendencia de utilizar de manera permanente estos sistemas. Motivan
y Facilitan el Trabajo colaborativo. Herramienta poderosa para el estudio y modelaje
de procesos y fenómenos de dimensión espacial, útil para urbanistas, arquitectos,
especialistas de las Geociencias y el medio ambiente, entre otros.

Desventajas de la realidad virtual


• Complejidad de los desarrollos Costes elevados en la
realización de mundos virtuales Deficiencias en el
interfaz entre programas y usuarios. Desorientación
espacial. Dificultad en dominar los mandos y controles
Áreas como los displays, la velocidad de reacción de
los sistemas y la interacción.
• Abuso o Uso Inadecuado. La mayoría de los equipos para que funcionen,
dependen de la energía eléctrica. Requiere un amplio conocimiento.
• Actualmente los costos de estos equipos son altos, pero la tendencia es que
cada día bajen los precios y aumente la calidad. Como todo equipo que

12
UNIVERSIDAD PRIVADA TELESUP

funciona con energía eléctrica, requiere de cuidados especiales, ya que


algunos de ellos son frágiles.

¿Hacia dónde vamos?


El futuro de la multimedia tiende hacia la Realidad Virtual, puesto que de lo que se
trata es de acercarnos cada vez más a la realidad. Esta aglutinación de
comunicaciones y aplicaciones con sonidos, vídeo, gráficos, imágenes fijas, texto,
hipertexto, etc., ha surgido por la posibilidad de usar un computador, siendo éste un
sistema capaz de manejar cualquier tipo de datos digitalizados, de forma que se trata
todo ese tipo de medios de la misma forma. Esto suscitará cambios importantes en
áreas como:

1. El procesado de señales digitales: compresión, filtrado, representación


gráfica, etc.
2. Interfaces de usuario: pantallas táctiles, sensores, etc.
3. Equipos hardware: computadores cada vez más potentes, sistemas de
almacenamiento de gran capacidad, etc.
4. Redes de comunicaciones: ancho de banda
cada vez más elevado, adaptable a los
distintos flujos de información.

En áreas como la historia, paleontología, química, física la


posibilidad de aprovechamiento es enorme. Podríamos
desde visitar virtualmente sin movernos de nuestro
asiento ciudades ya desaparecidas como Pompeya o
Atenas, Technotitlán etc. Dentro del campo de la
educación y de la ciencia en gral. Será una herramienta
tal vez indispensable en los años por venir. Podemos
imaginar cómo será el aula este próximo siglo: nuestro asiento en el aula podrá ser
nuestra propia sala o una propia terminal dentro de un campus universitario.

13
UNIVERSIDAD PRIVADA TELESUP

Complementada con un par de lentes o cascos con audífonos integrados, así como un
par de guantes especiales y traje ajustado de cuerpo completo.

No cabe duda que la electrónica y las nuevas herramientas con las que cuenta la
computación harán en el próximo siglo un mundo con más esperanza, más humano,
ya que el acceso al conocimiento sería más fácil y rápido y por ende una educación
personalizada, eficiente, clara, efectiva y dinámica.

Introducción a J2ME: es un subconjunto de la


plataforma Java preparado para desarrollar
aplicaciones para dispositivos móviles con
escasos recursos (memoria, pantalla, dispositivos de
entrada, etc) como lo son teléfonos celulares, PDAs,
beepers, etc. Basa su arquitectura en una máquina virtual (JVM) cuya implementación
es dependiente del proveedor del dispositivo, sin embargo esta debe cumplir con el
estándar básico. Con esto Java intenta extender su premisa “write it once, run it
everywhere” a los dispositivos móviles. Sin embargo debido a las posibles variaciones
entre los distintos proveedores esta premisa no siempre se cumple con precisión. En
comparación con J2SE, el desarrollo de aplicaciones móviles se encuentra seriamente
restringido debido a las limitaciones de recursos de los dispositivos objetivos.

Con respecto a los dispositivos específicos donde se ejecutarán las


aplicaciones, el API de J2ME se encuentra dividido en
configuraciones (familias horizontales de dispositivos): CDC y
CLDC. Sobre estas se apoyan los perfiles (familias verticales de
dispositivos): MIDP, los cuales amplían el alcance de su
implementación. Más adelante se profundizará el conocimiento de
estos términos. La plataforma J2ME se construye a partir de la
unión de múltiples especificaciones cuya gran mayoría pasan a través del Java
Community Process (JCP), programa que recibe las solicitudes como Java

14
UNIVERSIDAD PRIVADA TELESUP

Specification Requests (JSR) y las analiza para posteriormente descartarlas o


implementarlas según sean sus conclusiones.

ESTRUCTURA DE UNA APLICACIÓN JAVA – MIIDLET


Midlets:
Midlet es un programa en lenguaje de programación Java para dispositivos embebidos
(se dedican a una sola actividad), más específicamente para la máquina virtual Java
MicroEdition (Java ME). Generalmente son juegos y aplicaciones
que corren en un teléfono móvil. Está desarrollada bajo la
especificación MIDP (perfil para información de dispositivo móvil).

Descarga de MIDlets:
Los dispositivos deben proporcionar mecanismos mediante los
cuales podamos encontrar los MIDlets que deseemos descargar.
• En algunos casos, descargamos los MIDlets a través de un navegador WAP o
a través de una aplicación residente escrita específicamente para identificar
MIDlets.
• Otros mecanismos como Bluetooth, cable serie, etc, pueden ser soportados por
el dispositivo.
• El programa encargado de manejar la descarga y ciclo de vida de los MIDlets
en el dispositivo se llama Gestor de Aplicaciones o AMS (Application
Management Software).

MIDP
Mobile Information Device profile o MIDP (JSR 118) es una
versión de J2ME (Java 2 Micro Edition) integrada en el
hardware de celulares relativamente modernos que permite el

15
UNIVERSIDAD PRIVADA TELESUP

uso de programas java denominados MIDlets, tales como


juegos, aplicaciones o todo tipo de software.

MIDP Y MIDLETS
Un dispositivo que posea la especificación MIDP debe ser capaz de:
• Localizar archivos JAD vinculados a un MIDlet en la red.
• Descargar el MIDlet y el archivo JAD al dispositivo desde un servidor usando el
protocolo HTTP 1.1 u otro que posea su funcionalidad.
• Enviar el nombre de usuario y contraseña cuando se produzca una respuesta
HTTP por parte del servidor 401 (Unauthorized) o 407 (Proxy Authentication
Required).
• Instalar el MIDlet en el dispositivo.
• Ejecutar MIDlets.
• Permitir al usuario borrar MIDlets instalados.

Localización de aplicaciones
El descubrimiento de una aplicación es el proceso por el cual un usuario a través de su
dispositivo localiza un MIDlet.
• El usuario debe ser capaz de ver la descripción del MIDlet a través de un
enlace que, una vez seleccionado, inicializa la instalación del MIDlet.
• Si éste enlace se refiere a un archivo JAR, el archivo y su URL son enviados al
AMS del dispositivo para empezar el proceso de instalación.

Instalación de MIDlets
La instalación de la aplicación es el proceso por el cual el
MIDlet es descargado al dispositivo y puede ser utilizado por el
usuario.
• Cuando existan múltiples MIDlets en la aplicación que
deseamos descargar, el usuario debe ser avisado de que existen más de uno.

16
UNIVERSIDAD PRIVADA TELESUP

• Durante la instalación, el usuario debe ser informado del progreso de ésta y se


le debe de dar la oportunidad de cancelarla.
• La interrupción de la instalación debe dejar al dispositivo con el mismo estado
que cuando se inició ésta.

Actualización de MIDLETS
La actualización se realiza cuando instalamos un MIDlet sobre un dispositivo que ya
contenía una versión anterior de éste.
• El dispositivo debe ser capaz de informar al usuario cual es la versión de la
aplicación que tiene instalada.
• Cuando comienza la actualización, el dispositivo debe informar si la versión
que va a instalar es más nueva, más vieja o la misma de la ya instalada y debe
obtener verificación por parte del usuario antes de continuar con el proceso.
• En cualquier caso, un MIDlet que no posea firma no debe de reemplazar de
ninguna manera a otro que sí la tenga.

Estados de un MIDLET

La interfaz de usuario de alto nivel


J2ME se sustenta en dos APIs, por un lado CLDC que hereda algunas de las clases
de J2SE, y MIDP que añade nuevas clases que nos permitirán crear interfaces de

17
UNIVERSIDAD PRIVADA TELESUP

usuario. Las clases que nos ofrece CLDC, son las más importantes de los siguientes
paquetes de J2SE:
• java.lang
• java.util
• java.io

Además cuenta con el “Generic Conection Framework” que ofrece posibilidades de


conexión y comunicación. Por su parte la API MIDP también hereda de J2SE las
clases:
• Timer
• TimerTask
• Además MIDP añade los siguientes paquetes:
• javax.microedition.midlet
• javax.microedition.lcdui
• javax.microedition.io
• javax.microedition.rms

El paquete javax.microedition.midlet, es el más importante de todos. Sólo contiene una


clase: la clase MIDlet, que nos ofrece un marco de ejecución para nuestras
aplicaciones sobre dispositivos móviles. El paquete javax.microedition.lcdui nos ofrece
una serie de clases e interfaces de utilidad para crear interfaces de usuario. Es algo
así como un pequeño entorno gráfico similar al AWT, pero, evidentemente, mucho
más limitado.

Básicamente, nos permite dos tipos de entorno, por un lado podremos trabajar con
‘Screens’ sobre las que podremos colocar elementos de la interfaz de usuario, como
textos, menus, etc., por otro, podremos basar nuestras aplicaciones en ‘Canvas’ sobre
las que podemos trabajar a nivel gráfico, es decir, a más bajo nivel. Tanto Screen
como Canvas son objetos que heredan de la clase ‘Displayable’.

La clase Alert

18
UNIVERSIDAD PRIVADA TELESUP

public class Alert extends Screen


El objeto Alert representa una pantalla de aviso. Normalmente se usa cuando
queremos avisar al usuario de una situación especial como, por ejemplo, un error. Un
Alert está formado por un título, texto e imágenes si queremos. Vamos a ver cómo
crear una pantalla de alerta.

Para ello contamos con dos constructores:


Alert(String titulo) Alert(String titulo, String textoalerta, Image imagen, AlertType tipo)
Además podemos definir el tiempo que queremos que el aviso permanezca en
pantalla, diferenciando de esta manera dos tipos de Alert:
1. Modal: La pantalla de aviso permanece un tiempo indeterminado hasta que es
cancelada por el usuario. Esto lo conseguimos invocando al método
Alert.setTimeOut(Alert.FOREVER).
2. No Modal: La pantalla de aviso permanece un tiempo definido por nosotros. Para
ello indicaremos el tiempo en el método setTimeOut(tiempo). Una vez finalizado
el tiempo, la pantalla de aviso se eliminará de pantalla y aparecerá el objeto
Displayable que nosotros definamos.

Podemos elegir el tipo de alerta que vamos a mostrar. Cada tipo de alerta tiene
asociado un sonido.

Es posible ejecutar el sonido sin tener que crear un objeto Alert, invocando al método
playSound(Display) de la clase AlertType, por ejemplo:
AlertType.CONFIRMATION.playSound(display)

19
UNIVERSIDAD PRIVADA TELESUP

En el siguiente ejemplo vamos a ver los dos tipos de alerta: modal y no modal. Vamos
a crear un objeto Form donde insertaremos dos comandos. Cada uno de ellos activará
una pantalla de alerta.

El código de nuestro ejemplo aparece a continuación.


import javax.microedition.midlet.*;
import javax.microedition.lcdui.*;
public class EjemploAlerta extends MIDlet implements CommandListener
{
Alert alerta1,alerta2;
Command salir, aler1, aler2;
Displayable temp;
Display pantalla;
Form pantallainicial;
public EjemploAlerta()
{

// Obtengo la referencia a la pantalla del MIDlet


pantalla = Display.getDisplay(this);
// Creo los objetos que forman las pantallas del MIDlet
salir = new Command("Salir",Command.EXIT,1);
aler1 = new Command("Alerta Modal",Command.SCREEN,1);
aler2 = new Command("Alerta No Modal",Command.SCREEN,1);
// Creo la pantalla de alerta 1
alerta1 = new Alert("Alerta Modal","Esta alerta desaparecerá"+
"cuando pulses el botón de aceptar", null, AlertType.INFO);
// Creo la pantalla de alerta 2

alerta2 = new Alert("Alerta No Modal","Esta alerta desaparecera"+


" cuando pasen 5 segundos”,null,AlertType.INFO);
alerta1.setTimeout(Alert.FOREVER);

20
UNIVERSIDAD PRIVADA TELESUP

alerta2.setTimeout(5000);
// Creo la pantalla principal del MIDlet
pantallainicial = new Form(“Programa principal”);
// Inserto objetos en la pantalla
pantallainicial.addCommand(salir);

pantallainicial.addCommand(aler1);
pantallainicial.addCommand(aler2);
pantallainicial.setCommandListener(this);
}
public void startApp()
{
pantalla.setCurrent(pantallainicial);
}

public void pauseApp() { }


public void destroyApp(boolean unconditional)
{
public void commandAction(Command c, Displayable d)
{
if (c == salir)
{
destroyApp(false);
notifyDestroyed();
}
else if (c == aler1) {
pantalla.setCurrent(alerta1,pantallainicial);
//Método sobrecargado de
}
// la clase Display. Primero muestra un objeto del else {
//tipo Alert y a continuación un Displayable.
Pantalla.setCurrent(alerta2,pantallainicial);
}
}
}

21
UNIVERSIDAD PRIVADA TELESUP

Canvas TEMA 2
y
Graphics

Competencia:
Identificar las distintas herramientas para
realizar trabajos con canvas y graphics.

22
UNIVERSIDAD PRIVADA TELESUP

Tema 02: Canvas y Graphics

Interfaz de programación de aplicaciones (IPA) o API es el conjunto de funciones y


procedimientos (o métodos, en la programación orientada a objetos) que ofrece cierta
biblioteca para ser utilizado por otro software como una capa de abstracción. Son
usadas generalmente en las bibliotecas.
Canvas (lienzo en inglés) es un elemento HTML incorporado en HTML5 que permite la
generación de gráficos dinámicamente por medio del scripting. Permite generar
gráficos estáticos y animaciones.

LA INTERFAZ DE USUARIO DE BAJO NIVEL


Todas las pantallas que vayamos a crear usando las APIs de bajo nivel heredan de la
clase Canvas. Por esta razón, lo primero de todo es
conocer a fondo esta clase y luego iremos
profundizando en cada uno de los elementos que la
componen. La clase Canvas es la superclase de todas
las pantallas que usan las APIs de bajo nivel, al igual
que Screen lo era para las pantallas que usaban las
APIs de alto nivel.

No existe ningún impedimento que nos permita usar en


el mismo MIDlet pantallas tanto derivadas de Canvas

23
UNIVERSIDAD PRIVADA TELESUP

como de Screen. Por ejemplo, en la aplicación Hogar, las pantallas de cada dispositivo
podrían haberse creado usando las APIs de bajo nivel, con lo que habríamos
conseguido un aspecto mucho más llamativo, mientras que el menú principal podría
haber seguido siendo un objeto List. La clase Canvas permite manejar eventos de bajo
nivel y dibujar cualquier cosa por pantalla. Por esta razón se usa como base para la
realización de juegos.

Esta clase posee un método abstracto paint() que debemos implementar


obligatoriamente y es el que se encarga de dibujar en la pantalla del dispositivo MID.
En el siguiente ejemplo podemos ver como sería el programa HolaMundo creado en
una pantalla derivada de Canvas En la primera parte de este punto veremos los
mecanismos que proporciona la clase Canvas para manejar los eventos de bajo nivel,
lo que nos permitirá detectar pulsaciones de teclas o eventos del puntero (si el MID
posee este mecanismo). Posteriormente estudiaremos el funcionamiento del método
paint() y de la clase Graphics lo que nos permitirá manejar gráficos en nuestras
aplicaciones.

Eventos de bajo nivel


Los eventos dentro de la clase Canvas podemos manejarlos principalmente de dos
formas distintas:
• A través de Commands como hemos visto en el ejemplo anterior. Este sistema
es el que hemos utilizado hasta el momento, por lo que su funcionamiento es
sobradamente conocido.
• A través de códigos de teclas. Este método es el que Canvas proporciona para
detectar eventos de bajo nivel. Estos códigos son valores numéricos que están
asociados a las diferentes teclas de un MID. Estos códigos se corresponden
con las teclas de un teclado convencional de un teléfono móvil (0-9,*,#). La
clase Canvas proporciona estos códigos a través de constantes que tienen
asociados valores enteros.

24
UNIVERSIDAD PRIVADA TELESUP

Con estos códigos anteriores ya podemos conocer cuál es la tecla que ha pulsado el
usuario. Canvas, además proporciona unos métodos que permitirán manejar estos
eventos con facilidad. La implementación de estos métodos es vacía, por lo que es
misión nuestra implementar los que necesitemos en nuestra aplicación de acuerdo con
el propósito de ésta. Los métodos para el manejo de códigos de teclas aparecen en la
Tabla

El perfil MIDP nos permite detectar eventos producidos por dispositivos equipados con
algún tipo de puntero como un ratón o una pantalla táctil. Para ello, nos proporciona un
conjunto de métodos cuya implementación es vacía. Estos métodos en particular,
detectan las tres acciones básicas que aparecen en la Tabla

25
UNIVERSIDAD PRIVADA TELESUP

El igual que hacíamos con los eventos de teclado, es nuestro deber implementar estos
métodos si queremos que nuestro MIDlet detecte este tipo de eventos.
Para saber si el dispositivo MID está equipado con algún tipo de puntero podemos
hacer uso de los métodos de la Tabla.

Manipulación de elementos en una pantalla Canvas


La API de bajo nivel tiene dos funciones principalmente: controlar los eventos de bajo
nivel tal y como hemos visto en el apartado anterior y controlar qué aparece en la
pantalla del dispositivo MID. En este punto veremos los métodos que nos proporciona
Canvas para manipular elementos en pantalla y especialmente la clase Graphics.
Antes de empezar a ver éstos métodos vamos a conocer cuál es el mecanismo que
usa la clase Canvas para dibujar por pantalla.

El método paint()
La clase Canvas posee un método abstracto paint(Graphics g) que se ocupa de
dibujar el contenido de la pantalla. Para ello, se usa un objeto de la clase Graphics que
es el que contiene las herramientas gráficas necesarias y que se pasa como
parámetro al método paint().

26
UNIVERSIDAD PRIVADA TELESUP

Cuando vayamos a implementar este método tendremos que tener en cuenta lo


siguiente:
• El método paint() nunca debe ser llamado desde el programa. El gestor de
aplicaciones es el que se encarga de realizar la llamada a éste método cuando
sea necesario.
• Cuando deseemos que se redibuje la pantalla actual debido a alguna acción
en concreto del usuario o como parte de alguna animación, deberemos realizar
una llamada al método repaint(). Al igual que ocurre con los eventos de
teclado, la petición se encolará y será servida cuando retornen todas las
peticiones anteriores a ella.
• La implementación del MID no se encarga de limpiar la pantalla antes de cada
llamada al método paint(). Por esta razón, éste método debe pintar cada pixel
de la pantalla para, de esta forma, evitar que se vean porciones no deseadas
de pantallas anteriores.

Hemos dicho que el gestor de aplicaciones se encarga de invocar al


método paint() cuando sea necesario. Esta llamada la realiza
normalmente cuando se pone la pantalla Canvas como pantalla
activa a través del método de la clase Display setCurrent(Canvas)
o después de invocar al método showNotify(). Hemos de tener en
cuenta que una pantalla Canvas no posee la capacidad por sí
misma de restaurar su estado en caso de que el AMS interrumpa la ejecución normal
de la aplicación para, por ejemplo, avisar de una llamada entrante.

Para resolver este inconveniente, Canvas nos proporciona


dos métodos cuya implementación es vacía: hideNotify() y
showNotify(). El primero de ellos es llamado justo antes de interrumpir a la aplicación y

27
UNIVERSIDAD PRIVADA TELESUP

borrar la pantalla actual. En él podríamos incluir el código necesario para salvar el


estado actual de la pantalla, variables, etc, y así posteriormente poder restaurar
correctamente la aplicación. El método showNotify() es invocado por el gestor de
aplicaciones justo antes de devolver éste el control a la aplicación. En él podemos
insertar el código necesario para restaurar correctamente la pantalla de la aplicación.

Creación de
TEMA 3
Juegos en
MIDP

Competencia:

Describir el proceso de elaboración de los


juegos educativos usando MIDP.

28
UNIVERSIDAD PRIVADA TELESUP

Tema 03: Creación de Juegos en MIDP

CONCEPTOS BÁSICOS PARA LA CREACIÓN DE JUEGOS EN MIDP


Desde hace unos años, la mayoría de los teléfonos móviles traen incorporados
algunos que otro juego, la mayoría de ellos bastante simples y, por supuesto en blanco
y negro. Dado el ‘boom’ tecnológico que ha dado la telefonía móvil en estos últimos
años, podemos encontrar actualmente en el mercado teléfonos con pantalla a color de
tamaño considerable, teléfonos que soportan GPRS, etc.

Con este panorama no es de extrañar que los teléfonos móviles se conviertan en


dispositivos de ocio, además de simples dispositivos de comunicación. No podemos
terminar este punto sin dejar un hueco para explicar las facilidades que nos
proporciona MIDP para la creación de juegos.

Eventos de teclado para juegos


Los eventos de bajo nivel son controlados en las pantallas Canvas a través de
códigos. MIDP nos proporciona además de los códigos genéricos de teclado, un
conjunto de constantes que se refieren a acciones específicas de un juego. Cada una
de estas constantes está definida según la Tabla 5.21.

29
UNIVERSIDAD PRIVADA TELESUP

Dependiendo del dispositivo, cada uno de los códigos anteriores puede estar asignado
a una tecla diferente. Pueden existir dispositivos MID que tengan botones especiales
que hagan la función de movimiento y disparo: UP, DOWN, LEFT, RIGHT y FIRE, o
puede que estas acciones estén asociadas a los botones 2, 8, 4, 6 y 5
respectivamente. En cualquier caso, el programador no tiene por qué conocer a que
tecla específica está asociada una acción en concreto, lo que nos facilita bastante el
trabajo.

MIDP nos proporciona algunos métodos que nos permiten realizar conversiones entre
los códigos generales de teclado (keyCodes) y los códigos de juegos (ver Tabla 5.22).

Los métodos proporcionados por Canvas para controlar los eventos de bajo nivel
keyPressed(int keyCode), keyRepeated(int keyCode) y keyReleased(int keyCode)
trabajan con códigos genéricos de teclado (keyCodes). Para poder trabajar con
códigos de juegos tenemos que usar el método getGameAction(int keyCode) dentro de
cada uno de los métodos anteriores:

30
UNIVERSIDAD PRIVADA TELESUP

Como crear un JAR


Al comprimir un programa en un jar normalmente habría que crearlo y ejecutarlo de
ésta forma:
Creacion de jar:
jar -cf archivo.jar archivo1.class archivo2.class archivo3.class
Ejecutar un jar:
jar -cf archivo.jar direccion_del_class_con_main/Main.class

Muchas personas hacen uso de programas al no


poder crear un jar ejecutable por sí mismos sin saber
que es muy sencillo hacerlo con la misma librería de
java. La forma más sencilla de crear el jar ejecutable
es modificando el manifest para no tener que
especificar la clase main cada vez que queremos
ejecutarlo Para crear el jar, antes hay que crear el
archivo temp.mf con las siguientes líneas que se van a adjuntar en el manifest

Main-Class: Clase_main_sin_extension
Sealed: true
Luego en consola:
jar cmf temp.mf MiEjecutable.jar archivo1.class
archivo2.class

31
UNIVERSIDAD PRIVADA TELESUP

Se permiten comodines (para incluir todos los class de la carpeta o que cumplan con
alguna condición dada):
jar cmf temp.mf MiEjecutable.jar archivo$.class
o
jar cmf temp.mf MiEjecutable.jar *.class
Para ejecutarlo desde consola:
java -jar MiEjecutable.jar

Como crear un JAD


Primero descomprimimos el archivo jar y vemos dentro una carpeta que se llama
META-INF y entro de esa carpeta un archivo que se llama manifest.mf, pues bien ese
mismo ficherito manifest.mf lo copiamos y lo renombramos con el mismo nombre del
archivo jar pero con extensión jad. Me explico mejor si el archivo jar se llama por
ejemplo sudoku.jar este archivo lo renombramos a sudoku.jad y a continuación ya
podemos copiar los dos archivos al telefono, "sudoku.jar y sudoku.jad"

El procedimiento básico es crear una aplicación con


la tecnología J2ME CLDC, la cual generará dos
archivos: un JAR (la aplicación como tal en java) y un
JAD (es un archivo de configuración). En algunos
teléfonos basta con copiar estos dos archivos en una
memoria para luego instalarlos haciendo click en
ellos. Pero no todo es tan fácil. En un BlackBerry no
se puede, al menos no en todos los modelos. La solución propuesta aquí es subir los
archivos JAD y JAR a un hosting con PHP para crear luego un script PHP que permita
descargar estos archivos con su tipo MIME correcto. Por defecto en algunos
Blackberries, el tipo mime que este asume no es el correcto, por tanto el script PHP se
encargará de decirle a la BlackBerry que use el tipo Mime correcto.

32
UNIVERSIDAD PRIVADA TELESUP

En el teléfono primero se descarga el archivo


JAD, quien contiene toda la información, el
icono y la clase Java a usar, y muy importante:
el archivo jar (uno o varios) a descargar. El
teléfono usa la información del JAD para
descargar el archivo JAR, y procede luego a
instalarlo. Por tanto en este documento veremos
todas las etapas de esta configuración

Archivos .JAR
Los MIDlets son empaquetados en carpetas .JAR junto a imágenes, logos, para formar
una MIDlet suite.
✓ Cada archivo .JAR lleva asociado un archivo .JAD (Java Application Descriptor,
Descriptor de Aplicación Java) que es utilizado para gestionar la instalación.
✓ El archivo .JAM (Java Application Manager, Manejador de Aplicaciones Java)
es el encargado de gestionar la descarga y la instalación de los MIDlets.

JAVA ME: DISPOSITIVOS LIMITADOS


d

33
UNIVERSIDAD PRIVADA TELESUP

MIDlet: CICLO DE VIDA


El ciclo de vida de un MIDlet pasa por 5 fases: descubrimiento, instalación, ejecución,
actualización y borrado.

34
UNIVERSIDAD PRIVADA TELESUP

MIDlet: CREACIÓN

MIDlet: PUBLICACIÓN

35
UNIVERSIDAD PRIVADA TELESUP

INSTALAR MIDlet
Para poder instalar un MIDlet en un teléfono celular del cliente se siguen los siguientes
pasos:
✓ Paso 1: El Cliente pide una el archivo JAD.
✓ Paso 2: El archivo JAD es descargado al Cliente.
✓ Paso 3: El JAM verifica el archivo JAD.
✓ Paso 4: Se descarga la MIDlet suite al Cliente.

Programa “Hello World”


corriendo en el simulador
del J2ME con el “DefaultColorPhone”.

MIDlet: DESCARGA E INSTALACIÓN


• Descarga:
✓ Gestionado por el Application Management System (AMS).
✓ El dispositivo obtiene el MIDlet de alguna fuente, a través:

36
UNIVERSIDAD PRIVADA TELESUP

✓ Red inalámbrica, puerto USB, IrDA, Bluetooth, etc..


• Se establece una negociación sobre capacidades del dispositivo según los
requisitos del MIDlet, coste...:
✓ El resultado de esta negociación puede provocar que no se realice una
descarga efectiva.
• Se descarga el MIDlet a la memoria del dispositivo:
✓ Primero se descarga el descriptor (JAD).
✓ Después se descarga el paquetes (JAR).
✓ Instalación:
✓ Gestionado por el AMS.

• Puede comprobar que el MIDlet no vulnera las políticas de seguridad del móvil.
• Puede transformar (convertir) el MIDlet de formato “público” a un formato específico
del dispositivo.
• Se extrae la aplicación del paquete (JAR) y se deja en disposición de ser
ejecutada.

MIDlet: EJECUCIÓN
El usuario selecciona el MIDlet y lo ejecuta, en este momento, el MIDlet entra en la
VM y se invocan los métodos que gestionan su ciclo de vida:
✓ Paused: Iniciado y a la espera.
✓ Active: Tiene recursos ejecutando.
✓ Destroyed: Ha liberado recursos, destruido hilos y terminado toda su actividad.

37
UNIVERSIDAD PRIVADA TELESUP

MIDlet: ACTUALIZACIÓN Y BORRADO


Actualización:
• Puede publicarse una nueva versión del MIDlet.
• AMS debe gestionar la lista de MIDlets instalados y sus versiones.
• Puede así actualizar de versiones más antiguas a más recientes del MIDlet.
• Los atributos del MIDlet, incluida la versión, están:
• En el descriptor del MIDlet (JAD).
• En el manifiesto del MIDlet contenido en el JAR.

Borrado:
A través del AMS puede borrarse un MIDlet cuando no va a utilizarse más.
Se borra:
• MIDlet.
• Todos los registros en memoria permanente escritos por ese MIDlet.

MIDlet SUITE:
• Conjunto de MIDlets contenidas en un mismo .JAR. +
• El archivo .JAR cumple el formato estándar.
• Incluye los archivos de clases y otros recursos asociados al MIDlet, por
ejemplo imágenes.
• Normalmente aunque sólo se incluya un MIDlet se trabaja con MIDlet Suite.
• Los MIDlets en un MIDlet Suite comparten recursos:
• Contenidos en el JAR.
• RMS creados por los otros MIDlets del mismo MIDlet Suite.

MIDlet: MANIFIESTO
• El manifiesto (manifest.mf) está incluido en el JAR y contiene información
sobre los contenidos del archivo JAR.
• Archivo de texto con la estructura: atributo:valor

38
UNIVERSIDAD PRIVADA TELESUP

MIDlet: DESCRIPTOR
• Archivo de extensión .JAD y que permite al AMS comprobar si el MIDlet es
adecuado para descargarlo.
• Sigue el mismo formato que un manifiesto

MIDlet: javax.microedition.midlet.MIDlet
• Clase abstracta base para todos los MIDlets:
–protected MIDlet()
• Constructor para crear un MIDlet, sin argumentos.
–protected abstract void startApp() throws MIDletStateChangeException
• Se le llama cuando el MIDlet comienza (paused -> active state)
–protected abstract void pauseApp()

39
UNIVERSIDAD PRIVADA TELESUP

• Se le llama cuando el MIDlet pausa (active -> paused state)


–protected abstract void destroyApp(boolean unconditional)throws
MIDletStateChangeException
• Se le llama cuando el MIDlet se destruye (-> destroyed state)
–public final void notifyDestroyed()
• Comunica al AMS que el MIDlet ha limpiado la memoria y ha terminado.
–public final void notifyPaused()
• Comunica al AMS que el MIDlet está en pausa.
–public final String getAppProperty(String key)
• Se le llama para obtener las propiedades del MIDlet.

MIDlet: ¡Hola Mundo!


import javax.microedition.midlet.MIDlet;
import javax.microedition.lcdui.*;
public class HelloWorld extends MIDlet implements CommandListener {
private Display display;
private TextBox mainScreen;
private Command exit;
public HelloWorld() {
mainScreen = new TextBox(“Saludo”,“Hola alumnos APMOV”,512,0);
exit = new Command(“Exit”, Command.EXIT, 1);

MIDlet: ¡Hola Mundo!


public void startApp() {
mainScreen.addCommand(exit);
mainScreen.setCommandListener(this);
display = Display.getDisplay(this);
display.setCurrent(mainScreen);
}
public void pauseApp() {
}
public void destroyApp (boolean unconditional) {
}
public void commandAction(Command c, Displayable s) {
if (c == exit) {
display.setCurrent(null);
destroyApp(false);
notifyDestroyed();
}
}
}

40
UNIVERSIDAD PRIVADA TELESUP

Archivo .JAD
MIDlet-Name: HelloWorld
MIDlet-Vendor: UC3M_APMOV
MIDlet-Version: 1.0
MIDlet-Jar-Size: 1204
MIDlet-Jar-URL: HelloWorld.jar
MIDlet-1: HelloWorld, HelloWorld.png, HelloWorld
MicroEdition-Configuration: CLDC-1.1
MicroEdition-Profile: MIDP-2.0

MANIFIESTO
MIDlet-Name: HelloWorld
MIDlet-Vendor: UC3M_APMOV
MIDlet-Version: 1.0
MIDlet-1: HelloWorld, HelloWorld.png, HelloWorld
MicroEdition-Configuration: CLDC-1.1
MicroEdition-Profile: MIDP-2.0

JAVA VERIFIED™
Si queremos que nuestras aplicaciones las utilicen terceros es importante pasar por un
proceso de verificación, si es una aplicación Java ME será el Java Verified™.
–Importante si queremos darla de alta en las tiendas de aplicaciones más populares.

Si se concluye exitosamente el proceso de verificación, la aplicación estará firmada y


se podrá publicitar con el logo Java Powered.

41
UNIVERSIDAD PRIVADA TELESUP

Java Verified™: Tests


Los test se dividen en categorías:
✓ Application Characteristics (AC)
✓ Stability (ST)
✓ Application Launch (AL).
✓ User Interface (UI)
✓ Localization (LO)

Gráficos TEMA 4
Vectoriales
con JME
Competencia:
Emplear adecuadamente los gráficos
vectoriales con JVM en diferentes
aplicaciones pertinentes

42
UNIVERSIDAD PRIVADA TELESUP

Tema 04: Gráficos Vectoriales con JME

PUBLIC CLASS GRAPHICS


Hemos visto que cuando invocamos al método paint (Graphics g) tenemos que pasarle
como parámetro un objeto Graphics. Este objeto nos proporciona la capacidad de
dibujar en una pantalla Canvas.

Un objeto Graphics lo podemos obtener sólo de dos maneras:


• Dentro del método paint() de la clase Canvas. Aquí podemos usar el objeto
Graphics para pintar en la pantalla del dispositivo.
• A través de una imagen usando el siguiente código:
Image imgtemp = Image.createImage(ancho,alto);
Graphics g = imgtemp.getGraphics();
La clase Graphics posee multitud de métodos que nos permitirán
seleccionar colores, dibujar texto, figuras geométricas, etc. En
los siguientes puntos vamos a ver cada uno de estos métodos
según su función.

Sistema de coordenadas
Vamos a comenzar a partir de este punto a explicar las
nociones necesarias para poder dibujar en la pantalla de

43
UNIVERSIDAD PRIVADA TELESUP

un MID. Dado que la clase Graphics nos va a proporcionar bastantes recursos para
dibujar en una pantalla Canvas, hemos de comprender como se organiza esta pantalla
en base a los pixeles, ya que al programar en bajo nivel hemos de trabajar a nivel de
pixel. La clase Canvas nos proporciona los métodos necesarios para obtener el ancho
y el alto de la pantalla a través de getWidth() y getHeight() respectivamente. Una
posición en la pantalla estará definida por dos coordenadas x e y que definirán el
desplazamiento lateral y vertical, siendo la posición (0,0) el pixel situado en la esquina
superior izquierda. Incrementando los valores de x e y, nos moveremos hacia la
derecha y hacia abajo respectivamente.

Es posible cambiar el origen de coordenadas de la pantalla mediante el método de la


clase Graphics translate (int x, int y). Éste método cambia el origen de coordenadas al
punto definido por los parámetros x e y provocando un desplazamiento de todos los
objetos en pantalla. Piénsese en lo útil que resulta este método para provocar scrolls.

Manejo de colores Ejemplo:


g.setColor(0,0,255);
g.fillRect(0,0,getWidth(), getHeight());

MANEJO DE TEXTO
La clase Font permite seleccionar el tipo de letra. Los atributos posibles son los
siguientes:

44
UNIVERSIDAD PRIVADA TELESUP

Figuras geométricas
Ya decíamos anteriormente que la clase Graphics nos proporcionaba métodos
capaces de mostrar figuras geométricas por pantalla. Estas figuras pueden ser: líneas,
rectángulos y arcos.

Líneas
Esta es la figura más simple que podemos representar. Una línea queda definida por
un punto inicial que representaremos por (x1, y1) y un punto final representado por
(x2,y2). Pues esa es toda la información que necesitamos para dibujar cualquier línea
en una pantalla Canvas, simplemente llamando a su constructor de la siguiente forma:
g.setColor(0,0,0) //Selecciono el color negro
g.drawLine(x1,y1,x2,y2) //Dibujo una línea desde (x1,y1) a (x2,y2)

45
UNIVERSIDAD PRIVADA TELESUP

El ancho de la línea dibujada será de 1 pixel. Además podremos definir si la traza de la


línea queremos que sea continua o discontinua. Esto lo realizaremos a través de los
métodos getStrokeStyle() y setStrokeStyle(int estilo) que devuelve el estilo de la línea
o lo selecciona respectivamente. Es estilo puede ser SOLID (líneas continuas) o
DOTTED (líneas discontinuas). El estilo que seleccionemos afecta también a cualquier
figura geométrica que dibujemos.

Rectángulos
Aquí se nos da la posibilidad de dibujar hasta 4 tipos diferentes de rectángulos.
1. Plano
2. Plano con color de relleno
3. Redondeado
4. Redondeado con color de relleno
Para crear cualquier tipo de rectángulo tenemos que definir cuatro parámetros.

Los dos primeros corresponden al punto inicial (x,y), y los dos últimos al ancho y alto
del rectángulo:
g.setColor(0,0,0); //Selecciono el color negro
g.drawRect(x,y,ancho,alto); //Dibujo un rectángulo
Si queremos dibujar un rectángulo con color de relleno tendremos que escribir:
g.fillRect(x,y,ancho,alto);
Cuando vayamos a construir rectángulos con las esquinas redondeadas, es necesario
definir dos parámetros más: arcWidth y arcHeight que especifican el grado de
redondez, tal y como aparece en la Figura 5.11.

46
UNIVERSIDAD PRIVADA TELESUP

La creación de un rectángulo de este tipo se realizaría de una de las siguientes


maneras:
g.drawRoundRect(x,y,ancho,alto,arcWidth,arcHeight)
g.fillRoundRect(x,y,ancho,alto,arcWidth,arcHeight)

Arcos
En este caso podemos dibujar dos tipos de arcos: Arco simple o arco con color de
relleno. Para dibujar un arco tenemos que imaginarnos que ese arco va dentro de una
“caja” (ver Figura 5.12).

Aquí podemos ver un círculo y también el cuadrado que delimita a ese círculo.
Cuándo vayamos a crear un arco tenemos que tener en mente la “caja” que lo va a
delimitar. Esto es así porque a la hora de crear un arco hemos de crear primero esa
caja, especificando los parámetros como hacíamos cuando creábamos un rectángulo,
además del ángulo inicial y ángulo total.

El ángulo inicial es desde donde empezaremos a construir el arco, siendo 0 el punto


situado a las 3 en punto, 90 el situado a las 12, 180 el situado a las 9 y 270 el situado
a las 6. El ángulo total especifica la amplitud que tendrá el arco. Si por ejemplo
construimos un arco de la siguiente manera:
g.drawArc(1,1,getWidth()-1,getHeight()-1,0,270);

47
UNIVERSIDAD PRIVADA TELESUP

ó
g.fillArc(1,1,getWidth()-1,getHeight()-1,90,290);
podemos ver el resultado en la Figura 5.13.

Ejercicio
Implementar un Midlet que permita mostrar una imagen en pantalla y moverla con el
teclado del dispositivo.

48
UNIVERSIDAD PRIVADA TELESUP

Internacionalización
Los desarrolladores de aplicaciones MIDP deben conocer las herramientas que nos
proporciona Java para emigrar programas escritos en un determinado idioma a otro
diferente. Las características lingüísticas, geográficas y culturales de un determinado
idioma son aspectos que debemos tener en cuenta al desarrollar un MIDlet. Estas
características forman lo que denominados internacionalización. En vez de este
término se usa normalmente i18n, ya que la palabra internacionalización posee 18
letras entre la i y la n. Para poder llevar a cabo este proceso, Java hace uso de los
llamados Locale que es una clase que almacena información sobre un determinado
idioma.

Aspectos a internacionalizar

49
UNIVERSIDAD PRIVADA TELESUP

La internacionalización involucra a varias partes del desarrollo del software:


• Mensajes: Aquí entra todo lo relacionado con la presentación del texto visible
al usuario. Mensajes de error, de alerta, cadenas de texto, etc.
• Formato de datos: Hay que tener en cuenta el formato de datos que usa un
determinado país. Dentro de esta área forman parte el formato de fechas,
horas, numeración y valores monetarios.
• Calendarios y zonas horarias: Hay que usar un calendario que se adecue a la
localidad donde se ejecute la aplicación.
• Aspectos relacionados con la UI de la aplicación: En este punto hay que tener
en cuenta los iconos, imágenes, colores y elementos visuales que usemos en
nuestra aplicación.

Limitaciones
Como es bien sabido, los dispositivos MID poseen
bastantes restricciones. En este caso, como en la
mayoría, solo poseemos un subconjunto de las clases
orientadas a la internacionalización que posee J2SE.
Veamos cuales son las limitaciones con las que nos
vamos a encontrar:

• En primer lugar, la plataforma MIDP no proporciona soporte para la


internacionalización de mensajes. MIDP no incluye la clase MessageFormat de
J2SE con lo que el formato de mensajes debe ser implementado por el
programador.
• Tampoco se incluye el soporte necesario para dar formato a las fechas, horas y
números ya que se han excluido las clases DateFormat, NumberFormat y
DecimalFormat.
• Tampoco se soporta ningún tipo de ordenación de cadenas. Si nuestra aplicación
necesita algún tipo de ordenación lexicográfica, ésta debe ser proporcionada por el
programador.
• Por último nos encontramos con ciertas restricciones para el soporte de
calendarios. La clase java.util.Calendar es abstracta, pero la plataforma MIDP nos
asegura al menos una implementación concreta.

50
UNIVERSIDAD PRIVADA TELESUP

Soluciones para la internacionalización


Para lograr la internacionalización de aplicaciones
basadas en MIDP 2.0 podemos poner en práctica
alguna de las siguientes aproximaciones:
✓ Uso de atributos en el archivo descriptor del
MIDlet.
✓ Uso de archivos para definir los recursos de
localización. Lecturas Recomendadas
❖ INTRODUCCIÓN A LA MULTIMEDIA Y CONCEPTOS BÁSICOS
http://dis.um.es/~jfernand/0405/tsm/tema1.pdf

❖ PROGRAMACIÓN DE JUEGOS PARA MÓVILES CON J2ME


http://web.ing.puc.cl/~iic3686/j2me/Programacion%20de%20juegos%20para%20m
oviles%20con%20J2ME.pdf

Actividades y Ejercicios

1. Elabore un juego para celulares que muestre en pantalla un


círculo y que se mueva con las teclas de dirección.
Envíalo a través de "Mobile Games".

2. Elabore una aplicación para celulares táctiles, donde un objeto


se mueva en la dirección del desplazamiento del dedo. 51
Envíalo a través de "Touch Screen".
UNIVERSIDAD PRIVADA TELESUP

Autoevaluación
1) Está relacionado con la realidad virtual:
a. Gráficos en 3D.
b. Gráficos en 5D.
c. Gráficos en 2D.
d. Gráficos en 4D.
e. Gráficos en HD..

2) Midlet es:
a. Un programa de lenguaje en VME.
b. un programa en lenguaje de programación Java.
c. Un programa en lenguaje de programación en Eclipse.
d. Un programa en lenguaje de programación en Applet
e. Un programa en lenguaje de programación en Multimedia.

3) MIDP (JSR 118) es una versión de __________________________integrada en


el hardware de celulares relativamente modernos que permite el uso de
programas java denominados MIDlets.
a. J3ME (Java 3 Micro Edition).
b. J1ME (Java 2 Micro Edition).
c. J2ME (Java 2 Micro Edition).
d. J5ME (Java 1 Micro Edition).
e. J4ME (Java 5 Micro Edition).

4) La Interfaz de programación de aplicaciones (IPA) o API es el conjunto de


funciones y procedimientos que ofrece cierta biblioteca para ser utilizado por
otro:
a. Software como una capa de abstracción.
b. Software como una capa de ilustración.

52
UNIVERSIDAD PRIVADA TELESUP

c. Software como una capa de instrucción.


d. Software como una capa de inclusión.
e. Software como una capa de clasificación.

5) En los códigos genéricos de teclado que MIDP proporciona, UP, DOWN,


LEFT, RIGHT y FIRE son:
a. 1, 2, 3, 4 y 5
b. 1, 6, 2, 5 y 8
c. 8, 2, 4, 6 y 5
d. a, d ,w, x y s
e. w, x, a ,d y s

6) El ciclo de vida de un MIDlet pasa por 5 fases:


a. Descarga, instalación, ejecución, aplicación y actualización.
b. Descarga, instalación, aplicación, actualización y borrado.
c. Descubrimiento, instalación, ejecución, actualización y borrado.
d. Instalación, ejecución, aplicación, configuración y borrado.
e. Instalación, instrucción, aplicación, actualización y descubrimiento.

7) Los MIDlets son empaquetados en:


a. Carpetas .JAM
b. Carpetas .JAV
c. Carpetas .JAS
d. Carpetas .JAR
e. Carpetas .JAD

8) Los comandos getWidth() y getHeight(), proporciona los métodos necesarios


para obtener:
a. El ancho y alto de las canvas.
b. El ancho y alto de las graficas.
c. El ancho y alto de get.
d. El ancho y alto de las carpetas.
e. El ancho y el alto de la pantalla.

9) Canvas es un elemento de:


a. APPLET.
b. JAVA.
c. PAINT.
d. HTML.

53
UNIVERSIDAD PRIVADA TELESUP

e. SCRIPT.

10) Es posible cambiar el origen de coordenadas de la pantalla mediante el


método de la clase :
a. Graphics transmission (int x, int z).
b. Graphics configuration (int x, int v).
c. Graphics picture (int x, int b).
d. Graphics colors (int x, int c).

Resumen
e. Graphics translate (int x, int y).

UNIDAD DE APRENDIZAJE I:

Sistemas multimedia son los diversos medios de comunicación en la presentación de la


información, como imágenes, animación, vídeos, sonido y texto. Serie de tecnologías
que pretenden reproducir la realidad mediante la utilización de computadoras. El
objetivo de la Realidad Virtual es crear una experiencia que haga sentir al usuario que
se encuentra inmerso en un mundo virtual, aparentemente real. La Realidad Virtual
también se utiliza para tratar sistemas que no pueden ser manejados en el mundo real.

Interfaz de programación de aplicaciones (IPA) o API es el conjunto de funciones y


procedimientos que ofrece cierta biblioteca para ser utilizado por otro software como
una capa de abstracción. Son usadas generalmente en las bibliotecas. Las Canvas es
un elemento HTML incorporado en HTML5 que permite la generación de gráficos
dinámicamente por medio del scripting. Permite generar gráficos estáticos y
animaciones. La clase Canvas posee un método abstracto paint(Graphics g) que se
ocupa de dibujar el contenido de la pantalla.

MIDP proporciona además de los códigos genéricos de teclado, un conjunto de


constantes que se refieren a acciones específicas de un juego. El ciclo de vida de un
MIDlet pasa por 5 fases: descubrimiento, instalación, ejecución, actualización y borrado.
El MIDlet entra en la máquina virtual y se invocan los métodos que gestionan su ciclo de

54
UNIVERSIDAD PRIVADA TELESUP

vida: Paused: Iniciado y a la espera, Active: Tiene recursos ejecutando y Destroyed: Ha


liberado recursos, destruido hilos y terminado toda su actividad.

El objeto Graphics proporciona la capacidad de dibujar en una pantalla Canvas. Un


objeto Graphics se puede obtener sólo de dos maneras: Del método paint() de la clase
Canvas. Aquí podemos usar el objeto Graphics para pintar en la pantalla del dispositivo,
y a través de una imagen usando el siguiente código: Image imgtemp =
Image.createImage (ancho, alto)y Graphics g = imgtemp.getGraphics(). La clase
Graphics proporciona métodos capaces de mostrar figuras geométricas por pantalla.
Estas figuras pueden ser: líneas, rectángulos y arcos.

55
UNIVERSIDAD PRIVADA TELESUP

Introducción
a) Presentación y contextualización

Los temas que se tratan en la presente unidad temática, tienen por finalidad que el
estudiante tome conocimiento del lenguaje de programación Java Las aplicaciones
de Java son generalmente compiladas a bytecode (clase Java) que puede
ejecutarse en cualquier máquina virtual Java (JVM) sin importar la arquitectura de la
computadora subyacente.

b) Competencia
Describe las aplicaciones en Java 2D y Java 3D en los diferentes contextos
profesionales.

c) Capacidades

1. Conoce la sintaxis de Java 2D y sus aplicaciones respectivas.


2. Describe las aplicaciones con sonido y video usando Java 2D.
3. Reconoce el paquete y proceso de programación de Java 3D.
4. Utiliza correctamente las clases y aplicaciones en Java 3D.

d) Actitudes

✓ Presenta constancia en el desarrollo de las aplicaciones Java.


✓ Muestra creatividad al emplear Java 2D y Java 3D.

56
UNIVERSIDAD PRIVADA TELESUP

e) Presentación de ideas básicas y contenido esenciales de la unidad:

La Unidad de Aprendizaje 02: Java 2D y Java 3D, comprende el desarrollo de


los siguientes temas:

TEMA 01: Introducción a Java 2D


TEMA 02: Video y Sonido con JAVA
TEMA 03: Java 3D
TEMA 04: Clases y Aplicaciones en Java 3D

Introducción TEMA 1
a
Java 2D

Competencia:

Conocer la sintaxis de Java 2D y sus


aplicaciones respectivas.

57
UNIVERSIDAD PRIVADA TELESUP

Desarrollo de los Temas


Tema 01: Introducción a Java 2D

INTRODUCCIÓN A JAVA2D
El control de relleno de las figuras y selector de colores.
✓ La clase Color contiene métodos y constantes para manipular los
colores.
✓ La clase Font contiene métodos y constantes para manejar
tipos de letras.
✓ La clase Font Metrics contiene métodos para obtener
información sobre los tipos de tetras.
✓ La clase Polygon contiene métodos para crear polígonos.
✓ La clase Graphics contiene métodos para dibujar cadenas, líneas, rectángulos y
demás figuras.

58
UNIVERSIDAD PRIVADA TELESUP

La clase Component es la superclase para muchas de las


clases en el paquete java.awt. El método paint de
Component toma un objeto Graphics como argumento. El
sistema pasa este objeto al método Saint cuando se
requiere una operación de pintar (paint) para un
componente.
public void paint(Graphics g)

El método paint nos suministra el contexto gráfico g, un objeto de la


claseGraphics con el cual podemos dibujar en el área de trabajo del componente
llamando desde dicho objeto g a las funciones definidas en la claseGraphics.

Control de colores
La clase Color declara los métodos y las constantes para
manipular los colores en un programa de Java. A
continuación se detallan algunos métodos de Graphics
que son específicos para los colores.
public Color (int r,int g, int b)
Crea un color basado en componentes rojo, verde y
azul, como enteros 0 a 255.
public Color (flota r, flota g, flota tb)
Crea un color basado en componentes rojo, verde y
azul, como valores de punto flotante de 0.0 a 1.0.

59
UNIVERSIDAD PRIVADA TELESUP

public int getRed()


Devuelve un valor entre 0 y 255 el cual representa el
contenido rojo.
public int getGreen()
Devuelve un valor entre 0 y 255 el cual representa el
contenido verde.
public int getBlue()
Devuelve un valor entre 0 y 255 el cual representa el contenido azul.

public Color getColor()


Devuelve un valor entre 0 y 255 el cual representa el color actual.
public void setColor(Color c )
Establece el color actual.
Para mostrar un mensaje, llamamos desde el objeto g a la función miembrodrawString,
el primer argumento es el string que deseamos mostrar, y los dos números indican las
coordendas de la línea base del primer carácter.
g.drawString(“RGB actual: “+ g.getColor(),130,105);

Nuestro primer ejemplo nos muestra lo explicado hasta el momento, nos


encontraremos con cuadro de dialogo que contiene 3 rectángulos, rojo, verde y
azul respectivamente y a su derecha su color en RGB.

SELECTOR DE COLORES
El Paquete javax.swing proporciona el
componente de la GUI JColorChooser para

60
UNIVERSIDAD PRIVADA TELESUP

permitir a los usuarios de la aplicación seleccionar colores.


En el siguiente ejemplo muestra como al oprimir un boton se dispara el evento
JColorChooser el cual nos permitirá por medio de una interface seleccionar el color, al
oprimir aceptar en el cuadro de dialogo el color de fondo de la aplicación cambiara y
nos informara por medio de un label su valor RGB.

JColorChooser seleccionaColor = new JColorChooser();


Color = seleccionarColor.showDialog(parent,titulo,color inicial);

La clase JComponent posee un método denominado paintComponent(), responsable


de pintar en pantalla el componente en cuestión.
Para crear gráficos 2D se emplea la clase JPanel, subclase de JComponent,
redefiniendo de manera adecuada el método paintComponent().

Esquema:
protected void paintComponent(Graphics g)
Primero se debe invocar el método paintComponent() de la superclase.
public class Lienzo extends JPanel {
protected void
paintComponent(Graphics g) {
super.paintComponent(g);
// ...
}
}

61
UNIVERSIDAD PRIVADA TELESUP

Ejemplo1.java:
protected void paintComponent(Graphics g) {
super.paintComponent(g);
int width = (int) getSize().getWidth();
int height = (int) getSize().getHeight();
g.setColor(Color.ORANGE);
g.fillRect(0,0,width,height);
}

El contexto gráfico
La clase Graphics de java.awt proporciona las primitivas
necesarias para pintar diferentes tipos de elementos
(rectángulos, óvalos, cadenas, etc.) sobre el lienzo.
drawLine(), drawRect(), fillRect(),
drawOval(), fillOval(), drawString() …
Además, mantiene información como el color y la fuente
empleados
get/setColor(), get/setFont()

Eventos de ratón
La clase Component (del paquete java.awt) proporciona
dos métodos que permiten añadir un oyente para capturar
los eventos generados por el ratón, incluyendo los eventos
de movimiento.
void addMouseListener(MouseListener l)

62
UNIVERSIDAD PRIVADA TELESUP

void addMouseMotionListener(MouseMotionListener l)
La interfaz MouseListener
✓ void mouseClicked(MouseEvent e)
✓ void mouseEntered(MouseEvent e)
✓ void mouseExited(MouseEvent e)
✓ void mousePressed(MouseEvent e)
✓ void mouseReleased(MouseEvent e)

La clase MouseAdapter proporciona una implementación por defecto (esto es, que no
hace nada) de todas las operaciones de la interfaz MouseListener.
La interfaz MouseMotionListener
✓ Como su nombre indica, nos permite capturar aquellos eventos del ratón
relacionados con el movimiento del mismo.
✓ void mouseDragged(MouseEvent e)
✓ void mouseMoved(MouseEvent e)

De la misma forma, la clase MouseMotionAdapter proporciona una


implementación por defecto de todas las operaciones de la interfaz
MouseMotionListener.

La clase mouseevent
Proporciona información acerca del evento
de ratón que se ha producido.
Algunos de sus métodos más usados son:
- int getX()
- int getY()
- Point getPoint()
- Object getSource(): método heredado de EventObject
- int getButton(): devuelve alguna se las siguientes constantes: NOBUTTON,
BUTTON1, BUTTON2 ó BUTTON3

Ejemplo 1:

63
UNIVERSIDAD PRIVADA TELESUP

public Lienzo() {
super();
addMouseListener( new MyMouseListener() );
}
class MyMouseListener extends MouseAdapter {
public void mouseClicked(MouseEvent e) {
int x = e.getX();
int y = e.getY();
// ...
}
}

Ejemplo2:

protected void paintComponent(Graphics g) {


g.setColor(newColor(0x00,0x00,0x00) );
g.setFont(newFont("Arial",Font.ITALIC,18) );
g.drawString("Haz clic aquí",50,50);
}
class MyMouseListener extendsMouseAdapter{
public void mouseClicked(MouseEvent event){
System.out.println("coordenada x: " + event.getX() +
", " + "coordenada y: " + event.getY() );
}
}

64
UNIVERSIDAD PRIVADA TELESUP

Video TEMA 2
y Sonido
con Java

Competencia:

Describir las aplicaciones con sonido y video


usando Java 2D.
65
UNIVERSIDAD PRIVADA TELESUP

Tema 02: Video y Sonido con Java

El JAVE es wrapper Java en el ffmpeg proyecto. Los


desarrolladores pueden tomar ventaja de JAVE
para codificar archivos de audio y vídeo de un formato a
otro. Se puede transcodificar un archivo AVI a MPEG,
puedes cambiar un flujo de vídeo DivX en un (youtube
similares) flash FLV, usted puedes convertir un archivo de
audio WAV a MP3 o Ogg Vorbis uno, puede separar y
codificar pistas de audio y video, puede cambiar el tamaño de fotos, cambiar su
tamaño y proporciones, etc.

Muchos otros formatos, contenedores y operaciones están respaldados por


JAVE.
Requerimientos

66
UNIVERSIDAD PRIVADA TELESUP

JAVE requiere un entorno J2SE 1.4 o posterior y una cuenta de Windows o Linux en
una arquitectura de hardware i386 / 32 bits. JAVE también puede ser fácilmente
portado a otros sistemas operativos y configuraciones de hardware, consulte el manual
JAVE para más detalles.

Licencia
JAVE es software libre y esta licenciado bajo GPL (se
encuentra una copia de la licencia en el paquete de
distribución de software descargable).
Java Media Framework
Con la aparición de Java Media Framework ha
cambiado el panorama multimedia de Java. Gracias a
que ya es posible desarrollar aplicaciones multimedia
que utilicen audio y vídeo de una forma sencilla y práctica, sin perder por ello la
compatibilidad que siempre ofrece Java.

Hasta hace poco las posibilidades multimedia de Java eran bastante reducidas.
Debido a estas carencias, se crearon grupos de desarrollo que generaban
librerías para reproducir otros formatos de sonido, como por ejemplo MIDI. En
cuanto al vídeo no existía nada.

¿QUÉ ES JMF?
JMF (“Java Media Framework”) proporciona herramientas para la captura,
procesamiento y almacenamiento de datos multimedia.
Permite su transmisión y recepción a través de Internet.
Más concretamente permite:
Reproducir archivos multimedia en applets y aplicaciones, flujos
multimedia recibidos en tiempo real a través de la red y
capturar audio y vídeo de un micrófono y una cámara de
vídeo.

67
UNIVERSIDAD PRIVADA TELESUP

Con JMF se abren todas las posibilidades multimedia,


se reproduce de una forma sencilla la gran mayoría de
los formatos de audio, como WAV, MIDI, MP3, AU, etc.
Captura sonido, reproduce streams de audio, etc.
Todo esto mediante una de sus partes, Java Media
Player, se pueden utilizar los distintos formatos de
vídeo, como MPEG, AVI, MOV, captura streams de
vídeo. Gracias a esta API, se pueden crear
aplicaciones multimedia que antes se desarrollaban
con Visual Basic, Delphi o similares, con la ventaja de
la portabilidad, la orientación a objetos y la integración con el lenguaje.

ARQUITECTURA DE JMF
JMF funciona como una cadena de música
como un reproductor de CD´s.
Entrada: Captura, lee un archivo o recibe de
la red.
Proceso: Aplica efectos (filtros), comprime o
descomprime, convierte entre formatos.
Salida: Dispositivo de salida, guardar en un archivo o enviarla por la red.

Clases e interfaces de JMF


Las aplicaciones JMF puede ceñirse al siguiente
esquema:

Data Source
Clase de javax.media.protocol, representa el origen

68
UNIVERSIDAD PRIVADA TELESUP

de datos multimedia, encapsula información sobre su ubicación, el protocolo para su


transferencia al reproductor y el software para tratarlos. Soporta todo tipo de contenido
multimedia.

Player

Interface de javax.media, actúa como gestor de datos multimedia,


asegura que lleguen adecuadamente al dispositivo de salida y no
hace falta un reproductor específico para cada tipo de datos.
Tiene asociados controles para actuar sobre los datos multimedia
que está procesando, antes de que el fragmento pueda
reproducirse, el Player debe pasar por una serie de estados.

Processor
Es un tipo de reproductor, subinterfaz de javax.media.
Player aporta dos características suplementarias;
Puede volcar los datos procesados en un código
fuente, en lugar de en un dispositivo de salida. Y
cambiar de formato lo datos.

DataSink
Es una interfaz de javax.media que envía los datos a un destino distinto de los
dispositivos de salida, como un archivo o un flujo de salida RTP.
Format
Es una clase de javax.media que modela el formato de los datos multimedia, tiene dos
subclases:
✓ AudioFormat: Encapsula información sobre el formato de datos de audio:
✓ Frecuencia de muestreo.
✓ Número de bits por muestra.

69
UNIVERSIDAD PRIVADA TELESUP

✓ Número de canales.
✓ VideoFormat: Encapsula información sobre el formato de datos de vídeo.

Manager
Es una clase Final de javax.media que contiene
métodos estáticos para crear instancias de todas las
interfaces y clases anteriores.
Estructura de las aplicaciones desktop
La realidad de cada empresa es única y por eso
muchas veces es necesario la implementación de un
software desarrollado a medida para conseguir
respuestas adecuadas a sus necesidades.

En numerosas ocasiones las empresas precisan


soluciones informáticas específicas que no están recogidas
por software estándar, o no lo están de una forma
eficiente, y que puedan ofrecer soluciones concretas a sus
necesidades y planteamientos de gestión.
Para esos casos desarrollamos aplicaciones informáticas
“llaves en mano” (usted será el propietario del código)
utilizando como herramienta principal de desarrollo y la tecnología .NET, una
plataforma de desarrollo y ejecución de aplicaciones, que facilita el proceso de
construcción de programas multipropósito, tanto en entornos cliente como entorno web
o móviles.

Una aplicación Desktop (también llamada de escritorio) es aquella que está instalada
en el computador del usuario, que es ejecutada directamente por el sistema operativo,
ya sea Microsoft Windows, Mac OS X, Linux o Solaris, y cuyo rendimiento depende de
diversas configuraciones de hardware como memoria RAM, disco duro, memoria de
video, etc.

70
UNIVERSIDAD PRIVADA TELESUP

Ejemplos de aplicaciones desktop:


✓ Programas de Microsoft office
(excel, Word, power point, etc.)
✓ Cliente FTP (FileZilla, CUTE FTP,
ETC)
✓ Windows Live Messenger
✓ ¡Tunes
✓ Adobe Photoshop
✓ Winamp.

Ventajas:
❖ Habitualmente su ejecución no requieren comunicación con el exterior, sino que
se realiza de forma local. Esto repercute en mayor velocidad de procesamiento, y
por tanto en mayores capacidades a la hora de programar herramientas más
complicadas o funcionales.
❖ Suelen ser más robustas y estables que las aplicaciones web.
❖ Rendimiento: el tiempo de respuesta es muy rápido.
❖ Seguridad: pueden ser muy seguras (dependiendo del desarrollador).

Desventajas:
❖ Su acceso se limita al computador donde están
instaladas.
❖ Son dependientes del sistema operativo que
utilice el computador y sus capacidades (video,
memoria, etc).
❖ Requieren instalación personalizada.
❖ Requieren actualización personalizada.

71
UNIVERSIDAD PRIVADA TELESUP

❖ Suelen tener requerimientos especiales de software y librerias.

Formato de ventana para procesos

TEMA 3
Java 3D

Competencia:

Reconocer el paquete y proceso de


programación de Java 3D.
72
UNIVERSIDAD PRIVADA TELESUP

Tema 03: Java 3D

EL API JAVA 3D
Todo programa Java 3D está, al menos, parcialmente
ensamblado por objetos del árbol de clases Java 3D.
Esta colección de objetos describe un universo virtual,
que va a ser renderizado. El API define unas 100 clases
presentadas en el paquete javax.media.j3d.
Hay cientos de campos y métodos en las clases del API
Java 3D.

Sin embargo, un sencillo universo virtual que incluya


animación puede construirse con unas pocas clases.

73
UNIVERSIDAD PRIVADA TELESUP

Se realizará un sencillo pero completo programa Java 3D, llamado HelloJava3Dd.java,


que muestra un cubo giratorio. El programa de ejemplo se desarrolla de forma
incremental, y se presenta en varias versiones, para demostrar cada parte del proceso
de programación Java 3D.

Además del paquete corazón de Java 3D, se


usan otros paquetes para escribir programas
Java 3D. Uno de estos paquetes es
com.sun.j3d.utils el que normalmente se referiere
como clases de utilidades de Java 3D. El
paquete de las clases corazón incluye sólo las
clases de menor nivel necesarias en la programación Java 3D.
Las clases de utilidades son adiciones convenientes y poderosas al corazón. Estas
clases se dividen en cuatro categorías: cargadores de contenidos, ayudas a la
construcción del escenario gráfico, clases de geometría y utilidades de conveniencia.

Al utilizar las clases de utilidades se reduce significativamente


el número de líneas de código en un programa Java 3D.
Además de las clases de los paquetes corazón y de utilidades
de Java 3D, todo programa 3D usa clases de los paquetes
java.awt y javax.vecmath. El paquete java.awt define el
"Abstract Windowing Toolkit" (AWT). Las clases AWT crean
una ventana para mostrar el renderizado. El paquete
javax.vecmath define clases de vectores matemáticos para
puntos, vectores, matrices y otrosobjetos matemáticos.

En el resto del texto, el término objeto visual se utilizará para referirnos a un "objeto del
escenario gráfico" (por ejemplo, un cubo o una esfera). El término objeto sólo se usará
para referirse a un ejemplar de una clase. El término contenido se usará para
referirnos a objetos visuales en un escenario gráfico como un todo.Construir un
Escenario Gráfico Un universo virtual Java 3D se crea desde un escenario gráfico. Un

74
UNIVERSIDAD PRIVADA TELESUP

escenario gráfico se crea usando ejemplares de clases Java 3D. El escenario gráfico
está ensamblado desde objetos que definen la geometría, los sonidos, las luces, la
localización, la orientación y la apariencia de los objetos visuales y sonoros.

Una definición común de un escenario gráfico es


una estructura de datos compuestade nodos y
arcos. Un nodo es un elemento dato y un arco
es una relación entre elementos datos. Los
nodos en un escenario gráfico son los
ejemplares de las clases Java 3D.
Los arcos representan dos tipos de relaciones
entre ejemplares Java 3D.La relación más
común es padre-hijo. Un nodo Group puede tener cualquier número de hijos, pero sólo
un padre. Un nodo hoja sólo puede tener un padre y no puede tener hijos.

La otra relación es una referencia. Una referencia asocia un


objeto NodeComponent con un nodo del escenario gráfico.
Los objetos NodeComponent definen la geometría y los
atributos de apariencia usados para renderizar los objetos
visuales. Un escenario gráfico Java 3D está construido de
objetos nodos con relaciones padre-hijo formando una
estructura de árbol. En una estructura de árbol, un nodo es el
raíz. Se peude acceder a otros nodos siguiendo los arcos
desde el raíz. Los nodos de un árbol no forman bucles. Un escenario gráfico está
formado desde los árboles con raíces en los objetos Locale. Los NodeComponents y
las referencias a arcos no forman parte del escenario gráfico.

Sólo existe un camino desde la raíz de un árbol a cada una de las hojas; por lo tanto,
sólo hay un camino desde la raíz hasta el escenario gráfico de cada nodo hoja. El
camino desde la raíz de un escenario gráfico hasta una hoja especificada es el camino

75
UNIVERSIDAD PRIVADA TELESUP

al escenario gráfico del nodo hoja. Como un camino de un escenario gráfico trata
exactamente con un sola hoja, hay un camino de escenario gráfico para cada hoja en
el escenario. Todo camino de escenario gráfico en un escenario gráfico Java 3D
especifica completamente la información de estado de su hoja.

Esta información incluye, la localización, la


orientación y el tamaño del objeto visual.
Consecuentemente, los atributos visuales de cada
objeto visual dependen sólo de su camino de
escenario gráfico. El renderizador Java 3D se
aprovecha de este echo y renderiza las hojas en el
orden que él determina más eficiente. El
programador Java 3D normalmente no tiene control sobre el orden de renderizado de
los objetos. Las representaciones gráficas de un escenario gráfico pueden servir como
herramienta de diseño y/o documentación para los programas Java 3D.

Los escenarios gráficos se dibujan usando símbolos gráficos estándards como se ve


en la Figura 1-1. Los programas Java 3D podrían tener más objetos que los que hay
en su escenario gráfico. Para diseñar un universo virtual Java 3D se dibuja un
escenario gráfico usando unconjunto de símbolos estándar. Después de completar el
diseño, este escenario gráfico es la especificación para el programa. Después de
completar el programa, el mismo escenario gráfico es una representación concisa del
programa (asumiendo que se siguió la especificación).

76
UNIVERSIDAD PRIVADA TELESUP

Figura 1-1. Símbolos que Representan Objetos en un Escenario Gráfico

Cada uno de los símbolos mostrados al lado izquierdo


de la Figura 1.1 representa un sólo objeto cuando se
usa en un escenario gráfico. Los dos primeros
símbolos representan objetos de clases específicas:
VirtualUniverse y Locale. Lo siguientes tres símbolos
de la izquierda representan objetos de las clases
Group, Leaf, y NodeComponent. Estos tres símbolos
normalmente tienen anotaciones para indicar la
subclase del objeto específico. El último símbolo se usa
para representar otras clases de objetos.

El símbolo de la flecha sólida representa una relación padre-hijo entre dos objetos. La
flecha punteada es una referencia a otro objeto. Los objetos referenciados pueden ser
compartidos entre diferentes ramas de una escenario gráfico. En la Figura 1-2,
podemos ver un sencillo escenario gráfico:

77
UNIVERSIDAD PRIVADA TELESUP

1-2. Primer Ejemplo de Escenario Gráfico

Es posible crear un escenario gráfico ilegal.


Podemos ver uno en la Figura 1-3. Esteescenario
es ilegal porque viola las propiedades de un DAG.
El problema son los dos objetos TransformGroup
que tienen al mismo objeto Shape3D como hijo.
Recuerda que una hoja sólo puede tener un padre.
En otras palabras, sólo puede haber un camino
desde el objeto Local hasta la hoja (o un camino desde la hoja hasta el objeto Loale).
Podríamos pensar que la estructura mostrada en la figura 1-3 define tres objetos
visuales en un universo virtual.

Pero el escenario gráfico define dos objetos visuales que re-usan el objeto visual
(Shape3D) del lado derecho de la figura. Conceptualmente, cada objeto Transform
Group que apadrina al ejemplar compartido de Shape3D podría situar una imagen en
el objeto visual en diferentes localizaciones. Sin embargo, es un escenario gráfico
ilegal porque el arco padre-hijo no forma un árbol. En este ejemplo, el resultado es que
el objeto Shape3D tiene más de un padre.

78
UNIVERSIDAD PRIVADA TELESUP

Las explicaciones del árbol y de las estructuras DAG son correctas. Sin embargo, el
sistema de ejecución Java 3D reporta el error en términos de la relación hijo-padre.
Un resultado de la limitación de la estructura de árbol es que cada objeto Shape3D
está limitado a un sólo padre. Para el ejemplo de la Figura 1-3, se lanzará una
excepción 'multiple parent' en el momento de la ejecución. La Figura 1-4, con un padre
para cada objeto Shape3D, muestra una posible solución para este escenario gráfico.

Figura 1-3. Un Escenario Gráfico Ilegal.

Un programa Java 3D que define un escenario gráfico ilegal podría compilarse, pero
no se renderiza. Cuando se ejecuta un programa Java 3D que define un escenario
gráfico ilegal, el sistema Java 3D detecta el problema y lanza una excepción. El
programa podría estar ejecutándose y consecuentemente deberíamos pararlo. Sin
embargo, no se renderizará ninguna imagen.

79
UNIVERSIDAD PRIVADA TELESUP

Figura 1-4. Posible solución al escenario gráfico ilegal de la Figura 1-3

Cada escenario gráfico tiene un sólo VirtualUniverse. Este objeto tiene una lista de
objetos Locale. Un objeto Locale proporciona una referencia a un punto en el universo
virtual. Podemos pensar en los objetos Locale como marcas de tierra que determinan
la localización de los objetos visuales en el universo virtual.

Es técnicamente posible para un programa Java


3D tener más de un objeto VirtualUniverse, y
así definir más de un universo virtual. Sin
embargo, no hay ninguna forma de
comunicación entre los universos virtuales.
Además, un objeto de un escenario gráfico no
puede existir en más de un universo virtual.

Es altamente recomendable usar uno y sólo un ejemplar de VirtualUniverse en cada


programa Java 3D.Mientras que un objeto VirtualUniverse podría referenciar muchos
objetos Locale, la mayoría de los programas Java 3D tiene un sólo objeto Locale.
Cada objetoLocale puede servir de raíz para varios sub-gráficos del escenario gráfico.
Por ejemplo, si nos referimos a la Figura 1-2 podremos observar las dos ramas sub-
gráficas que salen desde el objeto Locale.

80
UNIVERSIDAD PRIVADA TELESUP

Un objeto BranchGroup es la raíz de un sub-


gráfico, o rama gráfica. Hay doscategorias de
escenarios sub-gráficos: la rama de vista gráfica y
la rama de contenido gráfico. La rama de contenido
gráfico especifica el contenido del universo virtual -
geometría, apariencia, comportamiento,
localización, sonidos y luces. La rama de vista
gráfica especifica los parámetros de visualización,
como la posición de visualización y la dirección.
Juntas, las dos ramas especifican la mayoría del trabajo que el renderizador tiene que
hacer.

81
UNIVERSIDAD PRIVADA TELESUP

Clases TEMA 4
y Aplicaciones
en Java 3D

Competencia:

Utilizar correctamente las clases y


aplicaciones en Java 3D.

82
UNIVERSIDAD PRIVADA TELESUP

Tema 04: Clases y Aplicaciones en Java 3D

ÁRBOL DE CLASES DE ALTO NIVEL DEL API JAVA 3D


En la Figura 1-5 podemos ver los tres primeros niveles
del árbol de clases del APIJava 3D. En esta parte del
árbol aparecen las clases VirtualUniverse, Locale,Group,
y Leaf. SceneGraphObject es la superclase de casi
todas las clases corazón y de utilidadde Java 3D. Tiene
dos subclases: Node y NodeComponent. Las subclases
de Nodeproporcionan la mayoría de los objetos de un escenario gráfico. Un objeto
Node esun objeto nodo Group o un objeto nodo Leaf.

Clase node
La clase Node es una superclase abstracta de las clases
Group y Leaf. Esta clase define algunos de los métodos
importantes de sus subclases. Las subclases de Node
componen escenarios gráficos.
Clase Group.La clase Group es la superclase usada
en especificación de localización y orientaciónde objetos
visuales en el universo virtual. Dos de las subclases de
Group son:BranchGroup y TransformGroup. En la representación gráfica de un
escenariográfico, los símbolos de Group (círculos) normalmente se anotan con BG
paraBranchGroups, TG para TransformGroups, etc. La Figura 1-2 muestra
algunosejemplos de esto.

Clase Leaf.La clase Leaf es la superclase usada para especificar la forma, el sonido
ycomportamiento de los objetos visuales en el universo virtual. Algunas de la
subclases de Leaf son: Shape3D, Light, Behavior, y Sound. Estos objetos podríanno
tener hijos pero podrían referenciar a NodeComponents.
Clase NodeComponentLa clase NodeComponent es la superclase usada para
especificar la geometría, laapariencia, la textura y las propiedades de material de un
nodo Shape3D (Leaf).

83
UNIVERSIDAD PRIVADA TELESUP

LosNodeComponents no forman parte del escenario gráfico, pero son


referenciadospor él. un NodeComponent podría ser referenciado por más de un
objetoShape3D.

84
UNIVERSIDAD PRIVADA TELESUP

Receta para escribir programas java 3D


Las subclases de SceneGraphObject son los ladrillos que
se ensamblan en losescenarios gráficos. La línea básica
de desarrollo de un programa Java 3D consisteen siete
pasos (a los que la especificación del API Java 3D se
referiere como unReceta) presentados a continuación.

Esta receta puede usarse para ensamblarmuchos útiles programas Java 3D.
1. Crear un Objeto Canvas3D
2. Crear un objeto VirtualUniverse
3. Crear un objeto Locale, adjuntarlo al objeto
VirtualUniverse Construir la rama de vista
gráfica
❖ Crear un objeto View
❖ Crear un objeto ViewPlatform
❖ Crear un objeto PhysicalBody
❖ Crear un objeto PhysicalEnvironment
❖ Adjuntar los objetos ViewPlatform, PhysicalBody,
❖ PhysicalEnvironment, y Canvas
❖ 3D al objeto View

4. Construir la rama de vista gráfica


● Crear un objeto View
● Crear un objeto ViewPlatform
● Crear un objeto PhysicalBody
● Crear un objeto PhysicalEnvironment
Adjuntar los objetos ViewPlatform, PhysicalBody,
PhysicalEnvironment, y Canvas3D al objeto View

5. Construir la(s) rama(s) gráfica(s) de contenido


6. Compilar la(s) rama(s) gráfica(s)
7. Insertar los subgráficos dentro del objeto Locale

85
UNIVERSIDAD PRIVADA TELESUP

Esta receta ignora algunos detalles


pero ilustra el concepto fundamental
para toda laprogramación Java 3D:
crear la rama gráfica del escenario
gráfico es laprogramación principal.
En vez de ampliar esta receta, la siguiente sección explicauna forma sencilla de
construir un escenario gráfico muy similar con menosprogramación.

Una Sencilla Receta para Escribir Programas Java 3DLos programas Java 3D
escritos usando la receta básica tienen ramas de vistagráfica con idéntica estructura.
La regularidad de la estructura de las ramas de vistagráfica también se encuentra en
la clase de utilidad SimpleUniverse. Losejemplares de esta clase realizan los pasos 2,
3 y 4 de la receta básica. Usando laclase SimpleUniverse en programación Java 3D
se reduce significativamente eltiempo y el esfuerzo necesario para crear las ramas de
vista gráfica.Consecuentemente, el programador tiene más tiempo para concentrarse
en elcontenido. Esto de lo que se trada el escribir programas Java 3D.
La clase SimpleUniverse es un buen punto de inicio en la programación Java
3D,porque permite al programador ignorar las ramas de vista gráfica. Sin embargo,
usarSimpleUniverse no permite tener varias vistas de un universo virtual.

La clase SimpleUniverse
El constructor de SimpleUniverse crea un
escenario gráfico que incluye un
objetoVirtualUniverse y Locale, y una rama
de vista gráfica completa. Esta rama
gráficacreada usa un ejemplar de las clases
de conveniencia ViewingPlatform y
Vieweren lugar de las clases corazón
usadas para crear una rama de vista
gráfica. Observaque SimpleUniverse sólo usa indirectamente los objetos View y
ViewPlatform delcorazón Java 3D. Los objetos SimpleUniverse suministran la
funcionalidad de todoslos objetos que hay dentro del recuadro azul de la Figura 1-7.

86
UNIVERSIDAD PRIVADA TELESUP

El paquete com.sun.j3d.utils.universe contiene SimpleUniverse,


ViewingPlatform, yclases Viewer de conveniencia.

Al usar los objetos SimpleUniverse la receta básica se simplifica:


1. Crear un objeto Canvas3D
2. Crear un objeto SimpleUniverse que referencia al objeto Canvas3D anterior
• Personalizar el objeto SimpleUniverse
• Construir la rama de contenido
3. Compilar la rama de contenido gráfico
4. Insertar la rama de contenido gráfico dentro del objeto Locale deSimpleUniverse
El objeto SimpleUniverse crea una rama de vista gráfica completa para un
universo virtual.

Esta rama incluye un plato de imagen. Un plato de imagen es


el rectánguloconceptual donde se proyecta el contenido para
formar la imagen renderizada.
Elobjeto Canvas3D, que proporciona una imagen en una
ventana de nuestra pantalla,puede ser el plato de imagen.

87
UNIVERSIDAD PRIVADA TELESUP

La Figura 1-9 muestra la relación entre el plato de imagen, la posición del ojo, y
eluniverso virtual. La posición del ojo está detrás del plato de imagen. Los
objetosvisuales delante del plato de imagen son renderizados en el plato de imagen.
Elrenderizado puede ser como una proyección de los objetos visuales sobre el plato
deimagen. Esta idea se ilustra con los cuatro proyectores de la imagen
(líneaspunteadas).

Figura 1-9. Dibujo Conceptual de un Plato de Imagen y la Posición del Ojo en un


Universo Virtual

Por defecto, el plato de imagen está centrado en el origen de SimpleUniverse.


Laorientación por defecto es mirando hacia abajo el eje Z. Desde esta posición, el eje
Xes una línea horizontal que atraviesa el plato de imagen con los valores
positivoshacia la derecha. El eje Y es una línea vertical que atraviesa el centro del
plato deimagen, con los valores positivos arriba. Consecuentemente, el punto (0,0,0)
es elcentro del plato de imagen.

Los típicos programas Java 3D mueven la vista hacia


atrás (z positivo) para hacer que los objetos se
acerquen, al origen dentro de la vista. La clase
SimpleUniversetiene un miembro que es un objeto de la
clase ViewingPlatform. Esta clase tieneun método
setNominalViewingTransform que selecciona la
posición del ojo paraque esté centrado en (0, 0, 2.41)
buscando en dirección z negativa hacia el origen.

88
UNIVERSIDAD PRIVADA TELESUP

Después de crear los objetos Canvas3D y SimpleUniverse, el siguiente paso es la


creación de la rama de contenido gráfico. La regularidad de estructura encontrada en
la rama de vista gráfica no existe para la rama de contenido gráfico. La rama de
contenido varia de un programa a otro haciendo imposible obtener los detalles de su
construcción en una receta. Esto también significa que no hay una clase de
"contenido sencillo" para ningún universo que podamos querer ensamblar.
Después de crear la rama de contenido gráfico, se inserta dentro del universeo
usando el método addBranchGraph de SimpleUniverse. Este método toma un
ejemplar de BranchGroup como único argumento. Este BranchGroup se añade como
hijo del objeto Locale creado por SimpleUniverse.

Alguna terminología Java 3D


Insertar una rama gráfica dentro de un Locale la hace
viva, y consecuentemente,cada uno de los objetos de
esa rama gráfica también están vivos. Hay
algunasconsecuencias cuando un objeto se convierte en
vivo. Los objetos vivos están sujetos s renderización.
Los parámetros de los objetos vivos no pueden
sermodificados a menos que la capacidad
correspondiente haya sido seleccionadaespecíficamente
antes de que el objeto esté vivo.

Los objetos BranchGroup pueden ser compilados. Compilar


un BranchGroup loconvierte a él y a todos sus ancestros en
una forma más eficiente para elrenderizado. Compilar los
objetos BranchGroup está recomendado como el
últimopaso antes de hacerlo vivir. Es mejor compilar solo
los objetos BranchGroupinsertados dentro de objetos
LocaleLos conceptos de compilado y vivo se implementan
en la claseSceneGraphObject. Abajo podemos ver los dos
métodos de la claseSceneGraphObject que se relacionan
con estos conceptos.

89
UNIVERSIDAD PRIVADA TELESUP

Observa que no hay un paso "Empezar a renderizar" en ninguna de las


recetasanteriores. El renderizador Java 3D empieza a funcionar en un bucle infinito
cuandouna rama gráfica que contiene un ejemplar de View se vuelve vivo en un
universovirtual. Una vez arrancado, el renderizador Java 3D realiza las
operacionesmostradas en el siguiente listado:

Las secciones anteriores explicaban la construcción de un sencillo universo


virtual sin una rama de contenido gráfico. La creación de esta rama es el
objetivo de las siguientes secciones.

90
UNIVERSIDAD PRIVADA TELESUP
Lecturas Recomendadas
❖ CÓMO TRATAR CON JAVA FIGURAS, IMÁGENES Y TEXTO EN DOS DIMENSIONES
http://www.lcc.uma.es/~galvez/ftp/libros/Java2D.pdf

❖ MULTIMEDIA EN JAVA
http://www.uv.es/~jgutierr/MySQL_Java/GUI.pdf

❖ INTRODUCCIÓN A JAVA 3D
http://www.itescam.edu.mx/principal/sylabus/fpdb/recursos/r89548.PDF

Actividades y Ejercicios

1. Ingresa al link "Java 2D" lee atentamente las indicaciones,


desarróllalo y envíalo por el mismo medio.
Obtenga la siguiente imagen y texto mostrada en la figura, usado Java
2D.

2. Realice un programa en Java 2D, que incluya audio (A.) y video (V.)
que explique el efecto fotoeléctrico.
Envíalo a través de "Java 2D A&V".
3. Realice un programa en java 3D, que explique cómo obtener las
diferentes cónicas (parábola, elipse, etc.) haciendo cortes a un cono.
Envíalo a través de "Java 3D".

91
UNIVERSIDAD PRIVADA TELESUP
Autoevaluación
1) ¿Qué color crea la sentencia: public color (int r,int g, int b)?
a. Color basado en componentes rojo, verde y azul.
b. Color basado en componentes rojo, gris y verde.
c. Color basado en componentes rojo, verde y amarillo.
d. Color basado en componentes verde, amarillo y azul.
e. Color basado en componentes rojo, amarillo y azul.

2) El commando: void addMouseListener(MouseListener l).


a. El ratón se mueve a la izquierda.
b. El ratón se mueve a la derecha.
c. El ratón se mueve arriba.
d. El ratón se mueve abajo.
e. Es un evento de ratón.

3) El JAVE es:
a. Wrapper Java en el font proyecto.
b. Wrapper Java en el mp3 proyecto.
c. Wrapper Java en el ffmpeg proyecto.
d. Wrapper Java en el mp4 proyecto.
e. Wrapper Java en el avi proyecto.

4) JMF permite su transmisión y recepción a través de :


a. Streammig.
b. Internet.
c. Wifi.
d. Video.
e. Radio.

5) Clase de javax.media.protocol, representa el origen de dato:


a. Multimedia.
b. Media.
c. Ftp.
d. Html.
e. Dvirtuales.

92
UNIVERSIDAD PRIVADA TELESUP

6) Todo programa Java 3D está, al menos, parcialmente ensamblado por


objetos del árbol de clase:
a. Java 2D.
b. JME 3D.
c. Java 3D.
d. JSE 3D.
e. JAV 3D.

7) Las clases AWT crean una ventana para mostrar el:


a. Paquete javax.
b. Vectorizado.
c. Vector matemático.
d. Renderizado.
e. Matrices y otros objetos matemáticos.

8) La clase Node es una superclase abstracta de las clases:


a. Locale y group.
b. Branch y Transform.
c. Behavior y Sound.
d. Group y Leaf.
e. Group y Sound.

9) La clase Group es la superclase usada en especificación de localización y


orientación de:
a. Objetos visuales en el universo virtual.
b. Objetos visuales en el universo real.
c. Objetos gráficos en las canvas.
d. Objetos visuales en las canvas.
e. Objetos gráficos virtuales.

10) Es una de la subclases de Leaf :


a. Luz.
b. Behind.
c. Sonido.
d. Video.
e. Behavior

93
UNIVERSIDAD PRIVADA TELESUP
Resumen
UNIDAD DE APRENDIZAJE ii:

El control de relleno de las figuras y selector de colores. La clase Color contiene


métodos y constantes para manipular los colores. La clase Font contiene métodos y
constantes para manejar tipos de letras. La clase Font Metrics contiene métodos para
obtener información sobre los tipos de tetras. La clase Polygon contiene métodos para
crear polígonos. La clase Graphics contiene métodos para dibujar cadenas, líneas,
rectángulos y demás figuras.

JMF (“Java Media Framework”) proporciona herramientas para la captura,


procesamiento y almacenamiento de datos multimedia. Permite su transmisión y
recepción a través de Internet. Con JMF se abren todas las posibilidades multimedia, se
reproduce de una forma sencilla la gran mayoría de los formatos de audio, como WAV,
MIDI, MP3, AU, etc. Captura sonido, reproduce streams de audio, etc. JMF funciona
como una cadena de música como un reproductor de CD´s.

Todo programa Java 3D está, al menos, parcialmente ensamblado por objetos del árbol
de clases Java 3D. Esta colección de objetos describe un universo virtual, que va a ser
renderizado. El API define unas 100 clases presentadas en el paquete javax.media.j3d.
Todo programa 3D usa clases de los paquetes java.awt y javax.vecmath. El paquete
java.awt define el "Abstract Windowing Toolkit" (AWT). Las clases AWT crean una
ventana para mostrar el renderizado. El paquete javax.vecmath define clases de
vectores matemáticos para puntos, vectores, matrices y otros objetos matemáticos.

SceneGraphObject es la superclase de casi todas las clases corazón y de utilidad de


Java 3D. Tiene dos subclases: Node y NodeComponent. Las subclases de Node
proporcionan la mayoría de los objetos de un escenario gráfico. Un objeto Node es un
objeto nodo Group o un objeto nodo Leaf. La clase Group es la superclase usada en
especificación de localización y orientación de objetos visuales en el universo virtual.
Las subclases de SceneGraphObject son los ladrillos que se ensamblan en los
escenarios gráficos.

94
UNIVERSIDAD PRIVADA TELESUP

95
UNIVERSIDAD PRIVADA TELESUP
Introducción
a) Presentación y contextualización:

Los temas que se tratan en la presente unidad temática, tienen por finalidad que el
estudiante tome conozca el lenguaje VRML El Virtual Reality Modeling Language
es un lenguaje de modelado de mundos virtuales en tres dimensiones al igual que
el HTML.

b) Competencia:

Conoce el lenguaje VRML para desarrollar diferentes tipos de aplicaciones.

c) Capacidades:

1. Reconoce correctamente la sintaxis y comandos de VRML.


2. Conoce el proceso de construcción de formas de texto usando los comandos
adecuados.
3. Aplica los diversos nodos que nos permitan agrupar objetos y construirlos de
manera más compleja.
4. Emplea los diferentes nodos de agrupación en aplicaciones de realidad virtual.

d) Actitudes:

✓ Utiliza de manera dinámica el lenguaje VRML.


✓ Muestra perseverancia en el desarrollo del lenguaje VRML.

e) Presentación de ideas básicas y contenidos esenciales de la unidad:


La Unidad de Aprendizaje 03: VRML, comprende el desarrollo de los siguientes
temas:

TEMA 01: Introducción a VRML.


TEMA 02: Construcción de Formas de Texto.
TEMA 03: Nodos de Agrupación.
TEMA 04: Más Nodos.

96
UNIVERSIDAD PRIVADA TELESUP

Introducción TEMA 1
a VRML

Competencia:
Reconocer correctamente la sintaxis y
comandos de VRML.

97
UNIVERSIDAD PRIVADA TELESUP
Desarrollo de los Temas

Tema 01: Introducción a VRML

VISUALIZADORES VRML:
Es posible visualizar archivos VRML mediante dos tipos de aplicaciones diferentes:

Mediante visualizadores VRML específicos.


Mediante plug-ins instalados en visualizadores HTML

La segunda de las opciones es la más común. De este modo, el Netscape


Communicator 4.01 incorpora como plug-in de VRML el Cosmo Player de Silicon
Graphics. Para averiguar que plug-ins se encuentran instalados en el
Netscape basta con desplegar el menú Help/About plug-ins. En el
caso de no disponer del Cosmo Player, se podría obtener como
aplicación shareware a través de internet. Una vez obtenido el
programa, se ejecutaría, instalándose automáticamente dentro del
Netscape o del Explorer.

Documentos VRML:
Como se ha mencionado anteriormente, VRML es un
lenguaje de descripción de escenas en el que cada escena
se compone de un número de objetos. Los objetos pueden
ser formas sólidas situados y orientados de determinada forma u elementos
intangibles que afectan a la escena como luces, sonido y distintos puntos de vista.
Para crear estos mundos de realidad virtual se utilizan archivos de texto, cuya
extensión será siempre .wrl, los cuales pueden ser desarrollados mediante cualquier
editor o procesador de textos. Además existe la posibilidad de utilizar programas de
diseño gráfico, los cuales generan automáticamente archivos en formato VRML.

98
UNIVERSIDAD PRIVADA TELESUP

Todo documento VRML está compuesto por los siguientes elementos:


Cabecera.
Comentarios.
Nodos.

Cabecera: La cabecera de todo archivo VRML es siempre la misma: #VRML V2.0


utf8. Donde VRML V2.0 indica el estándar empleado y utf8 autoriza el uso de
caracteres internacionales. Es importante resaltar que no debe existir ningún espacio
en blanco entre el símbolo "#" y la palabra "VRML".

Comentarios: En VRML un comentario se escribe en una sola línea, la cual


comienza con el símbolo #. Se pueden tener tantas líneas de comentarios como se
desee.
Nodos: Un nodo es la estructura mínima indivisible de un archivo VRML y tiene
como misión la de definir las características de un objeto o bien las relaciones entre
distintos objetos. La mayoría de los nodos pueden repetirse tantas veces como sea
necesario en una escena, salvo una serie de nodos especiales como los que definen
la niebla o la panorámica del mundo virtual que aparecen una sola vez.

99
UNIVERSIDAD PRIVADA TELESUP

Por otra parte, no todos los nodos afectan al aspecto


visual del mundo. Por ejemplo, existen nodos que
actúan como sensores que detectan acciones del
usuario e informan de ellas a otros objetos y otros que
se encargan de modelar los sonidos. Los nodos a su
vez contienen campos que describen propiedades.
Todo campo tiene un tipo determinado y no se puede inicializar con valores de otro
tipo. De este modo, cada tipo de nodo tiene una serie de valores predeterminados
para todos sus campos, de forma que cuando lo utilicemos en una escena sólo
debemos indicar aquellos campos que se quieran modificar.

Los campos pueden ser simples o campos que indiquen a vectores u otros nodos.
Estilo de escritura de los programas:
VRML es un lenguaje sensible a mayúsculas y minúsculas, lo cual ha de ser
tenido en cuenta a la hora de asignar nombres.
Todos los nodos han de comenzar siempre con letra mayúscula.
Los campos de los nodos deben comenzar siempre con letra minúscula.
Los campos de los nodos deben comenzar siempre con letra minúscula.
Los números se escriben en punto flotante.

Utilizar una línea distinta para cada nodo, para cada campo y
para cada valor de cada campo.
Indentar cada línea, según su jerarquía.
Colocar cada símbolo de cierre en el nivel de
indentación que le corresponda.
Poner las líneas de comentario necesarias al mismo
nivel que lo que se comenta.
Poniendo nombres propios a los nodos.

100
UNIVERSIDAD PRIVADA TELESUP

Un ejemplo de programa VRML sería el siguiente:


#VRML V2.0 utf8
#Esto es una línea de comentarios
Shape{
appearance Appearance{
material Material{}
}
geometry Cylinder{
height 2.0
radius 1.5
}
}

Construccion de Formas Primitivas:


Las formas (Shapes) son los elementos que nos permiten visualizar los objetos en los
mundos VRML. La sintaxis del nodo Shape es la siguiente:
Shape{
appearance ...
geometry ...
}

El campo appearance especifica las propiedades en cuanto a textura, material, etc del
objeto que se describe en el campo geometry. Hablamos de formas primitivas cuando
Shape utiliza nodos geométricos primitivos para construir una figura. Los nodos
geométricos primitivos son los siguientes:
• Box (Caja) • Cylinder (Cilindro)
• Cone (Cono) • Sphere (Esfera)

Mediante la combinación de estas formas geométricas básicas se pueden obtener


otras formas de mayor complejidad.
Nodo primitivo Box:
Sintaxis:
Ejemplo:
Box{ Box{
size anchura altura profundidad size 2.0 0.5 3.0
} }

101
UNIVERSIDAD PRIVADA TELESUP

Las dimensiones que se manejan en VRML son dimensiones abstractas pero lo


normal es suponer que la unidad de medida es el metro. De esta forma, en el
ejemplo anterior estaríamos definiendo una caja de 2 metros de ancho, 0.5 metros de
alto y 3 metros de profundidad.
NODO PRIMITIVO CONE:
Sintaxis:
Cone{
height altura
bottomRadius radio_de_la_base
bottom valor_lógico
side valor_lógico
}

Mediante los campos bottom y side se indica si se desea dibujar la base y la


superfice lateral respectivamente. Por defecto estos campos toman el valor TRUE, lo
cual indica que se dibuja el cono completo.
Ejemplo:
Cone{
height 3.0
bottomRadius .75
}

NODO PRIMITIVO CYLINDER:


Sintaxis:
Cylinder{
height altura
radius radio
bottom valor_lógico
side valor_lógico
top valor_lógico
}

102
UNIVERSIDAD PRIVADA TELESUP

Mediante los campos bottom, side y top se indica si se desea dibujar la base
inferior,la superfice lateral y la base superior del cilindro. Por defecto estos campos
toman el valor TRUE, lo cual indica que se dibuja el cilindro completo.
Ejemplo:
Cylinder{
height 2.0
radius 1.5
}

NODO PRIMITIVO SPHERE:


Sintaxis: Ejemplo:
Sphere{ Sphere{
radius radio radius 1.0
} }

Sin embargo, la definición de un nodo primitivo implica la definición de un objeto, pero


no su visualización. Es por ello por lo que se han de englobar dentro de un nodo
Shape, el cual determina la apariencia de estos objetos.
Ejemplo:
#VRML V2.0 utf8
Shape{
appearance Appearance{
material Material {}
}
geometry Cylinder{
height 2.0
radius 1.5 }
}

103
UNIVERSIDAD PRIVADA TELESUP

Construcción TEMA 2
de Formas
de Texto
Competencia:
Conocer el proceso de construcción de formas
de texto usando los comandos adecuados.

104
UNIVERSIDAD PRIVADA TELESUP

Tema 02: Construcción de Formas de Texto

En los mundos virtuales será a menudo necesario utilizar textos para guiar al visitante
Para ello existe un nodo específico, el nodo Text. Una de las principales
características de los textos es que son planos, es decir, no tienen profundidad.
NODO TEXT: Como en cualquier procesador de textos, se nos permitirá indicar el
tipo de fuente, su estilo, su tamaño, el espaciado entre caracteres, justificación de los
párrafos, etc.

Sintaxis:
Text {
string ["linea_texto 1",
"linea_texto 2",
.
.
.
"linea_texto N",]
fontStyle FontStyle {
family "Nombre_Fuente",
style "Estilo_Fuente",
size Tamaño_Fuente
spacing espaciado_entre_caracteres
justify "justificación_del_texto"
}
}

Como se puede apreciar el nodo Text posee dos


campos:
string: Aquí se introduce el texto que se desea
visualizar.
fontStyle: Este segundo campo es opcional, de
forma que si se omite, el texto tendrá el estilo de la fuente por defecto.

105
UNIVERSIDAD PRIVADA TELESUP

Siempre que aparezca este campo tomará como valor el nodo llamado FontStyle.
NODO FONTSTYLE:
Sintaxis:
FontStyle {
family "Nombre_Fuente",
style "Estilo_Fuente",
size Tamaño_Fuente
spacing espaciado_entre_caracteres
justify "justificación_del_texto"
}

Los posibles valores de los campos del nodo FontStyle son los que se muestran a
continuación:
family: Determina la fuente que se va a utilizar para el texto. Se puede escoger entre
"SERIF", "SANS" o "TYPEWRITER". Obsérvese que los nombres están en
mayúsculas.
style: Se puede escoger entre "BOLD" (negrita), "ITALIC" (cursiva), "BOTH" (negrita y
cursiva) o "NONE" (tipo de letra normal).

size: Determina el tamaño de la fuente, pero en unidades VRML.


spacing: Determina la separación entre líneas, también en
unidades VRML.
justify: Determina la justificación del texto. Puede ser "BEGIN"
(Alinear a la izquierda), "MIDDLE" (centrar el texto) o "END"
(Alinear a la derecha).
Otros: Que pensados para idiomas exóticos, como el chino (escritura en vertical), el
árabe (escritura de derecha a izquierda), etc. Para la lista completa, se puede
consultar la RFC 1766.

106
UNIVERSIDAD PRIVADA TELESUP

Todos estos campos son opcionales.


Ejemplo:
Text {
string ["Esta es la primera fila de texto",
"esta es la segunda fila",
"etc."]
fontStyle FontStyle {
family "SERIF",
style "BOLD",
size 1.0
spacing 1.0
justify "BEGIN"
}
}

De igual forma que con los nodos geométricos primitivos, mediante el nodo Text lo
único que se consigue es definir la estructura del texto, sin embargo no se puede
visualizar, ya que no hemos indicado como se ha de presentar en el mundo virtual.
Para conseguir esto, se integra en el nodo Shape, de la misma manera que se hacía
con los nodos primitivos:
Shape {
appearance ...
geometry Text { ... }
}

107
UNIVERSIDAD PRIVADA TELESUP

Una vez que el texto se encuentra en el mundo virtual se puede manipular como
cualquier otro objeto (girándolo, etc.), ya que lo único que lo diferencia de los nodos
primitivos es que posee dos dimensiones en lugar de tres.

Ejemplo:
#VRML V2.0 utf8
Shape{
appearance Appearance{
material Material {}
}
geometry Text {
string ["Esta es la primera fila de texto",
"esta es la segunda fila",
"etc."]

fontStyle FontStyle {
family "SERIF",
style "BOLD",
size 1.0
spacing 1.0
justify "BEGIN"
}
}
}

A este archivo podríamos darle el nombre de "texto.wrl".

108
UNIVERSIDAD PRIVADA TELESUP

Nodos TEMA 3
de
Agrupación
Competencia:
Aplicar los diversos nodos que nos permitan
agrupar objetos y construirlos de manera
más compleja.

109
UNIVERSIDAD PRIVADA TELESUP

Tema 03: Nodos de Agrupación

Hasta ahora hemos visto los objetos aisladamente. Veamos ahora cómo podemos
agruparlos para conseguir formas más complejas. Existen diversos nodos que nos
permiten agrupar objetos:
Nodo Group
Nodo Transform
Nodo Switch
Nodo Billboard

NODO GROUP:
El nodo Group permite unir un conjunto de nodos de forma que actúen como una
entidad única, pero sin efectuar ninguna transformación en ellos. La principal
característica de este tipo de grupo es que los objetos son creados todos en el mismo
punto (en el centro del escenario de realidad virtual).
Sintaxis:
Group {
children [ ... ]
}

El campo children contiene la lista de los objetos que se quieren agrupar,


representados por sus nodos Shape respectivos:
Ejemplo:
Group {
children [
Shape { ... },
Shape { ... },
...
]
}

110
UNIVERSIDAD PRIVADA TELESUP

Ejemplo:
#VRML V2.0 utf8
#Ejemplo de agrupación de una caja y un cono
Group {
children [
#Aquí empieza la caja:
Shape {
appearance Appearance {
material Material { } }

geometry Box {
size 2.0 0.5 3.0
}
},
#Aquí empieza el cono:
Shape {
appearance Appearance {
material Material { }
}
geometry Cone {
height 3.0
bottomRadius 0.75
}
}
]
}

El archivo asociado a este ejemplo es "group.wrl"

111
UNIVERSIDAD PRIVADA TELESUP

NODO TRANSFORM: Por defecto todos los objetos (Shapes) se construyen en el


centro del escenario virtual. El nodo transform nos va a permitir evitar esto, indicando
la posición, orientación y tamaño de los diferentes objetos que va a crear.
Sintaxis:
Transform{
translation Eje_X Eje_Y Eje_Z
rotation Eje_X Eje_Y Eje_Z Ángulo
scale Eje_X Eje_Y Eje_Z
children[...]
}

Cada grupo creado mediante el nodo Transform va a poseer su propio sistema de


coordenadas, cuyos atributos se determinan a través de los Campos de translation,
rotation y scale, los cuales son optativos. El campo translation permite indicar la
posición del origen del nuevo sistema de coordenadas perteneciente al grupo dentro
del sistema de coordenadas de nodo que lo engloba (nodo padre). A través del
siguiente ejemplo esta idea quedará más clara:
Ejemplo:
Transform{
# Ejes: X Y Z
translation 2.0 0.0 0.0
children [...]
}

Mediante este ejemplo se consigue que el grupo creado tenga un sistema de


coordenadas idéntico a sistema de coordenadas principal, con la única salvedad de
que su origen se encontraría desplazado dos unidades sobre el eje X del sistema
principal. También es posible apreciar en este ejemplo que sólo se han de contemplar
los campos que interesen, ignorándose el resto.

112
UNIVERSIDAD PRIVADA TELESUP

Gráficamente los pasos serían los siguientes:


I) Partimos del sistema de coordenadas del nodo
padre:

II) Realizamos la translación del sistema de coordenadas del grupo:

Un ejemplo sería el siguiente:


El campo rotation nos permite girar el sistema de
coordenadas del grupo alrededor de uno de los
ejes del sistema de coordenadas del nodo padre.
Para ello, además de indicar sobre que eje se
desea realizar el giro, se ha de hacer referencia al
grado de inclinación de dicho giro (en radianes).

Ejemplo:
Transform{
# Ejes: X Y Z Ángulo
rotation 0.0 0.0 1.0 0.52
children [...]
}

113
UNIVERSIDAD PRIVADA TELESUP

Con este ejemplo se pretende hacer girar el sistema de coordenadas del grupo sobre
el eje Z 0.52 radianes. Nótese que solamente uno de los ejes puede tomar un valor
(que ha de ser forzosamente la unidad) mientras el resto ha de permanecer a cero. De
esta forma sólo hay tres combinaciones posibles con las que rellenar los ejes del
campo rotation:
Rotación sobre el eje X 1.0 0.0 0.0
Rotación sobre el eje Y 0.0 1.0 0.0
Rotación sobre el eje Z 0.0 0.0 1.0

Gráficamente los pasos serían los siguientes:


I) Partimos del sistema de coordenadas del nodo padre:

II) Realizamos la rotación del sistema de coordenadas del


grupo:

Un ejemplo sería el siguiente:


A través del campo scale podemos aumentar o reducir el
tamaño de los ejes del sistema de coordenadas del grupo
utilizando factores de escala que toman como referencia los
ejes de coordenadas del sistema del nodo padre. De esta
forma aumentamos o disminuimos el tamaño de los objetos
que se crean.

114
UNIVERSIDAD PRIVADA TELESUP

Ejemplo:
Transform{
# Ejes: X Y Z
scale 0.5 0.5 0.5
children [...]
}
El ejemplo anterior hace que los ejes del sistema de coordenadas del grupo sean
un50% (0.5) más pequeño que los ejes del sistema principal y por lo tanto el objeto
diseñado en estos ejes reducirá su tamaño a la mitad. Si se hubiese querido que
fuesen el doble de grandes, el ejemplo hubiese sido el siguiente:

Ejemplo:
Transform{
# Ejes: X Y Z
scale 2 2 2
children [...]
}

Gráficamente los pasos serían los siguientes:


I) Partimos del sistema de coordenadas del nodo padre:

II) Realizamos la translación del sistema de


coordenadas del grupo:

115
UNIVERSIDAD PRIVADA TELESUP

Un ejemplo sería el siguiente:

Por último, se muestra un ejemplo en el que se unen las diferentes modificaciones


sobre el sistema de coordenadas de un grupo:
Ejemplo:
Transform{
# Ejes: X Y Z Ángulo
translation 2.0 0.0 0.0
rotation 0.0 0.0 1.0 0.52
scale 0.5 0.5 0.5
children [...]
}

Gráficamente si se realizasen estas tres operaciones sobre un cilindro obtendríamos


los siguientes:

116
UNIVERSIDAD PRIVADA TELESUP

Más TEMA 4
Nodos

Competencia:
Emplear los diferentes nodos de agrupación
en aplicaciones de realidad virtual.

117
UNIVERSIDAD PRIVADA TELESUP

Tema 04: Más Nodos

NODO SWITCH:
La principal característica de un nodo Switch es la de mostrar únicamente uno de los
nodos hijos del nodo, el cual ha debido ser seleccionado previamente. Se pueden
utilizar para conectar o desconectar los efectos de una determinada propiedad o para
alternar entre propiedades diferentes. El campo whichChild específica el hijo choice
que se va activar, siendo el 0 el del primer hijo. Su valor por defecto es -1, lo cual
indica que ninguno de los hijos está seleccionado. El campo whichChild es una
entrada y por lo tanto puede ser modificado por otro nodo.

Sintaxis:
Switch{
whichChoice 0
choice[...]
...
choice[...]
}

NODO BILLBOARD:
El nodo Billboard permite crear un grupo con un sistema de coordenadas especiales,
ya que a través del campo axisOfRotation (eje de rotación) indicamos el eje sobre el
que va de girar el objeto, de forma que, siempre esté de cara al espectador:

118
UNIVERSIDAD PRIVADA TELESUP

Todos los hijos agrupados mediante este nodo serán visualizados.


Sintaxis:
Billboard{
axisOfRotation Eje_X Eje_Y Eje_Z
children[...]
}
Al igual que para el campo rotate del nodo transform, únicamente uno de los ejes
puede tomar como valor la unidad, permaneciendo el resto a cero:
Rotación sobre el eje X 1.0 0.0 0.0
Rotación sobre el eje Y 0.0 1.0 0.0
Rotación sobre el eje Z 0.0 0.0 1.0

Un ejemplo completo se encuentra en el archivo "robobill.wrl".


Poniendo nombres propios a los nodos:
Hay una solución prevista para simplificar las repeticiones de objetos dentro de un
escenario virtual. Esta solución consiste en asignar un nombre arbitrario al nodo que
se piensa repetir en el código. Supongamos, por ejemplo, que se van a utilizar
repetidamente en un escenario unos cilindros exactamente iguales (que podrían ser
las columnas de una casa).Dichos cilindros tendrán el siguiente código:

Shape {
appearance Appearance {
material Material { }
}
geometry Cylinder {
height 2.0
radius 0.5
}
}

119
UNIVERSIDAD PRIVADA TELESUP

(Este es el código de un cilindro con la apariencia por defecto, de 2 unidades de alto y


una base de radio 0.5) Se puede definir, para el ámbito de un documento VRML, que
este tipo de cilindro tenga un nombre arbitrario, por ejemplo ColumnaRepetida (o como
se desee, con tal de que comience por mayúscula), de la siguiente manera:

DEF ColumnaRepetida Shape {


appearance Appearance {
material Material { }
}
geometry Cylinder {
height 2.0
radius 0.5
}
}

Entonces, cada vez que se quiera usar este nodo en otra parte del documento, basta
con poner lo siguiente: En el ejemplo anterior de la caja y el cono, aparece el nodo
Appearance repetido. Vamos a definirlo, en la primera ocasión que se utiliza con el
nombre, "PorDefecto" y la segunda vez que se usa lo invocaremos mediante el
comando USE:
#VRML V2.0 utf8 size 2.0 0.5 3.0
#Ejemplo de agrupación de una caja y }
un cono, },
#haciendo uso de los comandos DEF y Shape {
USE. appearance USE PorDefecto
Group { geometry Cone {
children [ height 3.0
Shape { bottomRadius 0.75
appearance DEF PorDefecto }
Appearance { }
material Material { } ]
} }
geometry Box {

En este caso concreto, la simplificación no ha sido muy grande (sólo un par de líneas
menos de código), pero ha servido para ilustrar el concepto.

120
UNIVERSIDAD PRIVADA TELESUP
Lecturas Recomendadas
❖ GUÍA DE USUARIO DEL VISUALIZADOR VRML “CORTONA 3D”
http://www.ehu.es/docarq/LDA/publicaciones/vrml.pdf

❖ TUTORIAL VRML
http://www.cse.iitm.ac.in/~vplab/tutorial_vrml.pdf

Actividades y Ejercicios

1. En un documento en Word realice un manual sobre el uso de


CORTONA 3D.
Envíalo a través de "CORTONA 3D".

2. Elabore una aplicación en HTML y VRML. Presentando su


debida codificación.
Envíalo a través de "Lenguajes de Programación".

121
UNIVERSIDAD PRIVADA TELESUP
Autoevaluación
1) Es posible visualizar archivos VRML mediante:
a. Plug-ins en visualizadores HTML 1
b. Ventanas en VRML
c. Pantallas VRML
d. Lenguajes VRML y JAVA
e. X3D y Applets

2) ¿Cuál es la extensión de los archivos de texto para crear mundos de realidad


virtual?
a. .jar
b. .jav
c. .wrl
d. .swf
e. .vrml

3) ¿Cuáles son los elementos que compone todo documento VRML?


a. Cabecera, Cuerpo y Salida.
b. Cabecera, Inicio y Final.
c. Cabecera, Comentarios y Nodos.
d. Inicio, Procedimientos y Final.
e. Cabecera, Procedimientos y Final.

4) Es la estructura mínima indivisible de un archivo VRML:


a. Cabecera.
b. Comentarios.
c. Clase.
d. Objeto.
e. Nodo.

5) ¿Cuál es el nodo que permite indicar el tipo de fuente, su estilo, su tamaño y


otras características de una fuente?
a. Noto fuente.
b. Nodo grafico.
c. Nodo estilo
d. Nodo size.
e. Nodo text.

122
UNIVERSIDAD PRIVADA TELESUP

6) Es un nodo que permiten crear un grupo con un sistema de coordenadas


especiales:
a. Nodo Billboard.
b. Nodo Ungroup.
c. Nodo Translate.
d. Nodo change.
e. Nodo Board.

7) ¿Cuál es el nodo que indica la posición, orientación y tamaño de los


diferentes objetos que se crean?
a. El nodo group.
b. El nodo billaboard.
c. El nodo Board.
d. El nodo transform.
e. El noto Text.

8) Permite aumentar o reducir el tamaño de los ejes del sistema de coordenadas


del grupo:
a. El nodo zoom.
b. El objeto escala.
c. El campo scale.
d. El botón zoom.
e. El nodo group.

9) La principal característica de un nodo Switch es la de mostrar únicamente:


a. Cualquiera de los nodos de agrupación.
b. Es cambiar de entorno.
c. Uno de los nodos hijos del nodo.
d. Modificar uno de los nodos de agrupación.
e. Borrar los nodos de agrupación.

10) ¿Cuál es el nodo que permite crear un grupo con un sistema de coordenadas
especiales, sobre el que va de girar un objeto?
a. El nodo billaboard.
b. El nodo transform.
c. El nodo group.
d. El nodo Board.
e. El noto Text.

123
UNIVERSIDAD PRIVADA TELESUP
Resumen
UNIDAD DE APRENDIZAJE III:

Es posible visualizar archivos VRML mediante dos tipos de aplicaciones diferentes:


Mediante visualizadores VRML específicos y mediante plug-ins instalado en
visualizadores HTML. Para crear estos mundos de realidad virtual se utilizan archivos
de texto, cuya extensión será siempre .wrl. Todo documento VRML está compuesto por
los siguientes elementos: Cabecera, Comentarios y Nodos. Un nodo es la estructura
mínima indivisible de un archivo VRML y tiene como misión la de definir las
características de un objeto o bien las relaciones entre distintos objetos.

El nodo text, como en cualquier procesador de textos, se nos permitirá indicar el tipo de
fuente, su estilo, su tamaño, el espaciado entre caracteres, justificación de los párrafos,
etc. El nodo Text posee dos campos: string y fontStyle. De igual forma que con los
nodos geométricos primitivos, mediante el nodo Text lo único que se consigue es definir
la estructura del texto, sin embargo no se puede visualizar, ya que no hemos indicado
como se ha de presentar en el mundo virtual.

Los nodos que permiten agrupar objetos: Nodo Group, Nodo Transform, Nodo Switch
y Nodo Billboard. El nodo Group permite unir un conjunto de nodos de forma que actúen
como una entidad única. Por defecto todos los objetos (Shapes) se construyen en el
centro del escenario virtual.

La principal característica de un nodo Switch es la de mostrar únicamente uno de los


nodos hijos del nodo, el cual ha debido ser seleccionado previamente. El nodo Billboard
permite crear un grupo con un sistema de coordenadas especiales, ya que a través del
campo axisOfRotation (eje de rotación) indicamos el eje sobre el que va de girar el
objeto.

124
UNIVERSIDAD PRIVADA TELESUP

125
UNIVERSIDAD PRIVADA TELESUP
Introducción
a) Presentación y contextualización:

Los temas que se tratan en la presente unidad temática, tienen por finalidad que el
estudiante se perfeccione en el uso del código VRM llevando a desarrollar su
imaginación y destreza en un mundo virtual.

b) Competencia:
Desarrolla aplicaciones usando lenguaje VRML con otros lenguajes
llevándolos al mundo virtual.

c) Capacidades:

1. Conoce las herramientas de color de objetos a partir de códigos RGB para la


programación en VRML.
2. Aplica nodos para crear rejillas o cuadriculas para modelar superficies.
3. Reconoce el uso de los nodos de niebla o fenómenos atmosféricos a un entorno
gráfico
4. Emplea diferentes técnicas de modelados en 3D para mundos virtuales.

d) Actitudes:

✓ Presenta actitud investigadora para ampliar sus conocimientos relacionadas con


la propagación VRML.
✓ Fomenta la participación para el desarrollo de los mundos virtuales en 3D..

e) Presentación de ideas básicas y contenidos esenciales de la unidad:

La Unidad de Aprendizaje 04: VRML (Continuación), comprende el desarrollo de


los siguientes temas:

TEMA 01: El Color de los Objetos.


TEMA 02: Utilización de Rejillas de Elevación.
TEMA 03: Utilización de Niebla.
TEMA 04: Mundos Virtuales en 3D.

126
UNIVERSIDAD PRIVADA TELESUP

El Color TEMA 1
de los
Objetos
Competencia:
Conocer las herramientas de color de objetos
a partir de códigos RGB para la
programación en VRML.

127
UNIVERSIDAD PRIVADA TELESUP
Desarrollo de los Temas

Tema 01: El Color de los Objetos

Anteriormente se ha comentado que el nodo Shape contenía dos campos, appearance


y geometry, de los cuales el segundo indicaba el tipo de objeto a representar y del que
se ha hablado ya ampliamente. Sin embargo la misión del campo appearance apenas
se ha comentado, por lo que procederemos a analizarla con más detalle en este punto.
El campo appearance va a permitir seleccionar
el color y la textura del objeto que va a ser
representado dentro del escenario virtual.
Este campo toma como valor un nodo de
tipo Appearance, el cual a su vez, posee un
campo denominado material que toma como
valor un nodo de tipo Material.

El nodo Material es el que controla las propiedades del color (selección del color, del
brillo, del grado de transparencia, etc.) que se van a dar al objeto. Los colores que se
le dan a los objetos son colores RGB, es decir, vienen dados por tres valores en
coma flotante, cada uno de los cuales representa uno de los colores primarios (Red,
Green, Blue) [Rojo, Verde y Azul]. El valor 0.0 representa la ausencia de color y el 1.0
la máxima intensidad.

Muchos programas de dibujo darán un valor para


cada color RGB en un formato 256x256x256.
Para poder utilizar estos colores en VRML es
preciso convertirlos, dividiendo cada valor por
256 y colocando el resultado en su campo
correspondiente dentro del nodo Material.

128
UNIVERSIDAD PRIVADA TELESUP

NODO MATERIAL:
Con este nodo vamos a determinar el color y grado de transparecia de los objetos.
Sintaxis:
Shape{
appearance Appearance{
material Material{
diffuseColor color_RGB
emissiveColor color_RGB
specularColor color_RGB
ambientIntensity valor
transparency valor
shininess valor
}
}
geometry ...
}

Cada uno de los seis campos del nodo Material tiene su propio efecto específico sobre
un objeto. Todos son opcionales.
diffuseColor: El campo diffuseColor representa lo que la mayoría de los usuarios
llamarían como el color del objeto.
emissiveColor: El campo emissiveColor se utiliza para fijar el color del brillo del
objeto, cuando dicho objeto necesite ser visible en la oscuridad. De esta forma se
consigue un efecto en donde la figura representada parece iluminada desde el interior
mediante una luz de un determinado color.

La configuración por defecto de este campo es el negro, ya que la mayoría de los


objetos normalmente no brillan.
specularColor: El campo specularColor es un parámetro avanzado que permite
indicar qué color de luz refleja el objeto. Por ejemplo, una cama roja no refleja un color
rojo, pero una olla rojiza si puede reflejar su color.

129
UNIVERSIDAD PRIVADA TELESUP

ambientIntensity: Este campo es otro parámetro avanzado que indica la cantidad de


luz ambiental (producida por los diferentes focos de luz del escenario virtual) es
reflejada por el objeto. Toma valores en coma flotante entre 0.0 y 1.0.
shininess: El campo shininess controlan el brillo de un objeto. Toma valores en coma
flotante entre 0.0 y 1.0.

transparency: El campo transparency indica el


nivel de transparencia del objeto. Toma
valores en coma flotante entre 0.0 y 1.0,
siendo el 1.0 el nivel máximo de transparencia
(objeto invisible) y el 0.0 el nivel mínimo
(objeto totalmente opaco).
El valor por defecto es el 0.0.
Los archivos "colores1.wrl" y "colores2.wrl" contienen ejemplos completos sobre como
cambiar el aspecto de los objetos.

Objetos Almacenados en archivos


Para facilitar el diseño de mundos virtuales habrá ocasiones en
las que convendrá almacenar cada objeto en su propio
archivo. De este modo, si por ejemplo se deseara modelar
una habitación, los diferentes elementos que van a
aparecer dentro de ella: paredes, puertas, mesas, sillas,
etc, son objetos independientes entre si pero que se
engloban dentro de un mismo espacio y, que además, pueden
aparecer varias veces en el diseño de todo mundo virtual. Es por ello por lo que sería
de interés crear un archivo donde almacenar el objeto mesa ("mesa.wrl"), otro archivo
para el objeto silla ("silla.wrl"),etc.
En el archivo "comedor.wrl" se realizan llamadas tanto al archivo que contiene la silla
como al que contiene la mesa.

130
UNIVERSIDAD PRIVADA TELESUP

Nodo Inline: El nodo Inline va a permitir crear un grupo en donde los hijos,
almacenados en distintos archivos VRML, son recuperados indicando su dirección
URL.
Sintaxis:
Inline{
url"dirección_url"
}

Ejemplo:
...
Inline{
url"mesa.wrl"
},
...
Transform{
translation ...
children [
Inline{url"silla.wrl"}
]
}
...

ADICIÓN DE ENLACES EN EL MUNDO VIRTUAL


Nodo Anchor: El nodo Anchor crea un grupo especial ya que seleccionando
cualquier objeto perteneciente a dicho grupo se salta hacia otro lugar del escenario
virtual o hacia otro mundo virtual almacenado en un archivo VRML (al cual accedemos
a través de su dirección URL). Cualquier objeto o grupo de objetos se puede convertir
en un enlace. Estos enlaces son los equivalentes en el mundo tridimensional a los
enlaces existentes en las páginas Web realizadas mediante HTML. Además, todo
nodo Anchor posee un campo denominado description en el que mediante una cadena
de texto se describe brevemente el objeto.

131
UNIVERSIDAD PRIVADA TELESUP

Sintaxis: Ejemplo:
Anchor{ Anchor{
url"dirección_URL" url"escalera.wrl"
description "descripción_del_enlace" description "Escaleras Flotantes"
children[...] children[...]
} }

En el archivo "enlace.wrl" se muestra como crear un enlace, el cual va a tener forma


de escalera.

CONSTRUCCIÓN DE FORMA COMPLEJA


Se ha visto en temas anteriores como mediante la superposición y unión de diferentes
nodos geométricos básicos es posible construir objetos más complejos. Sin embargo,
si la única manera de generar formas complejas fuese ésta, la construcción de
mundos virtuales será bastante ardua. Es por ello por lo que aparecen una serie de
nuevos nodos, los cuales, además de facilitar el diseño (al tener más control sobre
ellos y al ser más flexibles), generan mundos VRML de una forma más eficiente.

Lo más recomendable a la hora de diseñar un objeto es describir su geometría en dos


pasos aislados:
• Especificación de las coordenadas.
• Creación de la forma geométrica.

Especificación de las coordenadas:


En este paso se ha de indicar mediante el nodo Coordinate la posición de los puntos
que se van a utilizar para construir el objeto. Estos puntos no son visibles en el
escenario virtual.

132
UNIVERSIDAD PRIVADA TELESUP

NODO COORDINATE:
Sintaxis:
Coordinate {
point [
Eje_x Eje_Y Eje_Z,
Eje_x Eje_Y Eje_Z,
...
Eje_x Eje_Y Eje_Z
]
}

El campo point puede poseer varios puntos, cuyas coordenadas están separadas por
comas.
Ejemplo:
Coordinate {
point [
12.0 11.0 17.1,
20.5 13.8 5.3,
14.0 6.1 22.9
]
}

Creación de la forma geométrica:


Una vez definidos los puntos que forman el esqueleto del objeto, se han de conectar.
Existen tres maneras de unir estos puntos, cada una de las cuales está asociada a un
nodo diferente:
• Nodo PointSet
• Nodo IndexedLineSet
• Nodo IndexedFaceSet
Estos tres nodos poseen un campo denominado coord que acepta como valor un
nodo Coordinate.
Nodo PointSet:
Representa un conjunto de puntos situados en las coordenadas indicadas dentro del
sistema de coordenadas del nodo padre.

133
UNIVERSIDAD PRIVADA TELESUP

Sintaxis:
PointSet {
coord Coordinate {
point [ . . . ]
}
color Color {
color [ . . . ]
}
} "puntos.wrl"

El campo coord toma como valor un nodo de tipo Coordinate, el cual define los
puntos que se desean representar.
El campo color sirve para definir el color de cada uno de los puntos. Este campo toma
como valor un nodo Color, que a su vez contiene un campo de tipo color de nuevo.
Este último campo describe una lista de colores RGB, de forma que el primer color
corresponde al primer punto descrito por el nodo Coordinate del campo coord; el
segundo color corresponde al segundo punto y así sucesivamente.

Ejemplo:
PointSet { color Color {
coord Coordinate { color [
point [ 1.0 0.0 0.0, # 1º punto rojo
12.0 11.0 17.1, #1º punto 0.0 1.0 1.0, # 2º punto verde
20.5 13.8 5.3, #2º punto 1.0 1.0 0.0 # 3º punto amarillo
14.0 6.1 22.9 #3º punto ]
] }
} }

Si se incluyese este código, tal como está, en un documento VRML, no podríamos ver
ninguno de estos puntos, ya que como se ha visto anteriormente, para crear un objeto
visible se debe utilizar el nodo Shape. Obsérvese que se ha prescindido del campo
appearance del nodo Shape ya que no es necesario, pues los puntos no van a tener la
apariencia por defecto, sino la que se determina en el campo color.

134
UNIVERSIDAD PRIVADA TELESUP

Ejemplo:
#VRML V2.0 utf8 }
#Ejemplo de un grupo de tres puntos color Color {
con colores color [
Shape { 1.0 0.0 0.0, # 1º punto rojo
geometry PointSet { 0.0 1.0 1.0, # 2º punto verde
coord Coordinate { 1.0 1.0 0.0 # 3º punto amarillo
point [ ]
12.0 11.0 17.1, #1º punto }
20.5 13.8 5.3, #2º punto }
14.0 6.1 22.9 #3º punto }
]

NODO IndexedLineSet:
Permite unir los diferentes puntos especificados en su campo coord mediante líneas
poligonales.
Sintaxis:
IndexedLineSet{
coord Coordinate {
point [ . . . ]
}
coordIndex [...]
colorPerVertex valor_lógico
color Color {
color [ . . . ]
}
colorIndex [...]
} "lineas.wlr"

El campo coord toma como valor un nodo de tipo Coordinate, el cual define los
puntos que sirven como esqueleto de la figura.
El campo coordIndex se utiliza para especificar entre qué puntos se han de trazar las
líneas. Una línea puede ser trazada utilizando más de dos puntos, de forma que se
dibuja una línea entre el primer y el segundo punto, otra entre el segundo y el tercer
punto, y así sucesivamente. Un índice con valor -1 indica que ha finalizado la línea
actual y que comienza la siguiente.

135
UNIVERSIDAD PRIVADA TELESUP

Para indicar el primer punto definido en el nodo Coordinate se utiliza el 0, para el


segundo el 1 y así sucesivamente.

El campo colorPerVertex indica cómo se han de aplicar los colores sobre las líneas:
colorPerVertex colorIndex Acción
FALSE VACIO Se aplican en orden los colores descritos en el nodo Color a cada una
(Los colores de las líneas descritas en coordIndex. Deben existir al menos tantos
se aplican colores en el nodo Color como líneas haya en coorIndex.
sobre las NO VACIO Este campo contiene una lista ordenada de números, los cuales
líneas) representan a los colores definidos en el nodo Color. De esta forma,
el 0 representará al primer color definido en el nodo Color, el 1 al
segundo,etc.
Se hace corresponder cada elemento de la lista con una de las líneas
descritas en coordIndex.
Si el mayor valor que admite el campo colorIndex es N, entonces
deben existir en el nodo Color N+1 colores definidos.
Ejemplo:
colorIndex[4,0,3,2]
De esta manera se asigna a la primera línea de coordIndex el tercer
color del nodo Color, a la segunda línea el primer color,etc.
TRUE VACIO Se utiliza el campo coordIndex para elegir los colores definidos en el
(Los colores nodo Color. Si el mayor valor que admite el campo coordIndex es N,
se entonces deben existir en el nodo Color N+1colores definidos.
aplicansobre NO VACIO Se aplican los colores a cada vértice. Este campo va a tener ahora la
los vertices) misma estructura que el campo coordIndex, por lo que ha de contener
al menos tantos índices como este último. También ha de poseer los
indicadores de fin de línea (-1) en los mismos sitios que el campo
coordIndex. Si el mayor valor que admite el campo colorIndex es N,
entonces deben existir en el nodo Color N+1colores definidos.

NODO IndexedFaceSet:
Permite unir los diferentes puntos especificados en su campo coord mediante caras
poligonales.
Sintaxis:
IndexedFaceSet{
coord Coordinate {
point [ . . . ]
}
coordIndex [...]
colorPerVertex valor_lógico
color Color {
color [ . . . ]
}
colorIndex [...]
}

136
UNIVERSIDAD PRIVADA TELESUP

El campo coord toma como valor un nodo de tipo Coordinate, el cual define los
puntos que sirven como esqueleto de la figura.
Utiliza los índices de su campo coorIndex para especificar las caras poligonales. Un
índice con valor -1 indica que ha finalizado la cara actual y comienza la siguiente.

El campo colorPerVertex indica como se han de aplicar los colores:

colorPerVertex colorIndex Acción


FALSE (Los colores VACIO Los colores se aplican en el orden en el que se han definido dentro del
se aplican sobre las nodo Color. Deben existir al menos tantos colores como caras.
caras) NO VACIO Los colores se aplican en el orden indicado por el campo colorIndex.
Deben existir al menos tantos índices en este campo como caras se han
definido. Si el mayor valor que admite el campo colorIndex es N, entonces
deben existir en el nodo Color N+1 colores definidos.
TRUE (Los colores se VACIO Se utiliza el campo coordIndex para elegir los colores definidos en el nodo
aplican sobre los Color. Si el mayor valor que admite el campo coordIndex es N, entonces
vértices) deben existir en el nodo Color N+1 colores definidos.
NO VACIO Se aplican los colores a cada vértice. Este campo va a tener ahora la
misma estructura que el campo coordIndex, por lo que ha de contener al
menos tantos índices como este último. También ha de poseer los
indicadores de fin de línea (-1) en los mismos sitios que el campo
coordIndex. Si el mayor valor que admite el campo colorIndex es N,
entonces deben existir en el nodo Color N+1 colores definidos.

A continuación se muestra un ejemplo de cómo


se colorea una figura utilizando sus caras:

Ahora el ejemplo trata de cómo se colorea una figura


utilizando sus vértices:

137
UNIVERSIDAD PRIVADA TELESUP

Utilización TEMA 2
de Rejillas
de Elevación
Competencia:
Aplicar nodos para crear rejillas o
cuadriculas para modelar superficies.

138
UNIVERSIDAD PRIVADA TELESUP

Tema 02: Utilización de Rejillas de Elevación

NODO ElevationGrid:
Este nodo crea una cuadrícula rectangular con alturas variables, lo que la hace
especialmente útil para modelar el terreno y para la creación de otras superficies en el
espacio.
Sintaxis:
ElevationGrid{
xDimension número_de_columnas(Eje_X)
xSpacing valor_real
zDimension número_de_filas(Eje_Z)
zSpacing valor_real
height [altura1, altura2,...,altura(numcolum x numfilas)]
color Color[...]
colorPerVertext
}

Los campos xDimension y zDimension especifican


el número de puntos de la cuadrícula en las
direcciones X y Z, definiendo una superficie que
contiene un número de rectángulos igual a
(xDimension-1)*(zDimension-1).
Los campos xSpacing y zSpacing determinan la
distancia entre los puntos de la cuadrícula en el eje X y en el eje Z respectivamente.

El campo height consiste en una ordenación de valores escalares que representan la


altura de cada vértice sobre la cuadrícula. Los valores se almacenan de modo que la
fila 0 es la primera, la fila 1 la segunda, etc. Dentro de cada fila, los valores de altura
se almacenan de modo que la columna 0 es la primera, la 1 la segunda, etc.

139
UNIVERSIDAD PRIVADA TELESUP

El campo colorPerVertex indica cómo se han de aplicar los colores:


colorPerVertex
Acción
FALSE: Los colores se aplican sobre las cuadrículas de la rejilla. Se han de definir en
el nodo Colors al menos ((xDimension-1)*(zDimension-1)) colores.
TRUE: Los colores se aplican sobre los vértices de la rejilla. Se han de definir en el
nodo Colors al menos (xDimension*zDimension) colores.

UTILIZACIÓN DE TEXTURAS
La textura es la posibilidad que tenemos de envolver un objeto con una imagen
determinada que se encuentra almacenada en un archivo, al cual accedemos
mediante su URL. Los tipos de imagen que soporta VRML son:
JPEG
GIF
PNG

Hasta ahora, para definir un objeto visible se ha utilizado el nodo Shape de la siguiente
forma:
Shape {
appearance Appearance {
material ...
}
geometry ...
}

140
UNIVERSIDAD PRIVADA TELESUP

En donde el nodo Appearance tiene un solo campo, material, con el que se definen el
color y la transparencia, según se ha visto en temas anteriores.
Pero en realidad puede tener también otros dos campos: texture (cuyo valor suele ser
un nodo de tipo ImageTexture o de tipo MovieTexture) ytextureTransform, con los que
se define la textura de los objetos:
Shape {
appearance Appearance {
material ...
texture ImageTexture{...}
textureTransform {...}
}
geometry ...
}

NODO ImageTexture:
Sintaxis:
ImageTexture{
url "direccion_URL"
repeatS valor_lógico
repeatT valor_lógico
}

El campo url contiene la dirección URL del archivo gráfico que se va a usar como
textura. Los formatos gráficos que admite VRML son jpeg,gif y png.
Las texturas definen un conjunto de coordenadas 2D (Ejes S y T) que se emplean para
trazar texturas sobre la superficie de los objetos. Las coordenadas de textura van de 0
a 1.
La coordenada horizontal se denominada S y la coordenada vertical T. El lado inferior
de la imágen se corresponde con el eje S y el lado izquierdo con el eje T. La esquina
inferior izquierda de la imagen, según este sistema de coordenadas, vendría dada por
el punto (S=0,T=0) y la esquina superior derecha por (S=1,T=1).

141
UNIVERSIDAD PRIVADA TELESUP

Los campos repeatS y repeatT determinan como envuelve la textura en las direcciones
S y T. Si repeatS es TRUE, la textura se repite (cada vez que S=1) en la dirección S
hasta cubrir la superficie del objeto. Si repeatS es FALSE, la textura se adapta a toda
la superficie del objeto a lo largo de la dirección S, sin tener en cuenta el valor de las
coordenadas S y T. El campo repeatT haría lo mismo sobre el eje T.

NODO TextureTransform:
Este nodo define una transformación 2D aplicada a las coordenadas de textura. Esto
afecta a la forma en que se aplica la textura a las superficies de los objetos. La
transformación consiste (por orden) en un ajuste de la escala no uniforme sobre un
punto central arbitrario, una rotación sobre ese mismo punto y una translación. Esto
permite al usuario modificar el tamaño, orientación y posición de las texturas de los
objetos.
Sintaxis:
TextureTransform{
center Eje_S Eje_T
rotation ángulo
scale Eje_S Eje_T
translation Eje_S Eje_T
}

El campo center especifica un punto en el sistema de coordenadas de la textura (S,T)


sobre el que los campos rotation y scale van a ser aplicados. El campo rotation
determina la rotación en radianes de los ejes de coordenadas de la textura con
respecto al punto marcado por el campo center, después de haber aplicado el campo
scale. Por último, el campo translation provoca un desplazamiento del sistema de
coordenadas de la textura.
Imágenes distintas en un mismo objeto:
Puede interesar que un objeto tenga imágenes diferentes en alguna o algunas de sus
caras, para ello hemos de diseñar la figura de forma que cada una de sus caras sean
objetos independientes. Supongamos que se desea poner una determinada textura
sobre las bases de un cilindro y una textura diferente sobre la superficie lateral, los
pasos a seguir serían los siguientes:

142
UNIVERSIDAD PRIVADA TELESUP

Se define un cilindro con la textura de la base, anulando las superficies superior


e inferior. Se define otro cilindro idéntico con otra textura,anulando la superficie
lateral. Por medio del nodo Group se agrupan ambos cilindros, con lo que el resultado
es aparentemente un cilindro con imágenes distintas.
En el archivo "lata.wrl" se encuentra definido un objeto creado mediante los pasos
anteriormente mencionados.

MovieTexture: En lugar de usar imágenes estáticas como textura de los objetos, se


pueden utilizar videos (películas), en formato MPEG, haciendo uso del nodo
MovieTexture, en vez de ImageTexture.

Sintaxis: Ejemplo:
MovieTexture { Shape {
url "dirección_URL" appearance Appearance {
speed valor_real texture MovieTexture {
loop valor_lógico url "ejemplo.mpg"
repeatS valor_lógico speed 1
repeatT valor_lógico loop FALSE
} }
}
geometry ...
}

El campo url contiene la dirección URL del archivo que contiene el video.
El campo speed controla la velocidad (1, velocidad normal; 2 doble velocidad, etc.).
Con valores negativos el video se ejecutaría hacia atrás.
El campo loop controla si el video funciona ininterrumpidamente (TRUE) o una sola
vez (FALSE).
Los campos repeatS y repeatT ya se han descrito en el nodo TextureTransform.

ILUMINANDO EL MUNDO VIRTUAL


La colocación de luces en un mundo virtual permite obtener un mayor grado de
realismo, pudiendo convertir un misma escena virtual en un lugar cálido, en un lugar
tenebroso y sombrío, etc. Además de la ambientación, también juega un importante
papel a la hora de determinar que objetos visualizará el visitante con mayor claridad.

143
UNIVERSIDAD PRIVADA TELESUP

Existen tres clases de fuentes de iluminación, a cada una de las cuales se les asocia
un nodo:
✓ Nodo PointLight
✓ Nodo DirectionalLight
✓ Nodo SpotLight

NODO PointLight:
Define la posición de una luz que ilumina por igual en todas direcciones.
Sintaxis:
PointLight{
color color_RGB
location Eje_X Eje_Y Eje_Z
radius valor_real
attenuation coeficiente1 coeficiente2 coeficiente3
on valor_lógico
intensity valor_real
ambientIntensity valor_real
}

Campo Acción
color Indica el color de luz.
location Determina la posición que va a ocupar el foco de luz dentro del
escenario tridimensional.
radius Limita la zona (en metros) que va a ser iluminada.
attenuation Almacena tres valores que se utilizan para calcular la atenuación
de la luz conforme nos alejamos del foco. El factor de atenuación
viene dado por la siguiente ecuación:
1/(coef1+(coef2*radio)+ (coef3*radio*radio))
on Indica si los campos intensity y ambientIntensity están activos
(TRUE) o no (FALSE).
intensity Establece la intensidad con la que la luz brilla, siendo el valor 1 la
máxima intensidad y 0 la mínima.
ambientIntensity Determina la luminosidad del entorno del foco.

144
UNIVERSIDAD PRIVADA TELESUP

NODO DirectonialLight:
Define una fuente de luz orientable que ilumina con rayos paralelos a un determinado
vector tridimensional.
Sintaxis:
DirectionalLight{
color color_RGB
on valor_lógico
intensity valor_real
ambientIntensity valor_real
direction Eje_X Eje_Y Eje_Z
}

El campo direction contiene el vector que determina la orientación de la luz emitida


dentro del espacio virtual. El resto de campos tienen la misma misión que en el nodo
PointLight.
NODO SpotLight: Define una fuente de luz de tipo foco, que se coloca en una
posición fija del espacio tridimensional e ilumina en forma de cono a lo largo de una
dirección determinada. La intensidad de la iluminación desciende de forma
exponencial según diverge el rayo de luz desde esa dirección hacia los bordes del
cono.El régimen de descenso y el ángulo del cono se controlan mediante los campos
beamWidth y cutOffAngle.

Sintaxis:
PointLight{ intensity valor_real
color color_RGB ambientIntensity valor_real
location Eje_X Eje_Y Eje_Z direction Eje_X Eje_Y Eje_Z
radius valor_real beamWidth ángulo
attenuation coeficiente1 cutOffAngle ángulo
coeficiente2 coeficiente3 }
on valor_lógico
El campo beamWidth almacena el radio (en radianes) de la base de un cono donde la
luz emitida es uniforme y posee su máxima intensidad. Este cono tendría como base
este campo, como altura el campo radius (orientado según el campo direction) y como
vértice el punto indicado en el campo location.

145
UNIVERSIDAD PRIVADA TELESUP

El campo cutOffAngle almacena el radio (en radianes) de la base de un cono que


contiene al cono mencionado arriba. Tiene las mismas características a excepción de
su radio, el cual ha de ser mayor. Este radio determina el lugar donde la luminosidad
es nula. Entre el radio almacenado en beamWidth y el almacenado en este campo, la
intensidad de la luz va decreciendo conforme nos alejamos del primero de los conos.

UTILIZACIÓN DE FONDOS
La utilización de fondos en el mundo virtual, nos permite dotarlos de un cielo y de un
suelo, añadiendo realismo de esta forma a la escena que se pretende crear. Estos
fondos se van a caracterizar porque siempre le van a dar al visitante la sensación de
que se encuentran a una gran distancia. Por otra parte, su coste es menor que el uso
de geometrías.

Se distinguen dos tipos de fondos:


Backdrop: Este tipo de fondo se caracteriza por definir un cielo y un suelo cuyos
colores vienen dados mediante gradientes. Se realiza dentro de una esfera (Sphere).
Panorama: Este tipo de fondo se caracteriza porque define una serie de imágenes
que rodean la escena. Se realiza dentro de una caja (Box).

NODO Background: Incorpora un plano de suelo sombreado, texturas y cielo


escénico. Sólo se emplea el primer nodo Background que se encuentre, debiéndose
especificar en el archivo principal.
Sintaxis:
Backgroud{ bottomURL "dirección_URL"
groundAngle [ ] frontUrl "dirección_URL"
groundColor [ ] leftUrl "dirección_URL"
skyAngle [ ] rightUrl "dirección_URL"
skyColor [ ] topUrl "dirección_URL"
backUrl "dirección_URL" }

146
UNIVERSIDAD PRIVADA TELESUP

Todos estos campos no se utilizan simultaneamente, sino que su uso dependerá del
tipo de fondo que se desee crear.
Backdrop
Sintaxis: Ejemplo:
Backgroud{ Backgroud{
groundAngle [ ] groundAngle [.785]
groundColor [ ] # color_RGB1,color_RGB2
skyAngle [ ] groundColor [ .14 .28 0,.09 .11 0 ]
skyColor [ ] skyAngle [.785 ]
} # color_RGB1,color_RGB2
skyColor [.02 0 .26, .02 0 .65 ]
}

Gráficamente podríamos obtener lo siguiente:

El fondo de tipo Backdrop se construye mediante una esfera incompleta (el suelo)
inmersa dentro de otra esfera completa (elcielo), en donde el visitante se situa en el
centro de ambas. Estas esferas tienen un radio infinito.
El campo skyColor determina el color del cielo en los distintos ángulos de la esfera
que lo contiene.El primer valor de este campo determina el color del cielo en los 0.0
radianes de la esfera, es decir, el color que tiene el cielo en el lugar donde se une con
el suelo.

147
UNIVERSIDAD PRIVADA TELESUP

El campo skyAngle es utilizado para indicar los ángulos (en radianes) en los que un
nuevo color debe aparecer. El campo skyColor debe poseer N+1 colores si en
skyAngle se han definido N ángulos, ya que el ángulo 0.0 (que es el que se
corresponde con el cielo del horizonte) no se incluye en este último.
Los campos groundColor y groundAngle, son equivalentes askyColor y skyAngle
respectivamente, pero referidos a la esfera que representa el suelo.
Si se especifica más de un color, se interpolará el color del suelo entre los colores de 0
a 90 grados en el horizonte (plano X-Z). De forma similar se interpretan los colores del
cielo, de 90 a 180 grados en la vertical (plano X-Y).

PANORAMA
Sintaxis: Ejemplo:
Backgroud{ Backgroud{
backUrl "dirección_URL" backUrl "ba_image.jpg"
bottomURL "dirección_URL" bottomURL "bo_image.jpg"
frontUrl "dirección_URL" frontUrl "f_image.jpg"
leftUrl "dirección_URL" leftUrl "l_image.jpg"
rightUrl "dirección_URL" rightUrl "r_image.jpg"
topUrl "dirección_URL" topUrl "t_image.jpg"
} }

Gráficamente podríamos obtener lo


siguiente:

El fondo de tipo Panorama consiste en seis imágenes, cada una de las cuales ocupa
una de las caras de una inmensa caja centrada en el eje de coordenadas. Las
imágenes que ocupan cada una de las caras vendrán determinadas por los valores de
los campos backUrl, bottomUrl, frontUrl, leftUrl, rightUrl, topUrl. Todos estos campos
toman como valor una dirección URL de un archivo que contiene una imágen en
formato jpeg, gif o png.

148
UNIVERSIDAD PRIVADA TELESUP

Utilización TEMA 3
de
Niebla
Competencia:
Reconocer el uso de los nodos de niebla o
fenómenos atmosféricos a un entorno
gráfico.

149
UNIVERSIDAD PRIVADA TELESUP

Tema 03: Utilización de Niebla

Mediante la utilización de niebla es posible simular fenómenos atmosféricos,


modificando a través de ella el aspecto de los objetos en función de la distancia a la
que nos encontremos de estos.
NODO Fog: Este es el nodo que permite la simulación de fenómenos atmosféricos
mezclando su color con el de los objetos a su alcance.
Sintaxis: Ejemplo:
Fog{ Fog{
color color_RGB color 1 1 1
fogtype "Tipo_niebla" fogtype "LINEAR"
visibilityRange valor_real visibilityRange 1
} }

La niebla oscurece totalmente los objetos a través


del color definido en su campo color. El campo
visibilityRange indica la distancia en metros a la
cual los objetos no son visualizados por el visitante.
La visibilidad va decreciendo desde el punto donde
se encuentra el visitante hasta el límite indicado por
este campo, donde la visibilidad es nula. Los
objetos más cercanos se verán débilmente afectados por la niebla.

El campo fogType controla el grado con el


que el color de la niebla afecta al resto de
los objetos. El tipo por defecto es LINEAR,
lo cual indica que la función que se utiliza
para ocultar los objetos es lineal. La otra
opción es EXPONENTIAL, con la que se
emplea una función exponencial, dando lugar a un efecto de niebla más realista.

150
UNIVERSIDAD PRIVADA TELESUP

A continuación se muestran una serie de ejemplos para clarificar estos conceptos:


I) Escenario sin niebla:

II) Escenario con niebla (día):

III) Escenario con niebla (noche):

151
UNIVERSIDAD PRIVADA TELESUP

Niveles de Detalle
Definir objetos con diferentes niveles de detalle va a permitir una mayor optimización
del escenario virtual, ya que los objetos más lejanos al visitante se representan
mediante formas más simples de las que tendrían si se estuviese junto a ellos. Otra de
sus ventajas es que se reduce el tiempo de carga del mundo VRML.
NODO LOD (Level Of Detail):
Este nodo se utiliza para permitir a los navegadores conmutar automáticamente entre
varias presentaciones de objetos. Los hijos de este nodo representan generalmente el
mismo objeto u objetos, a distintos niveles de detalle, que van variando desde el
superior al inferior.

Sintaxis:
LOD{
center Eje_X Eje_Y Eje_Z
range [valor1,valor2,...,valorN]
level [Nodo1,Nodo2,...,NodoN,NodoN+1]
}
El campo center determina la posición que va a ocupar el objeto LOD dentro del
sistema de coordenadas.
El campo level contiene una lista de nodos que representan a un mismo objeto con
diferentes niveles de detalle, definiendose las representaciones de mayor nivel al
principio de la lista y los de menor nivel de detalle al final.

El campo range contiene una lista de valores en orden creciente que indican a qué
distancia se ha de conmutar entre una representación u otra. Para calcular esta
conmutación se calcula la distancia que hay entre el visitante y el punto central
especificado del LOD; si es menor que el primer valor de la lista rangeentonces se
dibuja el primer hijo de LOD indicado en la lista level; si está entre el primer y el
segundo valor de la lista range, se dibuja el segundo hijo, y así sucesivamente. Si en
la lista range figuran N valores, la lista level ha de tener N+1 hijos.

152
UNIVERSIDAD PRIVADA TELESUP

Cada valor del campo range debe ser menor que su predecesor, ya que de no ser así,
los resultados serían indefinidos. No se deben usar estos nodos para emular
comportamientos, ya que los resultados pueden no coincidir con el efecto deseado.
Por ejemplo, la utilización de un LOD para hacer que una puerta se abra cuando se
aproxima un usuario es posible que no dé resultado en todos los navegadores.
Ejemplo LOD de un objeto mediante reducción del número de detalles:

Ejemplo LOD de un objeto mediante simplificación de su geometría:

CONTROL DE COLISIONES
Nodo Collision:
Indica al navegador que objetos de la escena no se van a poder atravesar. Esto
permite evitar, por ejemplo, que los visitantes traspasen las paredes de un edificio. La
respuesta a la colisión la define el navegador (haciendo que se rebote en el objeto,
deteniéndose simplemente, etc.).

153
UNIVERSIDAD PRIVADA TELESUP

Dado que es muy costoso el cálculo de una colisión con una geometría compleja, para
aumentar la eficacia se puede utilizar un método que consiste en definir una geometría
alternativa que sirva como sustituto para colisiones. Esta geometría podría ser tan
imperfecta como un simple cuadrado o una esfera. Este volumen alternativo se usa
solamente para calcular la colisión con el visualizador. VRML ofrece volúmenes
alternativos de colisión para objetos mediante el nodo Collision.

Sintaxis:
Collision{
collide valor_lógico
proxy nodo
children [ ...]
}

Si el valor del campo collide es FALSE entonces no se realiza colisión con la


geometría afectada; si es TRUE el campo proxy define la geometría contra la que se
hace la prueba de colisión. Si el valor de proxy no está definido o es NULL, se
colisionará con la geometría real, y si no es NULL, contendrá la geometría que se
emplea para calcular las colisiones.

Utilización de Sonidos
La adición de sonidos al escenario le añade mayor realismo. Las principales
aplicaciones del sonido son: ruidos o músicas de fondo, sonidos localizados en un
determinado punto del escenario (como por ejemplo el sonido de una catarata) o
sonidos que se activan cuando se realiza una determinada acción (al pulsar un
interruptor, saltar una pared,etc.).
VRML utiliza dos nodos diferentes para controlar las fuentes de sonido:
Nodo AudioClip
Nodo Sound

154
UNIVERSIDAD PRIVADA TELESUP

NODO AudioClip:
Es utilizado básicamente para cargar el archivo (en formato .wav o .mid) donde se
encuentra almacenado el sonido. Se invoca el archivo a través de su dirección URL.
Sintaxis:
AudioClip{
url "dirección_URL"
description "descripción_del_sonido"
loop valor_lógico
pitch valor_real
}

El campo url contiene la dirección URL del archivo que contiene el sonido, ya sea en
formato .wav o .mid.
El campo description es una descripción textual del sonido.
El campo loop específica si el sonido se ha de repetir constantemente. Por defecto, el
sonido se reproduce una sola vez. Si el sonido no está en modo loop, el tiempo de
reproducción viene dado por la duración del archivo.
El campo pitch controla el tono y la velocidad con la que se reproduce el sonido. Solo
admite valores positivos. Si, por ejemplo, este campo tomase el valor 2.0, el sonido se
emitiría con el doble de su velocidad normal y con un tono una octava superior al del
sonido original.

NODO Sound:
Define una fuente de sonido situado en un lugar especifico 3D.
Sintaxis:
Sound{
source AudioClip{...} minBack valor_real
intensity valor_real maxFront valor_real
location Eje_X Eje_Y Eje_Z maxBack valor_real
direction Eje_X Eje_Y Eje_Z spatialize valor_real
minFront valor_real }

155
UNIVERSIDAD PRIVADA TELESUP

El campo source toma como valor un nodo de tipo AudioClip, en donde se define el
archivo de sonido a reproducir.
El campo intensity ajusta el volumen de cada fuente de sonido.Admite únicamente
valores entre 0 y 1. Una intensidad 0 es silencio y una intensidad 1, la correspondiente
a la contenida en el archivo de sonido.

El campo location determina en el espacio tridimensional la posición del foco de


sonido.
El campo direction específica un vector tridimensional normal, en cuya dirección se
emite el sonido.
Los campos minFront y minBack determinan, junto con la dirección, la extensión de
la región (hacia delante y hacia atrás respectivamente) donde la intensidad del sonido
es máxima.

De forma similar, los campos maxFront y maxBack determinan los límites de la


región a partir de la cual el sonido ya no será audible.
El campo spatialize determina la forma en la que se emite el sonido. Si su valor es
TRUE, el sonido parecerá provenir de un único punto ("musica2.wrl"). Por el contrario,
si su valor es FALSE, obtendremos un efecto envolvente, lo cual se utiliza para crear
sonidos ambientales ("musica1.wrl").

DESCRIPCIÓN DEL MUNDO


Nodo WorldInfo: Contiene información sobre el mundo.
Sintaxis:
WorldInfo{
info [ "comentario1",
"comentario2",
...
"comentarioN"]
title "nombre_del_mundo"
}
El título se almacena en el campo title, permitiendo a los navegadores mostrarlo, por
ejemplo, en el borde de su ventana.

156
UNIVERSIDAD PRIVADA TELESUP

INTRODUCCIÓN A 3D STUDIO
Autodesk 3Ds Max (anteriormente 3D Studio Max) es un programa de creación de
gráficos y animación 3D desarrollado por Autodesk.Fue desarrollado originalmente por
Kinetix como sucesor para sistemas operativos Win32 del 3D Studio creado para DOS.
Más tarde esta compañía fue fusionada con la última adquisición de Autodesk,
Discreet Logic. 3Ds Max es uno de los programas de animación 3D más utilizados.
Dispone de una sólida capacidad de edición, una omnipresente arquitectura de plugins
y una larga tradición en plataformas Microsoft Windows. 3Ds Max es utilizado en
mayor medida por los desarrolladores de videojuegos, aunque también en el desarrollo
de proyectos de animación como películas o anuncios de televisión, efectos especiales
y en arquitectura.

Desde la primera versión 1.0 hasta la 4.0 el programa pertenecía a Autodesk con el
nombre de 3d Studio. Más tarde, Kinetix compró los derechos del programa y lanzó 3
versiones desde la 1.0 hasta la 2.5 bajo el nombre de 3d Studio Max. Más tarde, la
empresa Discreet compró los derechos, retomando la familia empezada por Autodesk
desde la 4.0 hasta 6.0 también bajo el nombre de 3d Studio Max. Finalmente,
Autodesk retomó el programa desarrollándolo desde la versión 7.0 y a partir de la
versión 9 se denomina Autodesk 3D Studio Max.

Este programa es uno de los más reconocidos modeladores de 3d masivo,


habitualmente orientado al desarrollo de videojuegos, con el que se han hecho
enteramente títulos como las sagas ‘Tomb Raider’, ‘Splinter Cell’ y una larga lista de
títulos de la empresa Ubisoft. Es habitual comenzar con primitivias geométricas
básicas, y aplicar posteriormente operadores y transformadores de los elementos que
forman esas primitivas. Estas primitivas habitualmente están definidas mediante una
descripción algorítmica (una función de un programa), y pueden ser distintas según el
programa empleado. En la Figura 01 se muestran algunas primitivas que pueden
utilizarse con Blender. Primitivas en Blender: Para acceder al menú de primitivas en
Blender, basta con situar el puntero del ratón en una ventana 3D y pulsar Barra
Espaciadora. Accedemos a un menú contextual, dentro de la opción Add encontramos
varias primitivas de alto nivel en Mesh como cubos, cilindros, conos... y a la cabeza
de mono que usamos en la primera práctica del curso. Dentro del menú Add podemos
añadir otros elementos como superficies curvas (Curve), texto (Text), y otros
elementos.

157
UNIVERSIDAD PRIVADA TELESUP

Mundos TEMA 4
Virtuales
en 3D
Competencia:
Emplear diferentes técnicas de modelados en
3D para mundos virtuales.

158
UNIVERSIDAD PRIVADA TELESUP

Tema 04: Mundos Virtuales en 3D

Modelado: Modelar es uno de los primeros pasos en la generación de gráficos por


computador. Al igual que un escultor modela sus figuras en el mundo real, el
modelador 3D da forma a los objetos virtuales mediante diferentes técnicas. Las
técnicas básicas más extendidas son el modelado a partir de formas, el modelado de
geometrías y la malla poligonal editable.

Modelado a partir de formas


Las formas son líneas y grupos de líneas 2D, cuya principal
función es servir de base para la creación de objetos 3D. 3d Studio
Max y otros paquetes de modelado incluyen una serie de formas bidimensionales
que, con la ayuda de algunos modificadores paramétricos, pueden dar lugar a
modelos tridimensionales. Con paramétricos se quiere indicar que es posible elegir la
intensidad de la modificación, generalmente introduciendo datos numéricos.

1. Línea: está formada por vértices y


segmentos que pueden ser movidos en
diferentes direcciones, lo que permite darle
la forma deseada.
2. Círculo: es posible especificar el radio que
queremos que tenga.
3. Arco: se puede determinar el radio, así como el punto en el que éste comienza
y termina, y puede cerrarse hasta alcanzar la forma de un círculo.
4. Ngon: permite crear formas poligonales con diferente número de lados.
También es posible modificar su radio.
5. Texto: cuando se emplea esta forma, el panel de modificaciones se convierte
en un editor de textos. Se puede elegir el tamaño de la letra, la fuente, si va en
negrita o en cursiva y el tipo de alineación (justificado, alineado a la derecha O
alineado a la izquierda).

159
UNIVERSIDAD PRIVADA TELESUP

6. Estrella: permite obtener estrellas de diferente número de puntas y con


distintas longitudes de radio. La Figura 2 muestra diferentes modelos a los que
pueden dar lugar las formas a partir de la aplicación de diferentes
modificadores. Entre los principales modificadores empleados para que estas
formas pasen a ser modelos tridimensionales se encuentran la extrusión, el
biselado y el torno.

7. Extrusión: añade profundidad a una forma. Es un modificador muy empleado


para la creación de logotipos y textos 3D. La Figura 2 muestra un ejemplo de
extrusión de textos.
✓ Biselado: permite añadir bordes redondeados a los objetos extruidos.
✓ Torno: crea un objeto 3D mediante la rotación de una forma (por ejemplo,
una línea) alrededor de un eje. Es el método más extendido para la
creación de jarras, copas y otros objetos simétricos. Una vez aplicado el
torno, la forma se puede modificar para que no tenga una simetría perfecta
y simule con mayor exactitud una forma orgánica. Es el caso de la
manzana de la Figura 3.

160
UNIVERSIDAD PRIVADA TELESUP

Spline editable
Convertir una forma a spline' editable significa que ésta se dividirá en subobjetos
desde los cuales podrá ser manipulada. Los tres tipos de sub objetos desde los que
se puede trabajar son:
• Vértices: unen los & diferentes segmentos y definen tangentes de punto y
curva.
• Segmentos: conectan los distintos vértices.
• Splines: son la unión de los segmentos con los vértices.

Modelado de geometrías
El modelado a partir de geometrías se lleva a cabo, principalmente, a partir de
primitivas y de objetos de composición.
Modelado a partir de primitivas
Los programas de modelado suelen incluir por defecto algunos objetos de formas
básicas, que se pueden modificar, combinar y personalizar mediante una serie de
modificadores y opciones que el software también ofrece.

Pueden ser empleadas para crear objetos básicos que no requieran excesivo detalle
o que aparezcan en planos generales donde se vean de lejos, o pueden ser
modificadas o combinadas con otras formas. Entre éstas, se encuentran las
primitivas estándar y las extendidas.
Ambas son objetos paramétricos, es decir, mediante diferentes cantidades
numéricas, se define el diámetro, la altura, la anchura, así como el número de lados y
segmentos de altura que necesiten tener.

161
UNIVERSIDAD PRIVADA TELESUP

Primitivas estándar
Determinados objetos de formas simples del mundo real, como un balón o una caja,
pueden modelarse utilizando una sola primitiva. Las primitivas también pueden
combinarse para formar objetos más complejos. La Figura 5 muestra una
recopilación de las primitivas más empleadas.

1. Caja: se le puede modificar el ancho, el largo y el alto, y se le pueden añadir


segmentos a lo ancho, a lo largo y a lo alto, y se le pueden añadir segmentos
en estas tres direcciones.
2. Esfera: se le puede definir el radio y el número de segmentos. Puede ser una
esfera al completo, o se puede dejar sin cerrar, lo que puede ser útil para crear
gráficos de tartas o los conocidos comecocos.
3. Cilindro: se puede especificar el radio, la altura, el número de lados y el
número de segmentos que va a tener, tanto de base como de altura.

4. Toroide: se le puede definir el contorno (diferencia entre radio interno y radio


externo) y el número de lados. El software ofrece la opción de retorcer sus
segmentos (twist).
5. Tubo: se le puede definir el contorno (diferencia entre radio interno y radio
externo), la altura, el número de segmentos de altura y de base, así como el
número de lados.
6. Cono: se le puede definir los dos radios de los que se compone (el
correspondiente a la parte inferior y el correspondiente a la parte de superior),la
altura, el número de segmentos de altura y de base, así como el número de los
lados. Si nos fijamos en los componentes de un edificio, o de un monumento,
éstos tienen formas cuadradas, cónicas, esféricas, etc. Las tuberías tienen
forma de tubos y las columnas son cilindros o cajas rectangulares.

162
UNIVERSIDAD PRIVADA TELESUP

La recreación de ciudades en 3D se caracteriza por un uso muy amplio de este tipo


de primitiva. Las cajas, combinadas con una textura detallada, pueden dar lugar a las
cajas que en numerosos videos juegos de plataformas sirven como obstáculos, como
escalón o como contenedor de recursos para el jugador. Del mismo modo, muchas
imágenes o animaciones que muestran los planetas del sistema solar se crean
mediante esferas. Las primitivas también son frecuentes en mundos virtuales.

Por ejemplo, la mayor parte de los objetos que se ven en SecondLife son primitivas
(o prims, nombre que reciben en el mundo virtual) que pueden ser creadas por el
usuario (Figura 6), bien a partir de la aplicación que ofrece Second Life, bien a partir
de programas como 3d Studio Max y Maya, para lo cual es necesario exportarlas
Posteriormente al mundo virtual.

Primitivas extendidas
Son una recopilación de primitivas de mayor complejidad. La Figura 7 muestra una
selección de las mismas.

163
UNIVERSIDAD PRIVADA TELESUP

Objetos de composición
Mediante la combinación de diferentes formas (2D)o geometrías (3D),es posible crear
objetos de mayor complejidad. Uno de los objetos de composición más empleadas a
partir de formas 2D es el solevado, mientras que en loreferente a las geometrías, está
la booleana.

Solevado
Los objetos solevados son formas bidimensionales extruidas a lo largo de un eje.
Estos objetos se crean a partir de dos o más objetos del tipos pline. Una de estas
splines es el recorrido (el eje sobre el cual se extruyen las formas) y el resto de splines
actúan como formas del objetos elevado. A medida que se disponen las formas en el
recorrido, el programa genera una superficie entre ellas. En la Figura 8 se ve cómo
mediante la creación de una línea(spline) y su edición, se genera el recorrido (o eje)
que seguirá el objeto. La forma será la de ambos círculos (que se intercalarán
repetidamente para dar lugar a la parte flexible de la pajita)

Booleanas
Mediante la intersección de diferentes primitivas estándar o extendidas, Se pueden
crear objetos de mayor complejidad. Ejemplo de ello son los objetos' booleanos, que
resultan de la combinación de dos objetos a los que se les ha aplicado una operación
booleana.

164
UNIVERSIDAD PRIVADA TELESUP

Es posible aplicar tres.


Tipos de operaciones booleanas:
✓ Unión: El objeto booleano contiene el volumen de ambos objetos originales. La
porción común o superpuesta de la geometría se elimina.
✓ Intersección: El objeto booleano sólo contiene el volumen común a ambos
objetos originales (es decir, el volumen de laintersección).
✓ Sustracción (o diferencia): El objeto booleano incluye elVolumen de un objeto
original, al que se le sustrae el volumen de la intersección.

La Figura 9 muestra un ejemplo de objeto booleano (el dado) Creado mediante una
operación de sustracción. A la caja se le sustrae el volumen de la intersección con la
esfera.

Modificadores
Además de la combinación de modelos, el software ofrece una serie de modificadores
(Figura 10) que se pueden aplicar a los modelos para que estos respondan a las
expectativas del modelador con mayor exactitud, y de esta forma dar lugar a objetos
de mayor detalle.

165
UNIVERSIDAD PRIVADA TELESUP

Malla PoligonalEditable
Cada objeto que el programa proporciona por defecto (lasprimitivas) puede ser
convertido en malla poligonal, lo que significa que el objeto se dividirá en subobjetos y
sus diferentes elementos podrán ser modificados mediante herramientas como mover,
rotar o escalar. Con ello se pueden conseguir formas más personalizadas u orgánicas,
adecuadas para la creación de personajes, animale o vegetales. Con sub objetos se
hace referencia a las distintas partes de las que se compone la malla y a los distintos
niveles con los que es posible modelar. Entre los principales sub objetos están:

Vértices: son los puntos formados por la intersección de dos o más Aristas que
concurren en un punto. La Figura 13 muestra un ejemplo de conversión de una caja
(primitiva) a malla poligonal. Mediante la selección de sus vértices, es posible mover,
rotar o escalar diferentes partes del objeto para darle la forma deseada.
✓ Aristas: son los lados de una cara o las líneas que conectan dos vértices.
✓ Polígonos: son las caras de las que se compone la malla. La Figura 14
muestra cómo es posible dar forma a un objeto Mediante la selección y el
movimiento de polígonos.

✓ Elemento: es el conjunto completo de polígonos del objeto seleccionado. El


pez de la Figura 15 ha sido creado mediante uno de los modelos Que ofrece el
software: una caja. La técnica de modelar objetos partir de cajas convertidas a
mallas poligonales está muy extendida y recibe el nombre de boxmodelling.

166
UNIVERSIDAD PRIVADA TELESUP

Al igual que ocurre con los segmentos de las primitivas, cuantos Menos polígonos
tengan los modelos, mejor. Uno de los requisitos a la hora de modelar puede ser el de
no elevar los requerimientos de procesado de los modelos para que estos se animen y
se rendericen de forma más rápida. Se habla de baja poligonización cuando un
modelo emplea los mínimos polígonos posibles para crear una imagen.

MODELADO DE UN PEZ
Tipos de mapas
Entre los mapas de texturizado básico, se
pueden encontrar los siguientes:
Bitmap: se trata de una imagen guardada
como matriz de píxeles en un formato
archivo de imagen fija, como jpeg, psd
obmp. Es el más empleado dado el alto
grado de personalización que permite. Un bitmap puede ser una fotografía de ladrillos
que se asigne a un rectángulo para simular una pared, o una imagen creada de la
nada desde Adobe Photoshop. La Figura 20 muestra un ejemplo de mapa de bits que
permite simular una superficie de madera.

Cuadros: Combinados colores en un radial de tres colores.

167
UNIVERSIDAD PRIVADA TELESUP

Rampa de degradado: Crea una gran variedad de rampas que pueden incluirlos
colores mapas y las mezclas que se prefieran (Figura 22).

Mapeado
Una vez se ha preparado la textura, ésta se puede colocar sobre la malla del modelo,
proceso que se conoce como mapeado. Si bien se ha dicho antes que el mapa podría
asimilarse a un envoltorio, el modificador un wrap (que podría ser traducido como
desenvolver) construye un envoltorio a partir de la geometría del objeto. Para ello este
modificador capta todos los polígonos de los que se compone el modelo y crea una
superficie plana a partir de ellos. Esa superficie plana puede ser usada a modo de
lienzo sobre el que crear una textura a partir de programas de tratamiento de
imágenes como Adobe Photoshop. Mientras se trabaja en ella, la textura suele
contener mucha información y capas, y se guarda como un archivo psd). Cuando se
termina de trabajar con ella se comprime en una sola capa y se guarda, por lo general,
como archivo jpeg o bmp.

La Figura 23 muestra cómo


mediante la selección de las
diferentes partes que conforman el
personaje se crean superficies
planas que podemos adaptar a
nuestras necesidades.

168
UNIVERSIDAD PRIVADA TELESUP
Lecturas Recomendadas
❖ EJEMPLOS CON VRML
http://mveu.blogspot.com/2008/10/vrml-virtual-reality-modeling-languaje.html

❖ ESCENARIOS INTERACTIVOS CON VRML


http://156.35.151.9/~smi/5tm/10trabajos-practicos/4/Memoria.pdf

Actividades y Ejercicios

1. En un documento en Word elabore un resumen sobre Second


Life (http://secondlife.com) como un mundo virtual, analiza y
comente las interfaces gráficas usadas y las posibilidades de
construir objetos multimedia.
Envíalo a través de "Second Life".

2. En un documento en Word elabore una lista de diez


aplicaciones en negocios, educación, política, medios de
comunicación sobre mundos virtuales.
Envíalo a través de "Aplicaciones".

169
UNIVERSIDAD PRIVADA TELESUP
Autoevaluación
1) ¿Qué nodo controla las propiedades del color que se van a dar al objeto?
a. El nodo material.
b. El nodo apparence.
c. El nodo geometry.
d. El noto texto.
e. El nodo color.

2) Permitir crear un grupo en donde los hijos, almacenados en distintos


ficheros VRML, que son recuperados indicando su dirección URL.
a. El nodo material.
b. El nodo apparence.
c. El nodo geometry.
d. El noto texto.
e. El nodo inline.

3) Crea un grupo especial en la que cualquier objeto seleccionado puede


saltar hacia otro lugar del escenario virtual o hacia otro mundo virtual
almacenado en un fichero VRML:
a. El nodo anchor.
b. El nodo inline.
c. El nodo material.
d. El nodo apparence.
e. El nodo geometry.

4) ¿Qué nodo crea una cuadrícula rectangular con alturas variables, lo que la
hace especialmente útil para modelar el terreno o superficies?
a. El nodo surface.
b. El nodo inline.
c. El nodo elevationgrid.
d. El nodo grilla.
e. El nodo geometry.

5) ¿Qué hace posible envolver un objeto con una imagen determinada que se
encuentra almacenada en un archivo?
a. Envoltura.
b. Textura.
c. Mascara.
d. Transformación.
e. Rugosidad.

170
UNIVERSIDAD PRIVADA TELESUP

6) Permite la simulación de fenómenos atmosféricos mezclando su color con


el de los objetos a su alcance.
a. Nodo DirectionalLight.
b. Nodo Fog.
c. Nodo SpotLight.
d. Nodo ElevationGrid.
e. Nodo surface.

7) Indica al navegador que objetos de la escena no se van a poder atravesar.


a. El Nodo Collision.
b. El Nodo LOD.
c. El Nodo Fog.
d. Nodo DirectionalLight.
e. Nodo SpotLight.

8) El modelado a partir de geometrías se lleva a cabo, principalmente, a partir


de:
a. Figuras en 3D.
b. Figuras en 1D.
c. Formas geométricas en 3D.
d. Primitivas y de objetos de composición.
e. Modelos simples en 3D.

9) La recreación de ciudades en 3D se caracteriza por un uso muy amplio de


figuras.
a. Compuestas.
b. Avanzadas.
c. Truncadas.
d. Renderizadas.
e. Primitivas.

10) Permite a los navegadores conmutar automáticamente entre varias


presentaciones de objetos.
a. Nodo Fog.
b. Nodo DirectionalLight.
c. Nodo SpotLight.
d. Nodo ElevationGrid.
e. Nodo LOD.

171
UNIVERSIDAD PRIVADA TELESUP
Resumen
UNIDAD DE APRENDIZAJE IV:

El nodo Material es el que controla las propiedades del color (selección del color, del
brillo, del grado de transparencia, etc.) que se van a dar al objeto. El nodo Inline va a
permitir crear un grupo en donde los hijos, almacenados en distintos ficheros VRML,
son recuperados indicando su dirección URL. El nodo Anchor crea un grupo especial ya
que seleccionando cualquier objeto perteneciente a dicho grupo se salta hacia otro lugar
del escenario virtual o hacia otro mundo virtual almacenado en un fichero VRML.

El Nodo ElevationGrid, crea una cuadrícula rectangular con alturas variables, lo que la
hace especialmente útil para modelar el terreno y para la creación de otras superficies
en el espacio. La textura es la posibilidad que tenemos de envolver un objeto con una
imágen determinada que se encuentra almacenada en un fichero, al cual accedemos
mediante su URL. El Nodo TextureTransform define una transformación 2D aplicada a
las coordenadas de textura.

El Nodo Fog, permite la simulación de fenómenos atmosféricos mezclando su color con


el de los objetos a su alcance. El Nodo LOD (Level Of Detail): se utiliza para permitir a
los navegadores conmutar automáticamente entre varias presentaciones de objetos. El
Nodo Collision: Indica al navegador que objetos de la escena no se van a poder
atravesar. El Nodo AudioClip: es utilizado básicamente para cargar el archivo (en
formato .wav o .mid) donde se encuentra almacenado el sonido.

Modelar es uno de los primeros pasos en la generación de gráficos por computador. Las
técnicas básicas más extendidas son el modelado a partir de formas, el modelado de
geometrías y la malla poligonal editable. Las formas son líneas y grupos de líneas 2D,
cuya principal función es servir de base para la creación de objetos 3D. El modelado a
partir de geometrías se lleva a cabo, principalmente, a partir de primitivas y de objetos
de composición.

172
UNIVERSIDAD PRIVADA TELESUP
Glosario
❖ APLICACIÓN: Es cualquier aplicación que es accedida vía web por una red como
internet o una intranet.
❖ ARQUITECTURA: Consiste en la estructura organizacional de un sistema.
❖ ATRIBUTO: Es una parte específica de una clase. Una propiedad de un tipo
identificada mediante un nombre.

❖ ENCRIPTACIÓN: Proceso por el que se transforma un grupo de datos en otro que


resulta ilegible para quien no posea los medios adecuados, garantizando así que
sólo el destinatario original del mensaje pueda leer su contenido. En algunos
celulares se puede encriptar la señal.

❖ ENTORNO GRÁFICO: Sistema operativo en el que la información que aparece en


pantalla aparece representada en forma gráfica, como es el caso de Windows.
❖ EVENTO: En el contexto de un diagrama de estado, un evento es un
acontecimiento que puede disparar una transición de estados.
❖ EVENTO TEMPORAL: Es un evento que ocurre en un tiempo particular. Puede ser
especificado por medio de una expresión temporal.
❖ GIF: Graphic Interchange Format. Formato de Intercambio Gráfico, un formato de
archivos gráficos popularizado inicialmente por Compuserve.

❖ HTML: HyperText Markup Language. Lenguaje de marcas de hipertexto mediante


"etiquetas", con el que se realizan las páginas web.
❖ JAVA: Lenguaje de programación independiente de la plataforma creado por Sun
Microsystems. Está pensado expresamente para una arquitectura cliente/servidor
en la que sólo es necesario intercambiar pequeñas porciones de código (llamadas
Applets) que son ejecutadas por el cliente.

❖ JPEG: (Joint Photographic Experts Group o Grupo de expertos de ensamble


fotográfico): Tipo de formato de imagen o compresión de imagen. Está pensado
especialmente para imágenes fotográficas por la calidad que da al comprimir
éstas.

❖ VRML: Lenguaje de programación que permite elaborar programas en tres


dimensiones.

173
UNIVERSIDAD PRIVADA TELESUP
Fuentes de Información
BIBLIOGRÁFICAS:

REVUELTA DOMÍNGUEZ, Francisco Ignacio, Dinámica en Mundos Virtuales


Editorial Graphics Edición 2011.

ILDE GÁMEZ, Martín Aprenda a crear mundos virtuales en 3D, Editorial


Graphics Edición 2010.

RODGER LEA, Kouichi, Java en 3D y VRML , Editorial Pearson 2009.

DON BRUTZMAN, Leonard Daly. Graficos en 3D para Web Editorial World,


2010

ELECTRÓNICAS:

❖ JAVA: J2ME
http://www.lcc.uma.es/~galvez/ftp/libros/J2ME.pdf

❖ Multimedia en Java
http://www.uv.es/~jgutierr/MySQL_Java/GUI.pdf

❖ Java 3D
http://www.itescam.edu.mx/principal/sylabus/fpdb/recursos/r89548.PDF

❖ VRML
http://tecfa.unige.ch/guides/vrml/vrmlman/vrmlman.pdf

❖ Cortona 3D
http://webdelprofesor.ula.ve/ingenieria/pfaraujo/personal/Geometr%EDa%20Desc
riptiva%20en%20%20VRML/Inicio/Ayuda.pdf

174
UNIVERSIDAD PRIVADA TELESUP
Solucionario

UNIDAD DE UNIDAD DE
APRENDIZAJE 1 APRENDIZAJE 2:
1. A 1. A
2. B 2. E

3. C 3. C

4. A 4. B
5. B 5. A
6. C 6. C
7. D 7. D
8. E 8. D
9. D 9. A
10. E 10. E

UNIDAD DE UNIDAD DE
APRENDIZAJE 3: APRENDIZAJE 4:

1. A 1. A
2. C 2. E
3. C 3. A
4. E 4. C
5. E 5. B
6. A 6. B
7. D 7. A
8. C 8. D
9. C 9. E
10. A 10. E

175

También podría gustarte