Los applets de Java son pequeñas aplicaciones que, habitualmente, aparecen integradas en páginas web. El applet se ejecuta dentro del navegador, mediante un contenedor, a través del plugin de Java. Este tipo de aplicaciones pueden añadir interactividad a una página web.
El software de generación de contenidos didácticos eXe Learning, dispone de un iDevice que permite la integración de los applets de Java en nuestros materiales. Si disponemos del applet integrado en una página HTML y de los ficheros del applet, la tarea de añadirlo en eXe es relativamente sencilla.
Els applets de Java són petites aplicacions que, habitualment, apareixen integrades en pàgines web. L’applet s’executa dins del navegador, mitjançant un contenidor, a través del plugin de Java. Aquest tipus d’aplicacions poden afegir interactivitat a una pàgina web.
El programari de generació de continguts didàctics eXe Learning, disposa d’un iDevice que permet la integració dels applets de Java en els nostres materials. Si disposem de l’applet integrat en una pàgina HTML i dels fitxers de l’applet, la tasca d’afegir-ho en eXe és relativament senzilla.
Integración de un applet en una página HTML
A la hora de crear contenido HTML debemos llevar cuidado con la compatibilidad del lenguaje en los diferentes navegadores. Determinadas propiedades que funcionan a la perfección en Firefox, pueden visualizarse de un modo incorrecto en Explorer o viceversa. En cualquier caso, debemos procurar la máxima compatibilidad con los distintos navegadores, mediante la utilización de código estandarizado. La inclusión de applets es una de esas cosas que funciona de manera diferente según el navegador.
El ejemplo que vamos a utilizar, inserta el applet en la página HTML, mediante la etiqueta OBJECT (propia de XHTML). Anteriormente, se utilizaba directamente la etiqueta APPLET.
Antes de ver el código, debemos saber que los archivos con extensión .class, son los que contienen el programa en Java.
Por otro lado, podemos encontrar archivos con extensión .jar. Son archivos comprimidos que contienen un conjunto de otros archivos (algo así como el formato .zip). Por ejemplo, cuando creamos un applet, todos los archivos que utilicemos en el proyecto, como imágenes, sonidos y las propias clases de Java, se almacenarán en un archivo .jar. En ocasiones, dependiendo del tipo de applet y del programa que utilicemos para crearlo, no dispondremos de este tipo de archivos.
A continuación, vamos a ver un código de ejemplo para incluir un applet en una página HTML:
<p> <!--[if !IE]>--> <object classid="java:minimos.class" type="application/x-java-applet" height="540" width="690" > <param name="codebase" value="minimos" /> <param name="archive" value="minimos.jar, swing-layout-1.0.jar, jfreechart-1.0.9.jar,jcommon-1.0.12.jar"/> <!--<![endif]--> <object classid="clsid:8AD9C840-044E-11D1-B3E9-00805F499D93" height="540" width="690" > <param name="codebase" value="minimos" /> <param name="code" value="minimos.class" /> <param name="archive" value="minimos.jar, swing-layout-1.0.jar, jfreechart-1.0.9.jar,jcommon-1.0.12.jar"/> </object> <!--[if !IE]>--> </object> <!--<![endif]--> </p>
Vamos a describir brevemente algunas de las líneas de código:
- Las etiquetas que comienza con los símbolos “<!–” como “<!–[if !IE]>–>“, las utilizamos para indicar dos modos de incrustar el applet, dependiendo de si el navegador que utilizamos es Explorer o no. De este modo, tendremos dos etiquetas OBJECT.
- Si el navegador no es Explorer, la etiqueta OBJECT tiene la siguiente estructura:
<object classid=”java:minimos.class” type=”application/x-java-applet” height=”540” width=”690“> - Si el navegador es Explorer, la etiqueta OBJECT tiene la siguiente estructura:
<object classid=”clsid:8AD9C840-044E-11D1-B3E9-00805F499D93” height=”540” width=”690” > - <param name=”code” value=”minimos.class” />:
en la parte de código del navegador Explorer, debemos indicar el fichero fuente del applet (extensión .class) en el parámetro “code“, ya que no se indica en la etiqueta OBJECT. - <param name=”codebase” value=”.” />:
el parámetro “codebase” indica la ruta en la que se encuentran los archivos pertenecientes al applet. Por ejemplo, en la siguiente imagen podemos ver que el fichero HTML se encuentra en una carpeta diferente al resto de archivos del applet (que están dentro de la carpeta “mínimos“). En este caso, el valor de “codebase” debería ser value=”minimos”.
Cuando eXe genera el contenido en formato HTML, introduce todos los archivos necesarios en la misma carpeta. Por este motivo, siempre que integremos un applet en eXe, debemos asignar el valor ‘.’ al parámetro “codebase” (así indicamos que los archivos se encuentran en la misma carpeta).
- <param name=”archive” value=”minimos.jar, swing-layout-1.0.jar, jfreechart-1.0.9.jar,jcommon-1.0.12.jar“/>:
si nuestro applet incluye archivos .jar, en el parámetro “archive” debemos especificar el nombre de todos los ficheros necesarios. Si no, no hace falta incluir esta línea.
Integrando el applet en eXe Learning
En cualquier caso, si nuestro applet funciona correctamente en un navegador, no tendríamos que tener problemas al insertarlo en eXe. Para ello debemos utilizar el iDevice llamado “Applet de Java“. En el cuadro “Código del applet” pegaremos el código HTML necesario, teniendo la precaución de cambiar el valor del parámetro codebase a un punto. Para copiar el código HTML, podemos abrir el archivo web, por ejemplo con el bloc de notas.
Mediante el botón “Agregar Archivos” debemos buscar los archivos necesarios en nuestro disco duro y, a continuación, pulsar en “Cargar“, para que se añadan a nuestro proyecto de eXe. Todos los archivos que hayamos incluido se muestran bajo el código del applet.
Tras aceptar los cambios, en la previsualización, no veremos nada. Para comprobar el correcto funcionamiento del applet, debemos exportar los contenidos como página web.
En la carpeta generada, debemos buscar el archivo “index.html” para abrir la página principal de los contenidos en el navegador. En nuestro caso, el resultado es el siguiente:
Enlaces
- Descarga el fichero “applet.elp” utilizado de ejemplo. El applet incluido pertenece a la profesora de la Universidad de Alicante Carmen Vázquez Ferri.
- En este enlace puedes visualizar un applet integrado en una página HTML. Todos los navegadores permiten visualizar el código HTML de la página que muestran. Por ejemplo, en Firefox, podemos pinchar con el botón derecho del ratón sobre la página y elegir la opción “Ver código fuente de la página“. De este modo, podemos ver los distintos tipos de código que se utilizan para integrar un applet.
Integració d’un applet en una pàgina HTML
A l’hora de crear contingut HTML hem de portar cura amb la compatibilitat del llenguatge en els diferents navegadors. Determinades propietats que funcionen a la perfecció en Firefox, poden visualitzar-se d’una manera incorrecta en Explorer o viceversa. En qualsevol cas, hem de procurar la màxima compatibilitat amb els diferents navegadors, mitjançant la utilització de codi estandarditzat. La inclusió d’applets és una d’aqueixes coses que funciona de manera diferent segons el navegador.
L’exemple que utilitzarem, insereix l’applet en la pàgina HTML, mitjançant l’etiqueta OBJECT (pròpia de XHTML). Anteriorment, s’utilitzava directament l’etiqueta APPLET.
Abans de veure el codi, hem de saber que els arxius amb extensió .class, són els que contenen el programa en Java.
D’altra banda, podem trobar arxius amb extensió .jar. Són arxius comprimits que contenen un conjunt d’altres arxius (alguna cosa així com el format .zip). Per exemple, quan creem un applet, tots els arxius que utilitzem en el projecte, com a imatges, sons i les pròpies classes de Java, s’emmagatzeman en un arxiu .jar. En ocasions, depenent del tipus d’applet i del programa que utilitzem per a crear-ho, no disposarem d’aquest tipus d’arxius.
A continuació, veurem un codi d’exemple per a incloure un applet en una pàgina HTML:
<p> <!--[if !IE]>--> <object classid="java:minimos.class" type="application/x-java-applet" height="540" width="690" > <param name="codebase" value="minimos" /> <param name="archive" value="minimos.jar, swing-layout-1.0.jar, jfreechart-1.0.9.jar,jcommon-1.0.12.jar"/> <!--<![endif]--> <object classid="clsid:8AD9C840-044E-11D1-B3E9-00805F499D93" height="540" width="690" > <param name="codebase" value="minimos" /> <param name="code" value="minimos.class" /> <param name="archive" value="minimos.jar, swing-layout-1.0.jar, jfreechart-1.0.9.jar,jcommon-1.0.12.jar"/> </object> <!--[if !IE]>--> </object> <!--<![endif]--> </p>
Descriurem breument algunes de les línies de codi:
- Les etiquetes que comencen amb els símbols “<!–” com “<!–[if !IE]>–>“, les utilitzem per a indicar dues maneres d’incrustar l’applet, depenent de si el navegador que utilitzem és Explorer o no. D’aquesta manera, tindrem dues etiquetes OBJECT.
- Si el navegador no és Explorer, l’etiqueta OBJECT té la següent estructura:
<object classid=”java:minimos.class” type=”application/x-java-applet” height=”540” width=”690“> - Si el navegador és Explorer, l’etiqueta OBJECT té la següent estructura:
<object classid=”clsid:8AD9C840-044E-11D1-B3E9-00805F499D93“ height=”540” width=”690” > - <param name=”code” value=”minimos.class” />:
en la part de codi del navegador Explorer, hem d’indicar el fitxer font de l’applet (extensió .class) en el paràmetre “code“, ja que no s’indica en l’etiqueta OBJECT. - <param name=”codebase” value=”.” />:
el paràmetre “codebase” indica la ruta en la qual es troben els arxius pertanyents a l’applet. Per exemple, en la següent imatge podem veure que el fitxer HTML es troba en una carpeta diferent a la resta d’arxius de l’applet (que estan dins de la carpeta “minimos“). En aquest cas, el valor de “codebase” hauria de ser value=”minimos”.Quan eXe genera el contingut en format HTML, introdueix tots els arxius necessaris en la mateixa carpeta. Per aquest motiu, sempre que integrem un applet en eXe, hem d’assignar el valor ‘.‘ al paràmetre “codebase” (així indiquem que els arxius es troben en la mateixa carpeta).
- <param name=”archive” value=”minimos.jar, swing-layout-1.0.jar, jfreechart-1.0.9.jar,jcommon-1.0.12.jar“/>:
si el nostre applet inclou arxius .jar, en el paràmetre “archive” hem d’especificar el nom de tots els fitxers necessaris. Si no, no fa falta incloure aquesta línia.
Integrant l’applet en eXe Learning
En qualsevol cas, si el nostre applet funciona correctament en un navegador, no hauríem de tenir problemes en inserir-ho en eXe. Per a açò hem d’utilitzar l’iDevice anomenat “Applet de Java“. En el quadre “Codi de l’applet” pegarem el codi HTML necessari, tenint la precaució de canviar el valor del paràmetre codebase a un punt. Per a copiar el codi HTML, podem obrir l’arxiu web, per exemple amb el bloc de notes.
Mitjançant el botó “Agregar Arxius” hem de cercar els arxius necessaris en el nostre disc dur i, a continuació, prémer a “Carregar“, perquè s’afigen al nostre projecte d’eXe. Tots els arxius que hàgem inclòs es mostren sota el codi de l’applet.
Després d’acceptar els canvis, en la previsualització, no veurem gens. Per a comprovar el correcte funcionament de l’applet, hem d’exportar els continguts com a pàgina web.
En la carpeta generada, hem de cercar l’arxiu “index.html” per a obrir la pàgina principal dels continguts en el navegador. En el nostre cas, el resultat és el següent:
Enllaços
- Descarrega el fitxer “applet.elp” utilitzat d’exemple. L’applet inclòs pertany a la professora de la Universitat d’Alacant Carmen Vázquez Ferri.
- En aquest enllaç pots visualitzar un applet integrat en una pàgina HTML. Tots els navegadors permeten visualitzar el codi HTML de la pàgina que mostren. Per exemple, en Firefox, podem punxar amb el botó dret del ratolí sobre la pàgina i triar l’opció “Veure codi font de la pàgina“. D’aquesta manera, podem veure els diferents tipus de codi que s’utilitzen per a integrar un applet.